HTML DOM বোতাম টাইপ প্রপার্টি HTML
সিনট্যাক্স
−
-এর সিনট্যাক্স নিচে দেওয়া হলবোতাম টাইপ প্রপার্টি −
সেট করা হচ্ছেbuttonObject.type = "submit|button|reset"
এখানে, সাবমিট|বোতাম|রিসেট হল বোতামের প্রকারের মান। জমা দিন ডিফল্টরূপে সেট করা হয়.
- জমা দিন - বোতামটিকে সাবমিট বাটনে পরিণত করে৷
- বোতাম - একটি সাধারণ ক্লিকযোগ্য বোতাম তৈরি করে।
- রিসেট − একটি রিসেট বোতাম তৈরি করে যা ফর্ম ডেটা রিসেট করে।
উদাহরণ
আসুন HTML DOM বাটন টাইপ প্রপার্টি -
এর একটি উদাহরণ দেখি<!DOCTYPE html>
<html>
<body>
<form id="Form1" action="/sample.php">
<label>First Name: <input type="text" name="fname"><br><br></label>
<label>Surname: <input type="text" name="lname"><br><br></label>
<button id="Button1" type="submit">Submit</button>
</form>
<p>Click the below button below to change the type of the above button from "submit" to "reset".</p>
<button onclick="changeType()">CHANGE</button>
<p id="Sample"></p>
<script>
function changeType() {
document.getElementById("Button1").type = "reset";
document.getElementById("Sample").innerHTML = "The Submit button is now a reset
button";
}
</script>
</body>
</html> আউটপুট
এটি নিম্নলিখিত আউটপুট −
তৈরি করবে
বিশদটি পূরণ করার পরে এবং পরিবর্তন ক্লিক করুন -
এখন Submit এ ক্লিক করুন (যা এখন রিসেট করা হয়েছে) -
উপরের উদাহরণে -
আমরা প্রথমে দুটি পাঠ্য ক্ষেত্র তৈরি করেছি এবং "জমা দিন" টাইপের একটি বোতাম তৈরি করেছি যা আমাদের ডেটা জমা দেবে -
<label>First Name: <input type="text" name="fname"><br><br></label> <label>Surname: <input type="text" name="lname"><br><br></label> <button id="Button1" type="submit">Submit</button>
তারপরে আমরা পরিবর্তন বোতামটি তৈরি করেছি যা ক্লিক −
এ changeType() পদ্ধতি কার্যকর করবে।<button onclick="changeType()">CHANGE</button>
changeType() পদ্ধতিটি তার আইডি ব্যবহার করে বোতাম উপাদানটি পায় এবং এটির ধরনটি পুনরায় সেট করতে সেট করে। তারপর পরিবর্তন সম্পর্কিত বার্তাটি "আইডি" নমুনা সহ অনুচ্ছেদে প্রতিফলিত হয়। এখন আপনি যখন সাবমিট বোতামে ক্লিক করবেন তখন এটি রিসেট হবে অর্থাৎ ফর্ম ডেটা সাবমিট করার পরিবর্তে সাফ করুন −
function changeType() {
document.getElementById("Button1").type = "reset";
document.getElementById("Sample").innerHTML = "The Submit button is now a reset button";
} 