HTML DOM Input Search autocomplete প্রোপার্টি
HTML DOM Input Search autocomplete প্রোপার্টি <input> এলিমেন্টের type="search" এর autocomplete অ্যাট্রিবিউটের সাথে জড়িত। autocomplete অ্যাট্রিবিউট "on" বা "off" মান গ্রহণ করে। "on" মান নির্দেশ করে যে ওয়েব ব্রাউজার পূর্বের ইনপুটের ভিত্তিতে ইউজার টেক্সট অটোমেটিক্যালি কমপ্লিট করবে, আর "off" মান তার বিপরীত নির্দেশ করে।
সিনট্যাক্স
Autocomplete প্রোপার্টি সেট করার সিনট্যাক্স:
searchObject.autocomplete = "on|off"
এখানে, on মানে ব্রাউজার পূর্বের ইনপুটের ভিত্তিতে ইউজার ইনপুট অটোমেটিক্যালি কমপ্লিট করবে, off মানে সেটি করবে না। ডিফল্টভাবে এর মান on থাকে।
উদাহরণ
Input Search autocomplete প্রোপার্টির একটি উদাহরণ:
<!DOCTYPE html> <html> <body>
<h1>Input Search autocomplete property</h1>
<form action="/Sample_page.php">
FRUITS: <input type="search" id="SEARCH1" name="fruits" autocomplete="on"><br><br>
<input type="submit">
</form>
<p>নিচের বাটনে ক্লিক করে উপরের সার্চ ফিল্ডের autocomplete বন্ধ করুন</p>
<button onclick="changeAuto()">Autocomplete Off</button>
<p id="Sample"></p>
<script>
function changeAuto() {
document.getElementById("SEARCH1").autocomplete = "off";
document.getElementById("Sample").innerHTML = "Your text will not autocomplete now";
}
</script>
</body> </html>
আউটপুট
উপরের কোডটি নিচের আউটপুট দেবে:

উপরের ফিল্ডে কিছু টেক্সট টাইপ করলে, আপনি আপনার পূর্বের ইনপুটের ভিত্তিতে টেক্সট অটোকমপ্লিট হয়ে যাচ্ছে দেখবেন:

"Autocomplete Off" বাটনে ক্লিক করলে অটো কমপ্লিট টেক্সট ক্যাপচার হবে না:

ব্যাখ্যা
- প্রথমে
type="search",name="fruits"এবংautocomplete="on"সেট করে একটি<input>এলিমেন্ট তৈরি করা হয়েছে। এটি নিশ্চিত করে যে টেক্সট পূর্বের ইনপুটের ভিত্তিতে কমপ্লিট হবে। সার্চ ফিল্ডটি একটি ফর্মের ভিতরে থাকে যাতে একটি সাবমিট বাটনও আছে সার্ভারে ফর্ম ডেটা জমা দিতে। - তারপর একটি "Autocomplete Off" বাটন তৈরি করা হয়েছে যা ইউজার ক্লিক করলে
changeAuto()মেথড এক্সিকিউট করবে। changeAuto()মেথডgetElementById()ব্যবহার করেtype="search"ইনপুট এলিমেন্টটি পায় এবং এরautocompleteঅ্যাট্রিবিউটের মানoffসেট করে। এর মানে এখন টেক্সট অটোকমপ্লিট হবে না এবং ইউজারকে পুরো টেক্সট ম্যানুয়ালি টাইপ করতে হবে। এই পরিবর্তন সম্পর্কে মেসেজ প্যারাগ্রাফে (আইডি "Sample")innerHTMLপ্রোপার্টি ব্যবহার করে দেখানো হয়।
function changeAuto() {
document.getElementById("SEARCH1").autocomplete = "off";
document.getElementById("Sample").innerHTML = "Your text will not autocomplete now";
}