web-dev-qa-db-ja.com

Drupal 7でAjaxを使用してビューをロードして表示する方法は?

Drupal7でAjaxを使用してビューをロードしようとしたのはこれが初めてです。ゼロから支援していただければ幸いです。これを行う方法を学ぶために何時間も費やしましたが、それでも失敗しました!

image_galleryというビューを作成しました。これにはhdtabletおよびphoneという3つのブロックがあり、画像のセットが表示されます。タブを作成して、これらのブロック(通常はビュー)をAjaxで表示およびロードします。これは私のHTMLです:

    <div>
        <div id="image_gallery_tab">
            <ul>
                <li id="igt1">HD</li>
                <li id="igt2">Tablet</li>
                <li id="igt3">Cellphone</li>
            </ul>
        </div>
        <div id="image_gallery_content">
            <div class="igc" id="igc1">
                <?php print views_embed_view("image_gallery","hd") ?>
            </div>
            <div class="igc" id="igc2">
            </div>
            <div class="igc" id="igc3">
            </div>
        </div>
    </div>

ビューUIでUse Ajaxを "yes"に設定しました。これは私のjQueryコードです:

$("#image_gallery_tab ul li").click(function(){
        var id = $(this).attr("id").slice(-1);
        $(".igc").css("display","none");
        if(id==2)
            {
            $.ajax({
                url: Drupal.settings.basePath + 'views/ajax',
                type: 'POST',
                dataType: 'json',
                data: 'view_name=image_gallery&view_display_id=tablet', // Pass a key/value pair.
                success: function(response) {
                  $("#igc2").innerHTML=response.display;
                },
                error: function(data) {
                 alert('An error occured!');
                }
              });
            }
    });

何も表示されません。ここで何が悪いのですか、どうすればよいですか?ありがとう

4
M a m a D

答えを探してここにたどり着く人にとって、これはあなたがそれをする方法です。まず、ビューの[その他の設定]で[AJAXを使用]を有効にし、[マシン名]が表示IDであることを確認してください。

Views Other Settings

次に、これはjQuery ajaxを使用してJSでプルする方法です。

$.ajax({
  url: Drupal.settings.basePath + '/views/ajax',
  type: 'post',
  data: {
    view_name: 'your_view_name',
    view_display_id: 'page', //your display id
    view_args: VIEW_ARGUMENT_HERE, // your views argument(s)
  },
  dataType: 'json',
  success: function (response) {
    if (response[1] !== undefined) {
      console.log(response[1].data); // do something with the view
    }
  }
});
11
Vanja Jelic