0

私のdjangoアプリでは、ユーザーのFacebookの友達リストを表示しています。10分ごとに更新するために、このリストを別のビューとhtmlに置き、getリクエストを使用して取得し、表示したくないページに表示しました。

これは、私が友人リストを持っている get_fb_friends.html ファイルです: (これは私が作成したビューに関連付けた html ファイルです。これは、私がユーザーに表示するページに表示したくないリストを取得する場所です):

   {% for friend in group %}
    <li>{{ friend.name }} </li>
   {% endfor %}

そして、それをテンプレートにインポートする方法: (これは、ユーザーのリストを表示したくないページです)。

JS:
     setInterval(function(){
        $.get('/mysite/get_fb_friends/', function(data) {
        $('.get_fb_friends').html(data);
    });
    }, 600000);

    return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase()) >= 0;
};

   $(function() {
   $('#searchbox').on('keyup', function() {
    var w = $(this).val();
   if (w) {
    $('#friendlist li').hide();
    $('#friendlist li:Contains('+w+')').show();
  } else {
    $('#friendlist li').show();                  
 }
 });
 });



 HTML:

     <div class='get_fb_friends'> </div>

次に、ユーザーが必要な友達を検索できるようにするために、このリストの上に検索バーを含めたくありません。そこで、get_fb_friends.html に次のように追加しました。

  HTML:
    <input id="searchbox" type="text" placeholder="Search" />    
    <ul id="friendlist">
    {% for friend in group %}
    <li>{{ friend.name }} </li>
    {% endfor %}

この検索バーは、www.mysite/get_fb_friends ページで使用すると完全に機能しますが、jquery get リクエストによって取得されると (つまり、ユーザーに表示したくないページでは) 機能しなくなります。1文字入力すると、すべての名前が消えます。

jquery get 関数を使用して html ファイルを取得すると、jquery 関数で必要な「li」が保持されないように見えます。

何が起こっているかについて何か考えはありますか？

私の質問が明確であることを願っています。ご協力ありがとうございます。

編集：

私のメインページ:

 HTML:
 <div class="friendlist" id="friendlist"> 


 JS:

 $.get('/mysite/get_fb_friends/', function(data) {
    $('.friendlist').html($(data).find($('#friendlist').html()));
    });

 return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase()) >= 0;
    };

   $(function() {
    $('#searchbox').on('keyup', function() {
      var w = $(this).val();
       if (w) {
        $('#friendlist li').hide();
        $('#friendlist li:Contains('+w+')').show();
      } else {
        $('#friendlist li').show();                  
     }
     });
     });

私のリモートページ:

 HTML:
 <input id="searchbox" type="text" placeholder="Search" />    
 <ul id="friendlist" class="friendlist">

  {% for friend in group %}
    <li>{{ friend.name }}</li>
  {% endfor %}
4

1 に答える 1

1

私はあなたが本当にリストの内容を更新したいだけでinput、完全なリスト自体を更新するたびに置き換えたいとは思わない.

その場合、すべての JS をメイン ページに配置したい場合は、リモート ファイルの出力を単にLIタグを送り返し、新しいターゲットに挿入するように変更しますfriendlist。この挿入は、完全な置換、または新しく見つかった名前の追加のみである可能性があります。アプリがこの点でどのように機能するのかわかりません

ユーザーが入力でフィルタリングを行っているときに ajax 呼び出しを行わないようにフラグを追加することもできます。

フラグは次のようなものです

$('#searchbox').on('focus blur', function(){
   $(this).toggleClass('active')
})

次に、setInterval

setInterval(function(){
        if( ! $('#searchbox').hasClass('filter') ){
            $('#friendlist').load('/mysite/get_fb_friends/')
       }
    }, 600000);
于 2012-11-11T16:22:11.077 に答える