javascript - How to append jquery autocomplete to a dynamically changed element -
i have below textbox , autocomplete script, work expected:
html:
<div id="partnamecont"> <input type='text' name="part_name" id="part_name"> </div>
jquery:
var autocomp = jquery.noconflict(); autocomp(document).ready(function() { autocomp('#part_name').autocomplete({ source: "test.php", select: function(e, ui) { var tmp = ui.item.label; ui.item.label = ui.item.value; ui.item.value = tmp; getpartcategory(ui.item.label); }, open: function (e, ui) { var acdata = autocomp(this).data('ui-autocomplete'); acdata.menu.element.find('li').each(function () { var me = autocomp(this); var keywords = acdata.term.split(' ').join('|'); me.html(me.text().replace(new regexp("(" + keywords + ")", "gi"), '<b><span style="color:#e7930d;">$1</span></b>')); }); } }); });
the problem want set part_name
disabled
on page load. make available again when user selects value select box.
so have on page load:
<div id="partnamecont"> <input name="" type="text" disabled="disabled"> </div>
however, when user selects required select box , change partnamecont
original content, autocomplete not work.
update: function use update partnamecont
- update entire div
not input
element:
function getpartname(id) { var autonew_id1 = jquery.noconflict(); autonew_id1.ajax({ url: "getpartname.php", data: "id="+id, type: "post", datatype: "html", success: function(data){ autonew_id1('#partnamecont').html(''); autonew_id1('#partnamecont').html(data); } }); }
and new data partnamecont
this:
<input type="text" name="part_name" id="part_name" class="text-input ui-autocomplete-input" value="" autocomplete="off">
any suggestions modification should done function make work dynamically changed element?
Comments
Post a Comment