如何将附加数据传递到 ajax post jquery ui 可选择网格 ->奇特盒子？

Question

我需要帮助合并两个 jQuery ui 的可选（网格）和花式框（灯箱解决方案）。

现在，精美的框使 ajax 帖子变得非常简单（ahref="link to page"）并显示它！问题是 jQuery ui 可选择为我抓取数据并将其附加到页面，但我想使用 ajax 将其发布到 fancybox，以便在我的 php 分析数据后弹出提示。

这是我到目前为止所拥有的

$x = array();
    while($row = mysql_fetch_array($bq)){
        $x[]= "
        <li  class=\"ui-widget-content\"
        data-morph=\"".$row['morph']."\"  
        data-price=\"".$row['price']."\"
        id=\"".$row['id']."\">
        $ ".$row['price'].".00&nbsp;
        ".$row['morph']."&nbsp;
        ".$row['sex']."&nbsp;
        </li>";
    }   


}
<p id="feedback">
<span>You've selected:</span> <span id="select-result">none</span>.
</p>
<ol><? echo "Total Snakes ($ts)"; if($ts != '0'){echo "<button class=\"ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all\">
        <span class=\"ui-button-text\" href=\"?ready\">Buy</span>
    </button>";} ?></ol>
<ol id="selectable">
<?php
shuffle($x);
foreach($x as $z){
    echo $z;    
}
?>
</ol>
<script>    
$(function() {
        $( "#selectable" ).selectable({
            stop: function() {
                var result = $( "#select-result" ).empty();
                $( ".ui-selected").each(function() {
                     var id = $( this ).attr('id'); 
                     var morph = $(this).attr('data-morph');
                     var price = $(this).attr('data-price');

                    result.append( (id)+',' );
/// this gets displayed on the page but i want this data to be passed to fancy box ....
                    });


            }
        });

    });
    $('button span').fancybox({
// maybe somebody would kno how ?
});
</script> 

Answer 1

您知道，实际上可以通过在 PHP 中使用单引号来避免放置所有这些斜杠，如下所示：

$x[]= '<li  class="ui-widget-content" data-morph="'.$row['morph'].'" data-price="'.$row['price'].'" id="'.$row['id'].'">' ; // and so on

至于问题，我有同样的任务。我发现这个链接很有帮助：

post array jquery serialize

就个人而言，我刚刚将一个 js 数组传递给我的PHP ajax 脚本：

function saveOrder(){
    var ids = new Array();

    $('#sortable').find('li').each(function(i){ 
        ids.push($(this).attr('id'));
    });

    $.ajax({
        type: "POST",

        url: 'ajax/reorder_panel.php',

        data: {
            order: ids
        },

        success: function(data, textStatus, jqXHR){
            alert(data);
        },

        error: function(jqXHR, textStatus, errorThrown){
            alert("Server connection error...");
        }
    });
}