Question

So I have this form:

echo '<form id="target" action="edit-property.php?Property='.$property.'" method="post">';
echo "Address: ".'<input type="text" name="address" value="'.$propAddress.'" />';
echo '<input type="submit" value="Update">';
echo "</form>";

And on submission I change the database entry with this function (I’m still learning the change from mysql to mysqli, so im not sure if i’ve done it right and I don’t totally know how to bind params when it comes to updating a table, but thats not my question)

$property = $_GET['Property']
if (isset($_POST['address']) && !empty($_POST['address'])) {
$mysqli = new mysqli(DB_SERVER, DB_USER, DB_PASSWORD, DB_NAME);
    if (!$mysqli) {
        die('There was a problem connecting to the database.');
    }
    else {
        $address = mysqli_real_escape_string($mysqli, $_POST['address']);
        $id = intval($property);
        if($id) {
        $query =("UPDATE Properties
            SET Address = '$address'
            WHERE Id = '$id'");
            if (mysql_query($query)){
                echo '1';
                exit;
            }
            else {
                echo '0';
                exit;
            }
            $mysqli->close(); 
        }
    }
}

Alrighty. So that works ok (please feel free to correct me if i’ve done something stupid here, I find that I learn best through the criticism and stackoverflow has helped me heaps in improving!)

But here’s my dilemma. I want to update on page without having to refresh the page.

I came across the code below, modified it to suit me and unfortunately it isn’t working. I’m afraid I don’t know why:

<script>
var id = <?=$id?>;
// when the DOM is ready
$(document).ready(function() {
    $('#target').submit(function(e) {
        // prevent normal, boring, tedious form submission
        e.preventDefault();
        // send it to the server out-of-band with XHR
        $.post('edit-property.php?Property=' + id, function() {
            data: $(this).val(),
            success: function(resp) { 
                if(resp == '1') {
                    alert('Saved successfully');
                } else {
                    alert('Oops, something went wrong!');
                }
            }
        });
    });
});
</script>

It’s a mystery unfortunately – Can’t get it working. What could I be doing wrong?

Thank you 🙂

Answer 1

I think you’ve misunderstood the syntax of this call and you have wrapped some of the parameters intended for the $.post into a superfluous “function” that your probably expected to use for completion.

$.post('edit-property.php?Property=' + id, 
            /*function() {*/
            data: $(this).val(),
            success: function(resp) { 
                if(resp == '1') {
                    alert('Saved successfully');
                } else {
                    alert('Oops, something went wrong!');
                }
            /*}*/
        });