[英]populate modal form with json
我有一個這樣創建的模式形式:
function addeditNote(rowID,callback) {
var ret;
jQuery.fancybox({
modal : true,
overlayOpacity : 0.25,
content : "<div class=\"contentbox modal-window modal-400\"><div class=\"boxbody\"><div class=\"boxheader clear\"><h2>Add / Edit User Notes</h2></div><br /><div class=\"box-wrap clear\"><form action=\"\" method=\"post\" class=\"form bt-space0\"><div class=\"columns clear bt-space0\"><div class=\"colText fl\"><div class=\"form-field clear\"><label for=\"textfield\" class=\"formlabel size-20 fl-space2\">Name: </label><input type=\"text\" id=\"name\" class=\"text fl-space2\" /></div><div class=\"form-field clear\"><div class=\"fl-space2\"><label for=\"textarea\" class=\"formlabel size-20\">Notes: </label></div><textarea id=\"note\" class=\"form-textarea display\" cols=\"50\" rows=\"6\" name=\"form[note]\" rel=\"textarea\"></textarea></div></div></div><div class=\"columns clear bt-space5\"></div><div class=\"form-field clear\"><input id=\"addeditNote_cancel\" class=\"button fr-space2\" type=\"button\" value=\"Cancel\"><input id=\"addeditNote_ok\" class=\"button green fr-space\" type=\"button\" value=\"Enter\"></div></form></div><!-- end of box-wrap --></div> <!-- end of box-body --></div>",
onComplete : function() {
jQuery("#addeditNote_cancel").click(function() {
ret = false;
jQuery.fancybox.close();
})
jQuery("#addeditNote_ok").click(function() {
ret = true;
jQuery.fancybox.close();
})
},
onClosed : function() {
callback.call(this,ret);
}
});
}
我得到我的json字符串,如:
$.getJSON("GetNotes.php?id=" + rowID,
function(data) {
$.each(data, function(i, item) {
$('#' + item.field).val(item.value);
});
});
哪個返回:
{"op": "UPDATE", "id": "7","name": "Joe Public","note": "Dennis likes his coffee in the morning... He doesn't drink tea and coffee always have powdered creamer and 2 sugar's." }
“ op”只是一個占位符,所以我知道注釋是否存在,我正在更新數據庫,如果不是,我正在插入..
我的問題是,我不知道是誰來將此填充到表格中的。.我仍在學習,希望能有人給我一個提示,它如何工作.. :)
謝謝! 丹尼斯
如果在創建窗口的同一函數中填充表單不起作用,請嘗試將其添加為onComplete處理程序中的調用:
onComplete : function() {
//All of your original code here
$.getJSON( /* with your JSON code here */ );
},
大概到那時對話框應該已經准備好了,您可以像往常一樣將內容加載到表單元素中。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.