JQuery (update form) - How-to pre-populate multiple selects first, then populate record data

I'm new to JQuery and I've been going mad over the last couple of days trying to resolve this. I'm working on a form used to update a customer order. What I'm trying to do is to first load the related select data (Order status, Supervisor, Seller's Group, Seller's list) and then (and only then) to load the order information (and select the correct option from the drop-down boxes). There are a lot of selects, so they have to be loaded asynchronously or else the page takes ages to load (and freezes in the meantime). The problem is, the form data ends up loading before the drop-downs, and the correct options are never selected. I tried to solve it using JQuery deferrends, but the form population always ends up firing before the selects are populated. Here is a reduced version of my code (with just one select): populateStates = function(field){ var dfd = new $.Deferred(); $.ajax({ url: "get-json-states.php", async: true, dataType: 'json', success: function (j) { var options = ''; $.each(j, function(key, value) { options += ''; }); $("select#"+field).html(options); // Sort options alphabetically sortListAlpha(field); // Append option: "all" appendListItem(field, '0', 'All'); // Select first item selectFistItem(field); // Resolve Deferred dfd.resolve(); } }); return dfd.promise(); // Returns a promise } populateFormGeneric = function (j, target) { $.each(j, function(key, value) { switch ($('#'+target+'-'+key).attr('type')) { case 'select-one': if (value==null) { $('#'+target+'-'+key).attr('value', '') } else { $('#'+target+'-'+key).attr('value', value) } break; } }); } populateCustomer = function(id){ $.ajax({ url: "get-json-customer.php?id="+id, async: false, dataType: 'json', success: function (j) { $.when(populateStates('state_id')).then(populateFormGeneric(j, "form1")); } }); } As you can see, the "populateFormGeneric" fires no matter what happens with the "populateStates" function (I can even leave it empty and it fires anyway). Please help. Much appreciated, Edward

以上就是JQuery (update form) - How-to pre-populate multiple selects first, then populate record data的详细内容,更多请关注web前端其它相关文章!

赞(0) 打赏
未经允许不得转载:web前端首页 » jQuery 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准