สอบถามการใช้งาน Typeahead ร่วมกับการทำ Add/Remove Input Fileds Dynamic หน่อยครับ
ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา สอบถามการใช้งาน Typeahead ร่วมกับการทำ Add/Remove Input Fileds Dynamic หน่อยครับ
สอบถามการใช้งาน Typeahead ร่วมกับการทำ Add/Remove Input Fileds Dynamic หน่อยครับ
Copy
อยากให้ทุก input สามารถใช้งาน autocomplete ได้เหมือนกันทุก input อ่ะครับ ตอนนี้มันทำงานแค่อันแรกอันเดียวครับ <form name="FormData" method="post" action="" > <div class="wrapper"> <div class="row"> <div class="col-md-10"> <input type="text" name="input_array_name[]" class="form-control text-uppercase typeahead" autocomplete="off" placeholder="ค้นหาชื่อบริษัท...."/> </div> </div> </div> <p><button class="add_fields">Add More Fields</button></p> </form>
$(document).ready(function() {
var max_fields = 10; //Maximum allowed input fields
var wrapper = $(".wrapper"); //Input fields wrapper
var add_button = $(".add_fields"); //Add button class or ID
var x = 1; //Initial input field is set to 1
//When user click on add input button
$(add_button).click(function(e){
e.preventDefault();
//Check maximum allowed input fields
if(x < max_fields){
x++; //input field increment
//add input field
$(wrapper).append('<div class="row"><div class="col-md-10"><input type="text" name="input_array_name[]" class="form-control text-uppercase typeahead" autocomplete="off" placeholder="ค้นหาชื่อบริษัท...." /> <a href="javascript:void(0);" class="remove_field">Remove</a></div></div>');
}
});
//when user click on remove button
$(wrapper).on("click",".remove_field", function(e){
e.preventDefault();
$(this).parent('div').remove(); //remove inout field
x--; //inout field decrement
})
});
$(document).ready(function(){
$('.typeahead').typeahead({
autoSelect: true,
minLength: 2,
//delay: 200,
hint: true,
highlight:true,
source: function(query, result)
{
$.ajax({
url:"fetch.php",
method:"POST",
data:{query:query},
dataType:"json",
success:function(data)
{
result($.map(data, function(item){
return item;
}));
}
})
}
});
});
คำแนะนำ และการใช้งาน
สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก
- ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา
โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ