jQuery versteckter Eingabewert leer auf jedem zweiten Beitrag

Question

Jedes zweite Mal, wenn ich auf den Speichern-Button klicke, wird es NICHT den Namen bekommen (der erste post-done wird den Namen als Antwort zurückgeben), aber es keinen Namen als Wert des Namens zuweisen Eingabe, die versteckt ist.

Wenn ich nicht mit nameInput.val(''); nach Erfolg veröffentlichen und speichern, wird es den zuletzt gespeicherten Namen erfolgreich geben.

$('#save').on('click', function() 
{ 
    var id = $("#field1").val(), 
    field2 = $("#field2").val(), 
    field3 = $("#field3").val(), 
    nameInput = $("#Name"), 
    comment = $("#comment").val(); 

    $.ajax({ 
     type: "POST", 
     data: { getCustomerName: id }, 
     url: 'dataprocess.php', 
     dataType: "json", 
     success: 
     function(response) 
     { 
      if(response.status == "success") 
      { 
       nameInput.val(response.customerName) 
      } 
      //alert(response.customerName); 
     }, 
     error: 
     function(response) 
     { 
      alert(response.status); 
     } 
    }); 

    var customerName = $("#Name").val(); 

    var data = { id: id, field2: field2, field3: field3, customerName: customerName, comment: comment }; 
    alert(customerName); 

    if(customerName == '') 
    { 
     var r = confirm("Name is empty, continue?"); 
    } 

    if(field2 == '' || field2 <= 0) 
    { 
     var r = confirm('Field2 empty, continue?'); 
    } 

    if(r == false) 
    { 
     return false; 
    } 

    $.ajax({ 
     type: "POST", 
     url: "dataprocess.php", 
     data: data, 
     dataType: "json", 
     success: 
     function(data) { 
     //        loader.hide(); 
     if(data.status === "error") 
     { 
      $('#notify').removeClass('alert-success').addClass('alert-danger'); 
     } 
     else 
     { 
      $('#notify').removeClass('alert-danger').addClass('alert-success'); 
      nameInput.val(''); 
     } 
      $('#notify').html(data.message).fadeIn(500).fadeOut(2000); 
     } 
    }); 
});  

Answer 1

Der Aufruf von $ .ajax ist asynchron. Sie müssen auf die Antwort warten, bevor Sie die Antwort verarbeiten.

$('#save').on('click', function() { 
 
    var id = $("#field1").val(), 
 
     field2 = $("#field2").val(), 
 
     field3 = $("#field3").val(), 
 
     nameInput = $("#Name"), 
 
     comment = $("#comment").val(); 
 

 
    $.ajax({ 
 
     type: "POST", 
 
     data: { 
 
      getCustomerName: id 
 
     }, 
 
     url: 'dataprocess.php', 
 
     dataType: "json", 
 
     success: function(response) { 
 
      if (response.status == "success") { 
 
       nameInput.val(response.customerName) 
 
       var customerName = $("#Name").val(); 
 
       var data = { 
 
        id: id, 
 
        field2: field2, 
 
        field3: field3, 
 
        customerName: customerName, 
 
        comment: comment 
 
       }; 
 
       alert(customerName); 
 

 
       if (customerName == '') { 
 
        var r = confirm("Name is empty, continue?"); 
 
       } 
 

 
       if (field2 == '' || field2 <= 0) { 
 
        var r = confirm('Field2 empty, continue?'); 
 
       } 
 

 
       if (r == false) { 
 
        return false; 
 
       } 
 

 
       $.ajax({ 
 
        type: "POST", 
 
        url: "dataprocess.php", 
 
        data: data, 
 
        dataType: "json", 
 
        success: function(data) { 
 
         //        loader.hide(); 
 
         if (data.status === "error") { 
 
          $('#notify').removeClass('alert-success').addClass('alert-danger'); 
 
         } else { 
 
          $('#notify').removeClass('alert-danger').addClass('alert-success'); 
 
          nameInput.val(''); 
 
         } 
 
         $('#notify').html(data.message).fadeIn(500).fadeOut(2000); 
 
        } 
 
       }); 
 
      } 
 
     }, 
 
     error: function(response) { 
 
      alert(response.status); 
 
     } 
 
    }); 
 
});