php - Jquery .autocomplete not working after ajax call -


hi guys trying write title matcher, got working when ajax call made no longer works below code :

 <script type="text/javascript" src="jquery.autocomplete.js"></script>     <link rel="stylesheet" type="text/css" href="jquery.autocomplete.css" />     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>     $(document).ready(function()              {                 $(".course").autocomplete("look_me_up.php",                      {                         width: 260,                         matchcontains: true,                         mustmatch: true,                         selectfirst: false                     });                  $(".course").result(function(event, data, formatted)                     {                           $(this).next(".course_val").val(data[1]);                     });             }); 

the text box want update called ajax request made first :

<input type="text" name="course" id="text1" value="find title in db" class="course"> <input type="hidden" id="val1" class="course_val"> 

and ajax request :

function checks()             {              $.ajax({                 type : "post",                 url : "get_data.php",                 data : "function="+"get_text",                 success : function(msg)                      {                        $(update_me).html(msg);                     }                 });             } 

i assume jquery acting because trying update value pulled ajax request? struggling work appreciated.

it looks problem dynamic element creation.

you have loaded course elements , autocomplete initialized on them, later seems replacing elements new elements. here not initializing autocomplete new elements.

the solution initialize autocomplete dynamically added elements

function createcourse(els){     els.autocomplete("look_me_up.php", {         width: 260,         matchcontains: true,         mustmatch: true,         selectfirst: false     });      els.result(function(event, data, formatted){         $(this).next(".course_val").val(data[1]);     }); }  $(document).ready(function() {     createcourse($(".course")) });  function checks() {     $.ajax({         type : "post",         url : "get_data.php",         data : "function="+"get_text",         success : function(msg)  {             $(update_me).html(msg);             createcourse($(".course", update_me))         }     }); } 

Comments

Popular posts from this blog

Change php variable from jquery value using ajax (same page) -

Pull out data related to my apps from Android Play Store and iOS App Store -

How can I fetch data from a web server in an android application? -