[英]How can I use Ajax and Jquery to load data into a div then, insert form data and reload the data into the div?
[英]How can i load data from ajax to Chosen jquery?
我在http://harvesthq.github.io/chosen/使用了选择。 好的,我测试它从 ajax 加载数据。 我在任何地方创立,也许没有人能成功。
<script src="theme/js/jQuery-2.1.3.min.js"></script> <link href="theme/chosen_v1.4.2/chosen.css" rel="stylesheet" /> <script src="theme/chosen_v1.4.2/chosen.jquery.js"></script> <script type="text/javascript" charset="utf-8"> $(document).ready(function () { $(".cb_bu_info").chosen({ width: "95%", source: function (data) { $.ajax({ type: "POST", url: "../BUS/WebService.asmx/LIST_BU", contentType: "application/json; charset=utf-8", dataType: "json", success: function (data) { $("#cb_info").html(''); //$.each($.parseJSON(data.d), function (idx, obj) { $.each(data, function (idx, obj) { $("#cb_info").append('<option value="' + obj.BU_ID + '">' + obj.BU_NAME + '</option>'); }); //$("#cb_info").trigger("liszt:updated"); }, error: function (data) { console.log(data.d); } }); } }); $("#cb_info").trigger("liszt:updated"); }); </script>
<select id="cb_info" class="cb_bu_info"></select>
数据形式ajax为
[{"BU_ID":"B01","BU_NAME":"Agro Feed","BU_DES":"Agro Feed","EDIT_DATE":"2015-05-05T00:00:00","EDIT_BY":"","FLAG":false},{"BU_ID":"B02","BU_NAME":"Agro Farm","BU_DES":"Agro Farm","EDIT_DATE":"2015-05-05T00:00:00","EDIT_BY":"","FLAG":false}]
嗯,看起来不错,但是当我运行它时,结果没有显示在选择选项中,请参阅浏览器开发工具,我没有看到错误。 一切正常。这里发生了什么问题? 注意:仅使用选择的 Jquery
查看了选择的文档后,似乎没有“源”选项。 您需要做的是首先运行您的 Ajax 调用,然后填写您的选择选项。 一旦选择全部填满,然后在该选择元素上运行选择。
我将使用以下 JS 代码:
var url = "../BUS/WebService.asmx/LIST_BU";
$.getJSON(url, function(json){
var $select_elem = $("#cb_info");
$select_elem.empty();
$.each(json, function (idx, obj) {
$select_elem.append('<option value="' + obj.BU_ID + '">' + obj.BU_NAME + '</option>');
});
$select_elem.chosen({ width: "95%" });
})
好的,经过一段时间在大家的建议的帮助下,我已经完成了
function load_cb_info() {
$.ajax({
type: "POST",
url: "../BUS/WebService.asmx/LIST_BU",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
$("#cb_info").html('');
$.each($.parseJSON(data.d), function (idx, obj) {
//$.each(data, function (idx, obj) {
$("#cb_info").append('<option value="' + obj.BU_ID + '">' + obj.BU_NAME + '</option>');
});
$("#cb_info").trigger("liszt:updated");
$("#cb_info").chosen({ width: "95%" });
},
error: function (data) {
console.log(data.d);
}
});
}
而且,我认为这是一个答案,其他人都可以找到。谢谢。
我已经改变了你的 jsfiddle。 试试这个http://jsfiddle.net/GaganJaura/by4d528c/2/
我已将 selected() 移至底部。
$("#cb_info").empty();
$.each(data, function (idx, obj) {
$("#cb_info").append('<option value="' + obj.BU_ID + '">' + obj.BU_NAME + '</option>');
});
$("#cb_info").trigger("liszt:updated");
$("#cb_info").chosen();
你可以尝试如下它对我有用
$.ajax({
type: "POST",
url: url,
data: formData,
processData: false,
contentType: false,
success:function(data){
if($.trim(data) != "no"){
$("#PROGRAM_ID").html(data);
$("#PROGRAM_ID").trigger("chosen:updated");
}
}
});
尝试这个。 这个对我有用。 请注意粗体字
Ext.Ajax.request({
url:'<?php echo base_url()."index.php/";?>ttemuan31a/cari_divisi',
method:'post',
params:{
divisi:vdivisi
},
success:function(data)
{
$("#divisi").chosen();
//document.getElementById('detail_divisi').innerHTML=response.responseText;
$('#divisi').empty();
$.each(JSON.parse(**data.responseText**), function(i, item) {
$('#divisi').append('<option value="'+item.id+'">'+item.namadivisi+'</option>');
$("#divisi").trigger("chosen:updated");
});
}
});
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.