2

2 つの jQuery ui の選択可能 (グリッド) とファンシー ボックス (ライトボックス ソリューション) を組み込む助けが必要です。

ファンシー ボックスにより、ajax の投稿が非常にシンプルになり ( ahref="link to page")、表示されます。問題は、jQuery ui の選択可能要素がデータを取得してページに追加することですが、php によってデータが分析された後にプロンプ​​トをポップアップするために、それを ajax を使用して fancybox に投稿したいと考えています。

これが私がこれまでに持っているものです

$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>
4

1 に答える 1

3

ご存知のように、次のように PHP で単一引用符を使用すると、これらすべてのスラッシュを実際に配置することを回避できます。

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

質問に関しては、私は同じ仕事をしています。このリンクが役に立ちました：

ポストアレイjqueryシリアル化

個人的には、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...");
        }
    });
}
于 2011-11-21T09:21:30.470 に答える