Firebug和javascript警报显示正确的响应,对话框打开但 jqxhr 未解析。页面上有Jquery,jquery ui,javascript和css脚本,但是我把它们留给了空间。我只是学习这一点,需要语法等方面的帮助。谢谢!
更新了AGAIN以及其他建议。使用ajax完成函数最终获得了第二个ajax响应,以便在jquery对话框中显示。现在只需要帮助将* jqxhr 数据解析为html表单输入。感谢所有有想法的人。 *
$(document).ready(function() {
$("#StoreForm").dialog({autoOpen:false, width:500, height:500, modal:true});
$('#content').css('min-height', '610px');
$('#sidebar').css('min-height', '600px');
$('a.storeCategories').unbind('click');
$('a.storeCategories').click(function(e){
e.preventDefault();
var stuff = ($(this).attr('href'));
$.when($.post(stuff, function(response, status, xhr) {
if(response.ROWCOUNT > 0) {
var s = [];
s.push("<table border='0'>");
for(var i=0; i<response.ROWCOUNT; i++) {
//push can take multiple comma-separated strings, and it is very fast
s.push("<tr><td><p>", response.DATA.ICON[i], "</p></td></tr>",
"<tr><td>", response.DATA.LABEL[i], "</td></tr>",
"<tr><td class=\"sel\">", response.DATA.PRICE[i], "</td>",
"<td class=\"item\" display: hidden>", response.DATA.PROD_SUPER_ID[i], "</td></tr>",
"<tr></tr>");
}
s.push("</table>");
}
else {
s.push("Sorry, nothing matched your selection.");
}
//Now assemble the HTML by joining all the array elements together.
$("#content").html(s.join(""));
//alert(s);
$(".sel").unbind('click');
$(".sel, #StoreForm").click(function(e){
e.preventDefault();
$("#StoreForm").dialog('open');
var valueSelected = $(this).closest('tr').children('td.item').text();
//alert(valueSelected);//this alerts correctly
var jqxhr = $.post('query/categories.cfc?method=getProductInfo&returnformat=json&
queryFormat=column',
{productID: valueSelected},
function(data, textStatus, jqXhr) {
//$("#StoreForm").html("<b>Ray</b>")
//alert works below
jqxhr.always(function() {
$('#StoreForm').html(data);
});
})
});
},"json"));
});
})
DATA below:
{"ROWCOUNT":1,
"COLUMNS":[
"IMAGE_TYPE_REF_ID",
"ICON",
"PROD_SUPER_ID",
"COLOR_ATTRIB","SIZE_ATTRIB",
"SUPER_DESC","FULL_DESCRIPTION","PRICE","TAXABLE"],
"DATA {"IMAGE_TYPE_REF_ID": "large"],
"ICON"["http:/Apps/Product_Mgmt/large/necklace150.jpg"],
"PROD_SUPER_ID
":["C-JAY00001"],"COLOR_ATTRIB":[true],"SIZE_ATTRIB":[true],"SUPER_DESC":["3 Stone
Womens Quartz 23- inch Necklace"],"FULL_DESCRIPTION":
["This dainty three-drop quartz pendant
hangs on a silver 23 inch chain. Presented in a small black satchel."],
"PRICE": [10.0000],"TAXABLE": [true]}}
答案 0 :(得分:1)
我看到一个问题就是设置id = \“item \”。 HTML id必须是唯一的。最好设置一个类而不是class =“\ item \”,然后执行:
$(".item").click(function(e) {
var valueSelected = $(this).html();
...rest of your code...
}
另外,作为旁注,通过将字符串片段推送到数组上,然后使用array.join()将它们blit转换为HTML,您将获得更好的性能,将表字符串放在第一个调用中,如下所示:
if(response.ROWCOUNT > 0) {
var s = [];
s.push("<table border='1'>");
for(var i=0; i<response.ROWCOUNT; i++) {
//push can take multiple comma-separated strings, and it is very fast
s.push("<tr><td>", response.DATA.ICON[i], "</td></tr>",
"<tr><td>", response.DATA.LABEL[i], "</td></tr>",
"<tr><td>", response.DATA.PRICE[i], "</td></tr>",
"<tr><td id=\"item\">", response.DATA.PROD_SUPER_ID[i], "</td></tr>");
}
s.push("</table>");
}
else {
s.push("Sorry, nothing matched your selection.");
}
//Now assemble the HTML by joining all the array elements together.
$("#content").html(s.join(""));
在进行字符串连接时,将字符串推送到数组上然后通过连接将它们转储出来比连接快得多;特别是当你有很多字符串要连接时。
答案 1 :(得分:1)
在对它们进行处理之前,您需要存在设置为“h2”的元素。尝试手动添加它们,或者将ajax调用排队,在它的回调中一个接一个地同步发生。
所以基本上接受你在这里的$ .post调用,并把它放在其他帖子或ajax的回调中,然后在this
回调中,保留你所拥有的。
答案 2 :(得分:0)
对话框中未显示响应的原因是选择器$( '#oneitem > h2' )
和$( '#oneitem > p' )
不会生成任何元素,因为标识为oneitem
的元素没有子元素。如果您想在对话框中添加h2
和p
元素,则需要更多代码:
$('<h2></h2>').html(response.DATA.FULL_DESCRIPTION[i]).appendTo('#oneitem');
$('<p></p>').html(response.DATA.PROD_SUPER_ID[i]).appendTo('#oneitem');
$('<p></p>').html(response.DATA.PRICE[i]).appendTo('#oneitem');
以下是转义JSON的示例,它在控制台中运行:
{"ROWCOUNT":1,"COLUMNS":["IMAGE_TYPE_REF_ID","ICON","PROD_SUPER_ID","COLOR_ATTRIB","SIZE_ATTRIB","SUPER_DESC","FULL_DESCRIPTION","PRICE","TAXABLE"],"DATA":{"IMAGE_TYPE_REF_ID": "large","ICON":["http:/Apps/Product_Mgmt/large/necklace150.jpg"],"PROD_SUPER_ID":["C-JAY00001"],"COLOR_ATTRIB":[true],"SIZE_ATTRIB":[true],"SUPER_DESC":["3 Stone Women\'s Quartz 23-inch Necklace"],"FULL_DESCRIPTION":["This dainty three-drop quartz pendant hangs on a silver 23 inch chain. Presented in a small black satchel."],"PRICE":[10.0000],"TAXABLE":[true]}}