我正在尝试从服务中读取数据(返回 JSON 对象)并在动态 JQuery UI 对话框中创建一个可编辑的表单,以便最终用户可以使用它来进行更改和提交。麻烦的是,当我从服务器获取数据时,我似乎无法在表单中设置数据。如果我不使用对话框,那么一切正常。
我创建了一个关联的JSFiddle,以防万一。
var dialog_box = $('<div></div>');
var animal = { kind : "Cat", has_whiskers : true };
var s = $('<select />', {
"id":"s1"
}).append(
$('<option />',
{
value:"Dog",
text:"Dog"
}
),
$('<option />',
{
value:"Cat",
text:"Cat"
}
),
$('<option />',
{
value:"Bird",
text:"Bird"
}
)
);
s.appendTo(dialog_box);
// doesn't work
$('#s1 option:[value="'+ animal.kind +'"]').prop('selected', true);
var new_div = $('<div/>').html('<input type="checkbox" id="has_whiskers_checkbox" />');
new_div.appendTo(dialog_box);
(animal.has_whiskers) ? $("#has_whiskers_checkbox").prop("checked", true) : $("#has_whiskers_checkbox").prop("checked", false);
dialog_box.dialog({
autoOpen: false,
modal: true,
buttons: {
"OK": function() {
console.log("OK Pressed");
$( this ).dialog( "close" );
$( this ).remove();
}
}
}).dialog('open');