CODEWITHSUNDEEP
ajaxjson
Adam
Adam

Reputation: 307

Insert json data into text input

I have a function that adds a new patient to the database, gets the json data back and then adds the new patient to the select menu. That works fine. I need to add that data into the corresponding text inputs i.e., input#patient_id, input#patient_firstname, etc. which should occur in the .ajax complete, but nothing happens.

Would appreciate any help!!

Ajax

$('#newpatient').click(function() {
var patientadd = $('#patientaddform').serializeArray();
  $.ajax({
      url:      'adam.php',
      type:     "POST",
      data:     patientadd,
      dataType: 'json',
      success:  function(data){
                    var html = '';
                    var len  = data.length;
                    for (var i = 0; i< len; i++) {
                    html += '<option selected="selected" value="' + data[i].patient_id + '">' + data[i].patient_firstname + ' ' + data[i].patient_lastname + ' : ' + data[i].patient_dob + '</option>';
                    }
                    alert(html);
                    $('#patientselect').prepend(html);
                    $('#patientselect').selectmenu('refresh', true);
                }, 
      complete: function (data) {
                   for(var id in data) {        
                          $('input#' + id).val( data[id] );
                   }
                }     

  });

});

json data returned

[{"patient_id":"22","patient_firstname":"","patient_lastname":"","patient_dob":"0000-00-00"}]

the corresponding text input fields are input#patient_id, input#patient_firstname, etc, that is why I'm trying to add the 'input#' to the id in the ajax complete and then add that val to the text input.

Upvotes: 0

Views: 1853

Answers (2)

user28061
user28061

Reputation: 354

Your json data is an array of objects, so you have to add take the first element of the array like this:

for(var id in data[0]) {        
  $('input#' + id).val( data[0][id] );
}

Or you have to adapt the server response.

Also consider @techfoobar's answer:

The params for the complete call back are jqXHR and textStatus. Not data. See http://api.jquery.com/jQuery.ajax/ for the correct definition of complete(jqXHR, textStatus)

Upvotes: 0

techfoobar
techfoobar

Reputation: 66663

The params for the complete call back are jqXHR and textStatus. Not data. See http://api.jquery.com/jQuery.ajax/ for the correct definition of complete(jqXHR, textStatus)

Upvotes: 1

Related Questions