0

複数選択ドロップダウンを使用して、データベースに保存されている画像をフィルタリングしています。結果はページ付けされますが、結果がフィルタリングされるとページ付けは失敗します。フィルタはajaxを使用して、データベースへのphp呼び出しを行います。

私が起こっていると思うのは、結果がdivにロードされると、paginate javascript関数がすでに起動されており、2回目は実行されないということです。結果がフィルタリングされるたびに関数を呼び出す方法はありますか？

私は毎回これを思い出す必要があると信じています：

    <script type="text/javascript">

jQuery(function($){

    $('ul#items').easyPaginate({
        step:6
    });

});    

    </script>

Ajax呼び出し：

<script>
function filterResults(sel)
{
    var selectedOptions = [];
    for (var i = 0; i < sel.options.length; i++) {
        if (sel.options[i].selected) {
            selectedOptions.push("'" + sel.options[i].value + "'");
        }
    }
    if (selectedOptions.length == 0) {
        document.getElementById("divResults").innerHTML="";
        return;
    }
    str = selectedOptions.join(",");
    if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    } else  {// code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function() {
        if (xmlhttp.readyState==4 && xmlhttp.status==200) {
            document.getElementById("divResults").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","filter_ajax.php?filter="+str,true);
    xmlhttp.send();
}

</script>

ajax_filter.php：

<?php

    include ("connect.php");

    $filter = $_GET["filter"];
    $filterIn = $filter;

        $result = mysql_query("SELECT * FROM edt_images
                                WHERE category1 IN ($filterIn)
                                OR category2  IN ($filterIn)
                                OR category3  IN ($filterIn)
                                OR category4 IN ($filterIn)
                                OR category5 IN ($filterIn)
                                OR category6 IN ($filterIn)")                           
            or die(mysql_error());

        echo "<div id='results_container'>";
        echo "<ul id='items'>";

        while ($row = mysql_fetch_array($result)) {

            echo "<li><img src='files/300x200/thumb2_".$row['item_name'].".".$row['file_extension']."' class='filtered_images' border='0'/></li>"; 
        }
        echo "</ul>";
        echo "</div>";
?>
4

3 に答える 3

1

jQueryを使用している場合は、jQueryがfilterResults提供するフレームワークを利用することで、関数内のコードを大幅に簡略化できます。豊富な機能に驚かれることでしょうので、ここで少し読みます。

このコードは、前のコードと同等のjQueryです。

   function filterResults(sel) {
        var selectedOptions = [];
        for (var i = 0; i < sel.options.length; i++) {
            if (sel.options[i].selected) {
                selectedOptions.push("'" + sel.options[i].value + "'");
            }
        }
        if (selectedOptions.length == 0) {
            $("divResults").html("");
            return;
        }
        filteStr = selectedOptions.join(",");
        $.ajax({
            url: "http://www.google.com",
            type: "get",
            dataType: "html",
            data: {
                filter: filteStr
            },
            success: function (responseHtml) {
                $("divResults").html(responseHtml);
                //You can put your code here
                $('ul#items').easyPaginate({
                    step: 6
                });
            },
            error: function (responseHtml) {
                //Handle error
            }
        });
    }

質問に答えるためsuccessに、ajax呼び出しのコールバック内のコードは、サーバーからデータを受信したときに実行されます。上記のこのコードは期待どおりに機能するはずです。

知っておくべきことのほとんどすべてがこことここにあります。;）

于 2013-01-28T13:27:03.377 に答える
0

上手

コメントによると、私はjavascriptとjqueryについて研究する必要がありますが、これまで実際にそれを気にすることはありませんでした。

とにかくjavascript関数を呼び出すことによって 

if (xmlhttp.readyState==4 && xmlhttp.status==200) {
            document.getElementById("divResults").innerHTML=xmlhttp.responseText;
            RESTATING HERE
}

私はそれを機能させることができました。

于 2013-01-28T13:30:00.223 に答える
-1

javascript呼び出しをphp-ajaxエコーに入れます。例：

<?
$msg = "hello";
?>
<script type="text/javascript">alert("<?=$msg?>"></script>
于 2013-01-28T13:26:12.557 に答える