1

Firebug 和 javascript 警报显示正确的响应并打开对话框，但jqxhr未解析。Jquery、jquery ui、javascript 和 css 脚本在页面上，但我将它们留出了空间。我只是在学习这个，需要语法等方面的帮助。谢谢！

再次更新了其他建议。使用 ajax 完成功能终于得到了在 jquery 对话框中显示的第二个 ajax 响应。现在只需要帮助将 * 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]}}
4

3 回答 3

1

在处理它们之前，您需要设置“h2”的元素存在。尝试手动添加它们，或者将 ajax 调用排队，以便在它的回调中一个接一个地同步发生。

所以基本上把你在这里的 $.post 调用，把它放在另一个帖子或 ajax 的回调中，然后在this回调中，保留你所拥有的。

于 2012-04-23T22:19:38.933 回答
1

我看到一个问题，那就是设置 id=\"item\"。HTML id 必须是唯一的。最好设置一个类而不是 class="\item\"，然后执行以下操作：

$(".item").click(function(e) {
    var valueSelected = $(this).html();
    ...rest of your code...
}

此外，作为旁注，通过将字符串片段推送到数组中，然后使用 array.join() 将它们像这样发送到 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(""));

在进行字符串连接时，将字符串推入数组然后通过连接它们将它们转储出来比连接要快得多；特别是当你有很多字符串要连接时。

于 2012-04-20T19:47:05.867 回答
0

对话框中没有显示响应的原因是选择器$( '#oneitem > h2' )和$( '#oneitem > p' )结果没有元素，因为具有 id 的元素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]}}
于 2012-04-20T22:37:42.157 回答