AJAX form sends information, PHP doesn't execute

Question

i had a issue with this exact form a fews days ago and was fixed with a different PHP thanks to you guys. Now i changed one thing in the form and it does not work anymore. I have alerted all the variables being sent through AJAX and they are correct values that i need. Here are the code for the HTML form:

 <?php
        include('php/connect.php');

        $chquery = "SELECT * FROM rooms";
        $chresult = mysqli_query($conn, $chquery);

        while($chrow = mysqli_fetch_array($chresult)){
            echo "<div class='edit_roomRow'>";
            echo "<h1> Rum " . $chrow['Roomnumber'] . "</h1>";
            echo "<form>";
            echo "Rumsnummer:<br> <input id='c-roomnumber' type='text' value = '" . $chrow['Roomnumber'] . "'><br>";
            echo "Beskrivning:<br> <input id='c-description' type='text' value = '" . $chrow['Description'] . "'>";
            echo "</form>";
            echo "<br>";
            *update* echo "<div class='btn btn-warning change-btn' data-value='". $chrow['ID'] . "' style='float: right; margin-top: 100px;'>Ändra</div>";
            echo "</div>";
            echo "<hr/>";
        }

        mysqli_free_result($chresult);

        mysqli_close($conn);

 ?>

The AJAX is here:

<script type="text/javascript">
    $(".change-btn").click(function(){
        var id = $(this).attr("data-value");
        var description = $("#c-description").val();
        var roomnumber = $("#c-roomnumber").val();
        //Call to ajax
        $.ajax({
            method:"GET",
            url: "php/changepost.php",
            data:{ id: id, description: description, roomnumber: roomnumber },
            success: function(){
                $("#c-description").val("");
                $("#c-roomnumber").val("");
                //Reload specific div with rooms, avoid full page reload
                $(".changerooms").load(location.href + " .changerooms");
            }
        })
    })
</script>

I have tried changing around the variables, in the php etc.

<?php
    mysqli_report(MYSQLI_REPORT_ERROR | MYSQLI_REPORT_STRICT);
    include('connect.php');

    if(isset($_GET['id'])){
        $stmt = mysqli_prepare($conn, "UPDATE rooms SET Roomnumber = ?, Description = ?, WHERE ID = ?");
        mysqli_stmt_bind_param($stmt, "isi", $_GET['roomnumber'], $_GET['description'], $_GET['id']);
        mysqli_stmt_execute($stmt);
    }

    mysqli_close($conn);

?>

The DB is setup like this:

ID | Description | Roomnumber| Cleaned | Cleaner | Time

The last three are irrelevant here but figued i show the full db setup. I can add new posts etc. with the same values but when it comes to changing something isn't right with this code. Hope someone can help me with this :)

You know that the PHP script is expecting `$_GET['roomid']` but you're not sending that in the AJAX `data` parameter, right? You're only sending `id`, `description`, and `roomnumber`. — aaronofleonard, Oct 21 '16 at 19:45
I'm sending roomnumber and the PHP is expecting $_GET['roomnumber'] as value for the column roomid in the database — Douglas Pettersson, Oct 21 '16 at 19:46
What I mean is, look at the line `if(isset($_GET['roomid'])){`.... — aaronofleonard, Oct 21 '16 at 19:47
You know the PHP script never returns anything, and just times out. — adeneo, Oct 21 '16 at 19:48
Changed it to $_GET['id'] now, so it checks if the selected post has an ID. Still does not work — Douglas Pettersson, Oct 21 '16 at 19:54
`id`'s MUST be unique in a page. Yours are not. So javascript does not know what to send to the PHP script — RiggsFolly, Oct 21 '16 at 20:16
Look at the javascript debugger in your browser F12 you should see some sort of error message — RiggsFolly, Oct 21 '16 at 20:17
@RiggsFolly Since the variables are sent through AJAX with the ID's a name is not needed. Putting names on there did not fix the issues.. :/ — Douglas Pettersson, Oct 21 '16 at 20:18
Yes but `var description =$("#c-description").val();` does not address JUST ONE ID..... hence nonsense rules — RiggsFolly, Oct 21 '16 at 20:19
@RiggsFolly Hmm.. I guess that is the issue then, that it is only adressing one of all ID's. Any ideas how i can select once specific posts value? — Douglas Pettersson, Oct 21 '16 at 20:27
@DouglasPettersson Use classes instead of IDs. Then you can use `$(this).closest(".edit_roomRow").find(".c-description")` to get the description field in the same form as the div they click on. — Barmar, Oct 21 '16 at 20:31
@Barmar Should i put that and then .val();? Like: $(this).closest(".edit_roomRow").find(".c-description").val(); — Douglas Pettersson, Oct 21 '16 at 20:43
You should use it when assigning to the variables `id`, `description`, and `roomnumber`. In the callback function, you'll need to use a closure variable instead of `$(this)`. See http://stackoverflow.com/questions/24539521/javascript-owner-of-this/24539572#24539572 — Barmar, Oct 21 '16 at 20:46
@Barmar Yes.. but how do i find the value of each of those input fields with the line you sent? Or can i after that assign normal var xxx = $(".c-roomnumber").val()? — Douglas Pettersson, Oct 21 '16 at 20:50

Barmar · Accepted Answer · 2016-10-21T21:21:52.663

0

You're reusing the same IDs in each DIV, you need to use classes instead. Then use DOM traversal functions to get the value of the input in the same DIV as the button the user clicked on.

This will require moving the </div> for the .edit_roomRow DIV to after the .change-btn DIV, so it's in the same DIV as the form.

PHP:

<?php
include('php/connect.php');

$chquery = "SELECT * FROM rooms";
$chresult = mysqli_query($conn, $chquery);

while($chrow = mysqli_fetch_array($chresult)){
    echo "<div class='edit_roomRow'>";
    echo "<h1> Rum " . $chrow['Roomnumber'] . "</h1>";
    echo "<form>";
    echo "Rumsnummer:<br> <input class='c-roomnumber' type='text' value = '" . $chrow['Roomnumber'] . "'><br>";
    echo "Beskrivning:<br> <input class='c-description' type='text' value = '" . $chrow['Description'] . "'>";
    echo "</form>";
    echo "<br>";
    echo "<div class='btn btn-warning change-btn' data-value='". $chrow['ID'] . "' style='float: right; margin-top: 100px;'>Ändra</div>";
    echo "</div>";
    echo "<hr/>";
}

mysqli_free_result($chresult);

mysqli_close($conn);

?>

JS:

$(".change-btn").click(function(){
    var div = $(this).closest(".edit_roomRow");
    var id = $(this).attr("data-value");
    var description = div.find(".c-description").val();
    var roomnumber = div.find(".c-roomnumber").val();
    //Call to ajax
    $.ajax({
        method:"GET",
        url: "php/changepost.php",
        data:{ id: id, description: description, roomnumber: roomnumber },
        success: function(){
            div.find(".c-description").val("");
            div.find(".c-roomnumber").val("");
            //Reload specific div with rooms, avoid full page reload
            $(".changerooms").load(location.href + " .changerooms");
        }
    })
})

edited Oct 21 '16 at 21:21

answered Oct 21 '16 at 21:02

Barmar

741,623
53
500
612

Don't know why, but the values become 'undefined' and the post resets to no value at all in the DB – Douglas Pettersson Oct 21 '16 at 21:10
I misread your HTML. You have the `change-btn` outside the DIV for some reason. – Barmar Oct 21 '16 at 21:17
Can you move it inside the `.edit_roomRow` DIV, or do I need to add another container to the HTML? – Barmar Oct 21 '16 at 21:18
I can try moving it inside, i figured that was the issue. So the .closest cannot search outside a div? – Douglas Pettersson Oct 21 '16 at 21:19
Of course not. The definition of `.closest()` is to find the nearest enclosing element. – Barmar Oct 21 '16 at 21:20
I updated my code and now have the
button inside the .edit_roomrow, still getting an undefined value, odd.
– Douglas Pettersson Oct 21 '16 at 21:25
Not sure now what's wrong. Check the DOM in the browser's developer tools, make sure everything is nested correctly and the classes are set correctly. – Barmar Oct 21 '16 at 21:28
Was a mixup in my div, tried changing to closest(form) just to try. Forgot to remove that. Now working perfectly. Thanks alot - Again, nice to have you guys here when newbies need help :) – Douglas Pettersson Oct 21 '16 at 21:34

AJAX form sends information, PHP doesn't execute

1 Answers1