ভূমিকা
HTML DOM Form reset() মেথড ব্যবহার করা হয় ফর্ম এলিমেন্টের সব মান রিসেট করে ডিফল্ট মান দেখানোর জন্য যা value এট্রিবিউট ব্যবহার করে নির্দিষ্ট করা হয়। এটি ফর্ম ডেটা ক্লিয়ার করতে একটি রিসেট বাটনের মতো কাজ করে এবং এটি কোনো প্যারামিটার নেয় না।
সিনট্যাক্স
Form reset() মেথডের সিনট্যাক্স:
formObject.reset()
উদাহরণ
নিচে Form reset() মেথডের একটি উদাহরণ দেওয়া হলো:
<!DOCTYPE html> <html> <head> <style> form{ border:2px solid blue; margin:2px; padding:4px; } </style> <script> function ResetForm() { document.getElementById("FORM1").reset(); document.getElementById("Sample").innerHTML="Form has been reset"; } </script> </head> <body> <h1>Form reset() method example</h1> <form id="FORM1" method="post" action="/sample_page.php"> <label>User Name <input type="text" name="usrN"></label> <br><br> <label>Age <input type="text" name="Age"></label> <br><br> <input type="submit" value="SUBMIT"> <input type="button" onclick="ResetForm()" value="RESET"> </form> <p id="Sample"></p> </body> </html>
আউটপুট
এটি নিচের আউটপুটটি তৈরি করবে:
RESET বাটনে ক্লিক করার পর:
উপরের উদাহরণে:
আমরা প্রথমে একটি ফর্ম তৈরি করেছি id="FORM1", method="post" এবং action="/sample_page.php"। এতে দুটি টেক্সট টাইপের ইনপুট ফিল্ড, একটি সাবমিট বাটন এবং একটি রিসেট বাটন আছে।
<form id="FORM1" method="post" action="/sample_page.php"> <label>User Name <input type="text" name="usrN"></label> <br><br> <label>Age <input type="text" name="Age"></label> <br><br> <input type="submit" value="SUBMIT"> <input type="button" onclick="ResetForm()" value="RESET"> </form>
RESET বাটন ক্লিক করলে ResetForm() ফাংশন এক্সিকিউট হয়।
<input type="button" onclick="ResetForm()" value="RESET">
ResetForm() মেথড ডকুমেন্ট অবজেক্টের getElementById() মেথড ব্যবহার করে <form> এলিমেন্ট পায় এবং সেটিতে reset() মেথড কল করে। এটি ফর্ম এলিমেন্টের সব ডেটা ক্লিয়ার করে। শেষে innerHTML প্রপার্টি ব্যবহার করে আমরা এই পরিবর্তনকে প্রতিফলিত করার জন্য নির্দিষ্ট টেক্সট "Sample" আইডি 가진 একটি প্যারাগ্রাফে দেখাই:
function ResetForm() { document.getElementById("FORM1").reset(); document.getElementById("Sample").innerHTML="Form has been reset"; }
