简体   繁体   中英

Getting updated input value for further update in jQuery

I use an Ajax form (with JQuery Validation Plugin) on my site. It works except for the following problem: if I enter something in a text field and then click on the send button, the value is updated. With each next update, however, the old value is always used. I already understand that I may have to work with.on or.keyup, but I understand how to properly integrate it into the code, after the click or outside...

Update: I have several fields in the form. Here is simplified code. I also noticed that after the first update of the form, no fields can be updated with newly entered values. All values remain old.

HTML:

<form id="org-684" class="org">
    <input class="org-name" type="text" name="name" value="" required>
    <button type="submit" class="updateOrg">Update</button>
</form>

JS:

$(document).ready(function(){
    $('.updateOrg').click(function() {
        var id = $(this).closest(".org").attr("id");
        id = id.split('-');
        id = id[1];
        var org_id_attr = "#org-"+id;
        var org_name = $(org_id_attr).find(".org-name").val();
        $(org_id_attr).validate({
            submitHandler: function() {
                $.ajax({
                    type: "POST",
                    url: "update.php",
                    data: ({
                        id: id,
                        org_name: org_name
                    }),
                    success: function(response){
                        var result = jQuery.parseJSON(response);
                        $(org_id_attr).find(".org-name").val(result.name);
                    },
                    error: function() {

                    },
                    cache: false
                });
                return false;
            }
        });
    }); 
})

PHP:

<?php
$orgId = $_POST['id'];
$orgName = $_POST['org_name'];
$select = "
SELECT 
    name
FROM 
    org
WHERE 
    id = $orgId
";
$result = $mysqli->query($select); 
$row = $result->fetch_row();
$res = array(
    'name' => $row[0]
 );
echo json_encode($res);

I solved the problem. You just have to put the variables from the form behind the "SubmitHandler".

$(org_id_attr).validate({
    submitHandler: function() {
        var org_name = $(org_id_attr).find(".org-name").val();
        $.ajax({
            type: "POST",

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM