0

私は、主にそれを学び、それがどのように機能するかを確認するために、AJAX ルートに行くことにしました。たとえば、10 件の投稿を超えるコメントのページ選択を追加したいと考えています。

私はCodeigniterを使用しており、これまでに持っているものを投稿します:

コントローラ：

    public function updatefilters()
    {
        $this->blurb_model->create_session_filter($_POST['filters']);
        $this->blurb_model->get_threads($_POST['pagenum']);
    }

モデル：

    public function get_threads($page = 0)
    {
            $NEEDPAGEHERE = $page
            [fetch threads]
            [return threads / count / etc]
    }

私の目標は、ページ数をユーザーに表示することです。この部分はできています。「get_threads」モデルで返されたアイテムの総数に基づいて、各ページに送信ボタンを表示しました (コードは関連性のために省略されています)。

ここに私のAJAX/javascriptがあります

焦点は updatefilter 関数にあります。返されたスレッド リストを使用して HTML を作成し、div 内に投稿します。これはうまくいきます。

問題は、ユーザーがページ ボタンをクリックしたときに updatefilters() 関数を再利用したいことですが、機能していません。送信ボタンの値を updatefilter(pagenum) に渡し、コントローラー -> メソッドに渡されるようにしたいのですが、計算はできますが、うまくいきません。

Javascript:

 function updatefilters(pagenum){
        // get the selected filters
        var html;
        var i = 0;
        if (!pagenum)
            {
                pagenum = 0
            }
        var $selected = $('#selectable').children('.ui-selected');
        // create a string that has each filter separated by a pipe ("|")
        var filters = $selected.map(function(){return this.id;}).get().join("\|");
        $.ajax({
            type: "POST",
            async: false,
            url: 'welcome/updatefilters',
            dataType: 'json', 
            data: { filters: filters, pagenum: pagenum },
            success: function(data){
                var html = "";
                html += "<div id=board>"
                html += "<div class='board' id='table'>"
                html += "<div id='row'>header here</div>"

                var pages = Math.ceil(data['num_threads']/10);
                var htmlpage = "<div class='pages'>"
                for (i=1 ; i < pages+1 ; i++)
                    {
                        htmlpage += "<li><input type='submit' id='page"+i+"' value='"+i+"' onclick='updatefilters(this.value);' /></li>"
                    }
                htmlpage += "<div>"    
                htmlpage += "</ul>";
                htmlpage += "</br></br></br>";
                html += htmlpage;

                for (i=0 ; i < data['threads'].length ; i++)
                {
                    html += "<div id=row>";
                    html += "   <div id='author' style='background: url("+data['threads'][i].location + ") no-repeat; background-position: center;'><p>"+data['threads'][i].username + "</p></div>";
                    html += "   <div id='arrow'></div>";
                    html += "   <div id='subject' title='"+ data['threads'][i].body +"'>";
                    html += "       <a href=thread/" + data['threads'][i].slug + ">"+ data['threads'][i].subject +"</a><p>Created: "+data['threads'][i].posttime+"</p></div>";                    
                    html += "   <div id='info'>";
                    html += "       <div id='replies'>" + data['threads'][i].replies_num + "</div>";
                    html += "       <div id='lastpost'>"+ data['threads'][i].lastreply+"</div>";
                    html += "   </div>";
                    html += "</div>";
                }
                html += "</div></div>";
                $('#board').html(html);
            }
        });
    } 


$(function() {
    $( "#selectable" ).selectable({
        selected: updatefilters  
    });
    getactivesession();
    function getactivesession(ev, ui){
        var i = 0;
        var actfilter, strfilter;
        var strfilterarray = new Array();
        $.ajaxSetup({cache: false})
        $.ajax({
        type: "POST",  
        async: false,
        url: 'welcome/getactivesession', 
        dataType: 'json',
        success: function (data){
            strfilter = JSON.stringify(data)
            strfilterarray = strfilter.split(',')
            for (i=0 ; i < strfilterarray.length ; i++) {
                strfilter = strfilterarray[i]
                strfilter = strfilter.replace(/[\[\]'"]+/g,'');
                var strfilterdash = strfilter.replace(/\s+/g, '-')
                actfilter = '#'+ strfilterdash
                $(actfilter).addClass('ui-selected')
            }
            updatefilters();
        }
        });
    }
});

これは私にとって信じられないほどの学習体験であり、誰かが問題を見つけて簡単に理解できる方法で説明できれば、大きな助けになります. 私は一般的にJavaScriptとプログラミングに非常に慣れていません（コードの醜さを説明するかもしれません）。

ありがとう！

4

1 に答える 1

1

selectedイベント コールバックを変更します。

$("#selectable").selectable({
  // Here is the event callback signature for reference
  selected: function(event, ui) {
    updatefilters();
  }
});

関数に予期しない最初のパラメーターを渡していましたupdatefilters。

于 2012-06-12T16:52:35.643 に答える