2012-02-16 9 views
3

通常の静的なhtml/phpページを使用している場合、オートコンプリートは正常に動作します。jquery autocomplete ajaxから生成する場合の作業なし

しかし、ダイナミックにロードするモジュール(AJAX)で、同じHTMLをエリアに生成しています。私はオートコンプリートを動作させることができません。

これをどのように解決できますか?私はどこでも検索し、すべてを試しましたが、明らかに適切な解決策ではありません。

// 
// this is the ajax code load dynamic contents in a #display_area 
// from onclick=selected_purchase() 
// 

    function selected_purchase() { 
     var fields = $(":input").serialize(); 
     $.ajax({ 
     url: "purchase4", 
     type: "POST", 
     dataType: "html", 
     data: fields , 
     beforesend: function(a) { 
      // before send process here 
      showBusy(); 
     }, 
     success: function(html) { 
      // success process here ... 
      processForm(html); 

     } 
    }); 

     } 


// 
// this is the autocomplete code 
// 

$("#supplier").autocomplete({ //the recipient text field with id #supplier 
     source: function(request, response) { 
      $.ajax({ 
       url: "search_supplier", 
       dataType: "json", 
       data: request, 
       success: function(data){ 
        if(data.response == 'true') { 
         response(data.message); 
        } 
       } 
      }); 
     }, 
     minLength: 2, 
     select: function(event, ui) { 
      // Do something extra on select... 
       // add user id to hidden input  

      $('input[name="name"]').val(ui.item.value); 
      $('input[name="sl"]').val(ui.item.sl_id); 
      return false; 
     }, 

    }); 
+1

あなたのコードを見ずに手助けするのは難しいですが、これまでの投稿を投稿することはできますか? –

+0

おかげで、いくつかのコードが追加されました。 –

答えて

2

おそらく、コンテンツが読み込まれた後にプラグインインスタンスを初期化する必要があります。

$("#container").load('some url', function() { 
    $(this).find('#autocomplete').autocomplete(); 
}); 

このコードは、コンテンツ($ .ajax、.load()...)の読み込みに使用する方法によって少し異なる場合があります。一般的なことは、非同期要求が完了した後に実行されるコールバックでプラグインを初期化することです。これは通常「成功」コールバックと呼ばれます。


今、私たちはここにあなたが何をすべきかだ、あなたのコードのサンプルを持っている:

function selected_purchase() { 
    var fields = $(":input").serialize(); 
    $.ajax({ 
     ... 
     success: function(html) { 
      // success process here ... 
      processForm(html); 

      // assuming "processForm" append the "html" to the DOM 
      // you can now call autocomplete 
      $("#supplier").autocomplete({ 
       ... 
      }); 
     } 
    }); 
}​ 
+0

はprocessForm()の後に追加されるこのコードですか? –

+0

processForm()が新しいhtmlを追加するメソッドであれば、yesを返します。 –

+0

@DidierGhys私はあなたのsuggetionとして実装しています... $( "#PaymentIn")load( '/ Bank/_PaymentIn /'、function(){ $(this).find( '#ChequeNo')。オートコンプリート(); }); $( "入力#ChequeNo")。オートコンプリート({......でもこれはうまくいきません...任意のアイデアplz .. – Dragon

0

PHPスクリプト(私は推測)JSONを送信しているの?それはいつもの問題です、あなたのOUTSTREAMはあなたが同じ結果をecho json_encode($myArrayWithStringValues)を使用することができます

['toto','titi','tata'] 

のようになります。

関連する問題