HTML এ ফর্ম। এইচটিএমএল ফর্ম এইচটিএমএল ফর্ম পোস্ট উদাহরণ

শুভেচ্ছা, ব্লগ সাইটের প্রিয় পাঠক। আজ আমি এইচটিএমএল ফর্মের মত কিছু কথা বলতে চাই। আপনার সাইটের ইঞ্জিন (cms) যাই হোক না কেন, এটি অবশ্যই ফর্ম এবং ইনপুট ট্যাগগুলি ব্যবহার করে তৈরি করা ফর্মগুলি বা অন্য কোনও ফর্ম ব্যবহার করবে, সেইসাথে বৈশিষ্ট্য এবং প্যারামিটারগুলি বোতাম, চেক করা, মান, চেকবক্স, রেডিও, চেকবক্স, জমা দিন।

ঠিক আছে, আপনি ড্রপ-ডাউন তালিকা এবং পাঠ্য ক্ষেত্রগুলি তৈরি করার জন্য এই উপাদানগুলিতে যোগ করতে পারেন - নির্বাচন করুন, বিকল্প, টেক্সটেরিয়া, লেবেল, ফিল্ডসেট, কিংবদন্তি।

ফর্মগুলি কেন প্রয়োজন এবং কীভাবে তারা আধুনিক ওয়েবসাইটে কাজ করে?

এই ট্যাগগুলি ব্যবহার করে একই সাইট অনুসন্ধান স্ট্রিং () তৈরি করা হয়েছে এবং আপনার প্রকল্পে একটি অনুসন্ধানের প্রয়োজন হবে। অতএব, সেগুলি কীভাবে গঠন করা হয়েছে এবং কাজ করা হয়েছে তা বোঝা ডিজাইনের সফল কাজের জন্য আপনাকে মোটেও ক্ষতি করবে না এবং আপনি নিজে এটি প্রচার করলে এটি অতিরিক্ত হবে না।

সুতরাং, এই উপাদানগুলি অধ্যয়ন করার প্রয়োজনীয়তাকে ন্যায্যতা দিয়ে, আমি মনে করি আর কোনও প্রশ্ন উত্থাপন করা উচিত নয়, তাই তাদের সম্ভাব্য বিকল্পগুলি অধ্যয়নের জন্য সরাসরি যাওয়ার সময় এসেছে।

হ্যাঁ, আমি আপনাকে মনে করিয়ে দিতে চাই যে আমরা ইতিমধ্যে হাইপারটেক্সট মার্কআপ ভাষার বিষয়ে অনেক উপকরণ পর্যালোচনা করেছি, উদাহরণস্বরূপ, তিন ) এবং।

তাদের মূল অংশে, ফর্মগুলি উপাদানগুলি নিয়ে গঠিত, যা তৈরির জন্য প্রধান পাত্রের ভিতরে ফর্ম ট্যাগগুলি থেকে বিভিন্ন ট্যাগ ঢোকানো হয় - চেক করা, মান, চেকবক্স, রেডিও, চেকবক্স, জমা দেওয়া ইত্যাদি৷ আমাদের কেবল এটির কোডটি যে কোনও সুবিধাজনক জায়গায় রাখতে হবে সাইট টেমপ্লেটে রাখুন, ট্যাগ এবং তাদের বৈশিষ্ট্যগুলি কীভাবে দেখতে হবে তা নির্দেশ করে।

এটি প্রবেশ করা ক্যোয়ারী জমা দেওয়ার জন্য একটি বোতাম সহ একটি পাঠ্য ক্ষেত্র হতে পারে, রেডিও বোতামগুলির সাথে নির্বাচন (যেখানে আপনি প্রদত্ত বোতামগুলির মধ্যে একটি টিপে রাখতে পারেন), জমা দেওয়ার জন্য একটি বোতাম সহ একাধিক পাঠ্য ক্ষেত্র (), এবং আরও অনেক কিছু।

উদাহরণস্বরূপ, "অনুসন্ধান" এর ক্ষেত্রে, মান বৈশিষ্ট্য ব্যবহার করে আপনি একটি প্রশ্ন প্রবেশের জন্য ক্ষেত্রের পাশে অবস্থিত বোতামটিতে ঠিক কী লেখা হবে তা নির্দিষ্ট করতে পারেন। ফর্মগুলিতে প্রবেশ করা ডেটাগুলিকে আরও কিছু উপায়ে প্রক্রিয়া করতে হবে।

উদাহরণস্বরূপ, প্রতিক্রিয়ার ক্ষেত্রে, ব্যবহারকারী, তার নাম সহ ক্ষেত্রটি পূরণ করার পরে, তার ই-মেইল এবং বার্তার পাঠ্য প্রবেশ করান এবং তারপরে প্রেরণ বোতামে ক্লিক করার পরে, ডেটা আশা করার অধিকার থাকবে। ফর্ম থেকে সাইট লেখকের ই-মেইলে পাঠানো হবে। কিন্তু, দুর্ভাগ্যবশত, শুধুমাত্র একটি হাইপারটেক্সট মার্কআপ ভাষা () ব্যবহার করে এটি বাস্তবায়ন করা সম্ভব নয়।

এই উদ্দেশ্যে, আপনার একটি বিশেষ প্রসেসর প্রোগ্রামের প্রয়োজন হবে, যা ব্যবহারকারী পাঠান বোতামে ক্লিক করার পরে, প্রতিক্রিয়া ক্ষেত্রগুলি থেকে সমস্ত ডেটা নেবে এবং সম্পদের মালিককে ইমেলের মাধ্যমে পাঠাবে। অ্যাকশন অ্যাট্রিবিউট ব্যবহার করে কোন প্রোগ্রামটি নিজেই এটি করবে তা আপনাকে অবশ্যই উল্লেখ করতে হবে।

সাধারণত, প্রসেসিং প্রোগ্রাম হল পিএইচপি-তে লেখা একটি স্ক্রিপ্ট। অতএব, ফর্ম ট্যাগের অ্যাকশন অ্যাট্রিবিউটে, আপনাকে আপনার হোস্টিং সার্ভারে অবস্থিত এই স্ক্রিপ্টের ফাইলের পথটি নির্দিষ্ট করতে হবে। আমি আপনাকে ই-মেইলের মাধ্যমে আমার ব্লগের RSS ফিডে সদস্যতা নেওয়ার একটি উদাহরণ দিই:

এটি প্রথমে কিছুটা অস্পষ্ট মনে হতে পারে, তবে আমি মনে করি গল্পটি এগিয়ে যাওয়ার সাথে সাথে সবকিছু পরিষ্কার হয়ে যাবে।

বোতাম, চেকবক্স এবং রেডিও বোতাম তৈরির জন্য ফর্ম এবং ইনপুট ট্যাগ

যে কোন ফর্ম খোলা এবং বন্ধ ট্যাগ আবদ্ধ করা আবশ্যক ফর্ম. এটি তাদের সৃষ্টির জন্য এক ধরনের ধারক। এই ট্যাগের বেশ কয়েকটি প্রয়োজনীয় এবং ঐচ্ছিক বৈশিষ্ট্য রয়েছে:

1. নাম - একটি অনন্য নাম যা অবশ্যই নির্দিষ্ট করতে হবে যদি আপনি কিছু করছেন যেখানে Html ফাইলটি বিভিন্ন ওয়েব ফর্ম ব্যবহার করবে
2. অ্যাকশন - একটি প্রয়োজনীয় বৈশিষ্ট্য যা স্ক্রিপ্টের পথ নির্দেশ করে যেখানে এটি থেকে ডেটা আরও প্রক্রিয়াকরণের জন্য স্থানান্তর করা হবে
3. পদ্ধতি - এটির সাহায্যে আপনি এই ওয়েবফর্ম থেকে হ্যান্ডলার ফাইল স্ক্রিপ্টে ডেটা স্থানান্তর করার পদ্ধতি পরিবর্তন করতে পারেন। যদি আপনি এটি নির্দিষ্ট না করেন, তাহলে Get পদ্ধতিটি ডিফল্টরূপে ব্যবহার করা হবে, যা প্রকৃতপক্ষে, মূলত ভেরিয়েবল এবং ছোট বার্তাগুলির জন্য এবং ব্রাউজারের ঠিকানা বারের মাধ্যমে খোলাখুলিভাবে ডেটা প্রেরণের উদ্দেশ্যে। হ্যান্ডলার স্ক্রিপ্টে ফর্ম ডেটা স্থানান্তর করতে, এটি এখনও ব্যবহার করা ভাল পোস্ট পদ্ধতি, বিশেষভাবে একটি ব্যক্তিগত উপায়ে পাঠ্য বার্তা প্রেরণের জন্য ডিজাইন করা হয়েছে৷

চলুন বাকি ট্যাগগুলো দেখি যা আপনাকে বিভিন্ন ধরনের ওয়েব ফর্ম তৈরি করতে দেয়। সবচেয়ে বহুমুখী হয় ইনপুট. টাইপ অ্যাট্রিবিউটটি অবশ্যই এর ভিতরে লিখতে হবে, যা এই ট্যাগ ব্যবহার করে তৈরি করা HTML ফর্মটি ঠিক কী হবে তা নির্ধারণ করে।

ইনপুট এবং টাইপ ব্যবহার করে আপনি নিম্নলিখিত উপাদানগুলি তৈরি করতে পারেন:

1. একক-লাইন পাঠ্য ক্ষেত্র (Type="Text")
2. একটি পাসওয়ার্ড প্রবেশের জন্য ক্ষেত্র (Type="Password")
3. চেকবক্স (টাইপ="চেকবক্স")
4. রেডিও বোতাম (টাইপ="রেডিও")
5. লুকানো ক্ষেত্র (টাইপ="লুকানো")
6. নিয়মিত বোতাম (Type="Button")
7. হ্যান্ডলারে ডেটা পাঠানোর বোতাম (টাইপ="জমা দিন")
8. ওয়েব ফর্মটিকে আসল অবস্থায় আনার জন্য বোতামগুলি (Type="Reset")
9. সার্ভারে ফাইল আপলোড করার জন্য ক্ষেত্র (Type="File)
10. একটি ছবি সহ বোতাম (টাইপ="চিত্র")

ইনপুট একটি ক্লোজিং ট্যাগ নেই. এটি ব্যবহার করে তৈরি করা একটি ওয়েব ফর্ম ঠিক কেমন হবে তা সম্পূর্ণভাবে নির্ভর করে টাইপ অ্যাট্রিবিউটে নির্দিষ্ট করা প্যারামিটারের উপর। টাইপ নির্দিষ্ট করা না থাকলে, ডিফল্টরূপে একটি পাঠ্য ক্ষেত্র তৈরি করা হবে।

প্রকারের জন্য বিভিন্ন মান সহ ইনপুটে তৈরি ফর্মের উদাহরণ

অন্যান্য ইনপুট ট্যাগ বৈশিষ্ট্য এবং তাদের ব্যবহারের উদাহরণ

আসুন দেখি অন্যান্য বৈশিষ্ট্যগুলির জন্য কী প্রয়োজন:

1. নাম - যদি হ্যান্ডলার প্রোগ্রাম স্ক্রিপ্টে ডেটা পাঠাতে হয়, তাহলে আপনাকে অবশ্যই নাম বৈশিষ্ট্যের জন্য একটি প্যারামিটার নির্দিষ্ট করতে হবে। এই নামের অধীনে, ফর্ম থেকে পাঠানো ডেটা তথ্য প্রসেসর প্রোগ্রামে প্রদর্শিত হবে।
2. আকার - এটি তৈরি করা ওয়েব ফর্মের ক্ষেত্রের আকার সেট করতে ব্যবহৃত হয়। মান এই ক্ষেত্রে ফিট হতে পারে যে অক্ষর সংখ্যা নির্দেশিত হয়. আকার নির্দিষ্ট না হলে, প্রস্থ ডিফল্ট 24 অক্ষর হবে
3. সর্বোচ্চ দৈর্ঘ্য - ডিফল্টরূপে, Html ফর্মে প্রবেশ করা যেতে পারে এমন অক্ষরের সংখ্যা সীমিত নয়, তবে Maxlength ব্যবহার করে আপনি এই সীমাবদ্ধতা সেট করতে পারেন। আপনি ক্ষেত্রে নির্দেশিত অক্ষর থেকে বেশি অক্ষর প্রবেশ করতে সক্ষম হবে না.
4. মান - ক্ষেত্রে বা ডেটা জমা বোতামে ডিফল্টরূপে ঠিক কী লেখা হবে তা নির্দিষ্ট করতে আপনি এটি ব্যবহার করতে পারেন
5. চেক করা হল একটি পতাকা বৈশিষ্ট্য যা রেডিও বোতাম বা চেকবক্সের জন্য ইনপুটে ঢোকানো যেতে পারে। এই ক্ষেত্রে, এই রেডিও বোতাম বা চেকবক্সটি সক্রিয় থাকবে যখন ওয়েব ফর্ম সহ পৃষ্ঠাটি লোড হবে (তাদের ইতিমধ্যে একটি চেক চিহ্ন থাকবে)

এখন সবকিছু দেখা যাক ইনপুট সহ ফর্মের উদাহরণ. পাঠ্য ক্ষেত্রের উপস্থিতি পাসওয়ার্ড এন্ট্রি ক্ষেত্রের উপস্থিতির অনুরূপ, তাই আসুন শুধুমাত্র একটি পাঠ্য তৈরির বিকল্প বিবেচনা করি, উদাহরণস্বরূপ, একটি ইমেল ঠিকানা প্রবেশ করানো:

এখন রেডিও বোতাম (রেডিও) দিয়ে একটি ওয়েব ফর্ম তৈরি করা যাক:

লক্ষ্য করুন যে এই ফর্মটি দুইবার ইনপুট ট্যাগ ব্যবহার করে, একবার দুটি রেডিও বোতাম তৈরি করতে। অধিকন্তু, তাদের প্রত্যেকটিতে একই মান (ফলাফল) সহ নাম বৈশিষ্ট্য রয়েছে এবং মান মান ভিন্ন (হ্যাঁ এবং না)।

এর মানে হল যে এটি প্রসেস করার সময়, যদি কোন সুইচ নির্বাচন করা হয়, একটি ভেরিয়েবল পাঠানো হবে, যার নাম Name এ লেখা আছে, তবে এই ভেরিয়েবলের মান নির্ভর করবে কোন সুইচটি নির্বাচন করা হয়েছে তার উপর।

আসুন চেকবক্স সহ একটি ওয়েব ফর্ম তৈরি করার একটি উদাহরণ দেখি:

আপনাকে একবারে একাধিক বিকল্প নির্বাচন করার অনুমতি দিয়ে চেকবক্সগুলি রেডিও বোতামগুলির থেকে আলাদা৷ হ্যান্ডলার ফাইলে চেকবক্সগুলি কোন চেকবক্সে স্থাপন করা হয়েছে তা নির্ধারণ করতে নাম ব্যবহার করা হয় এবং মানটি হ্যান্ডলারের কাছে পাঠানো মানটি নির্দিষ্ট করে (যদি মান নির্দিষ্ট করা না থাকে, তাহলে এই চেকবক্সের পাশে থাকা পাঠ্যটি হ্যান্ডলারের কাছে পাঠানো হবে) )

নির্বাচন করুন, বিকল্প, টেক্সটেরিয়া, লেবেল, ফিল্ডসেট, কিংবদন্তি - ড্রপ-ডাউন তালিকা, পাঠ্য এলাকা এবং অন্যান্য ওয়েব ফর্ম উপাদান

শুরুতে, আমি আপনাকে একটু মনে করিয়ে দিতে চাই যে ওয়েব ফর্মগুলি আসলে কী এবং কেন সেগুলি ওয়েবসাইটের পৃষ্ঠাগুলিতে প্রয়োজন৷ এগুলি প্রাথমিকভাবে ব্যবহারকারী-বান্ধব আকারে যে কোনও অপারেটিং সিস্টেমে পাওয়া উপাদানগুলিকে প্রতিলিপি করার জন্য ডিজাইন করা হয়েছে: বোতাম, পাঠ্য ইনপুট ক্ষেত্র, ড্রপ-ডাউন তালিকা, চেকবক্স, সুইচ এবং এর মতো।

সমস্ত ব্যবহারকারী, কোন অতিরিক্ত ব্যাখ্যা ছাড়াই, এই উপাদানগুলির উদ্দেশ্য বোঝেন এবং যদি তারা একটি HTML ফর্ম বোতাম দেখতে পান, তারা বুঝতে পারেন যে তাদের এটিতে ক্লিক করতে হবে৷

তদুপরি, এর সমস্ত উপাদান উপাদান (যেমন নির্বাচন, বিকল্প, টেক্সটরিয়া, লেবেল, ফিল্ডসেট, লেজেন্ড) ইতিমধ্যেই সম্পূর্ণ ফাঁকা স্থান (পাত্রে), যা সন্নিবেশ করার জন্য আপনাকে কেবল প্রয়োজনীয় বৈশিষ্ট্য এবং পরামিতি সহ কাঙ্ক্ষিত ট্যাগ ব্যবহার করতে হবে।

ব্রাউজাররা নিজেরাই জানে কিভাবে এই বা সেই ওয়েব ফর্ম উপাদানটি প্রদর্শন করতে হয়। সত্য, বিভিন্ন ব্রাউজারে একই উপাদানের জন্য প্রদর্শনের বিকল্পগুলি একে অপরের থেকে সামান্য আলাদা হতে পারে, তবে, একটি নিয়ম হিসাবে, উল্লেখযোগ্যভাবে নয়।

যে. দেখা যাচ্ছে যে এইচটিএমএল-এ ওয়েব ফর্মগুলি কী স্থানান্তর করার একটি প্রচেষ্টা যে কোনো অপারেটিং সিস্টেমে ব্যবহৃত উপাদান, ওয়েবসাইটের পৃষ্ঠাগুলিতে। কিন্তু কেন তারা সাইটের পৃষ্ঠাগুলিতে প্রয়োজন হতে পারে?

নীতিগতভাবে, একই জিনিসের জন্য যে অনুরূপ উপাদানগুলি অপারেটিং সিস্টেমগুলিতে ব্যবহৃত হয় - ব্যবহারকারীর কাছ থেকে ডেটা স্থানান্তর করা। ফর্মের ক্ষেত্রে, ব্যবহারকারীর কাছ থেকে ডেটা সার্ভারে স্থানান্তরিত হয়, যেখানে এটি একটি বিশেষ প্রোগ্রাম দ্বারা প্রক্রিয়া করা হয় (হাইপারটেক্সট মার্কআপ ভাষা, দুর্ভাগ্যক্রমে, ডেটা প্রক্রিয়াকরণের অনুমতি দেয় না)।

যদিও, ডেটা কেবল সার্ভারেই নয়, উদাহরণস্বরূপ, ফর্ম ট্যাগের অ্যাকশন অ্যাট্রিবিউটে নির্দিষ্ট ঠিকানায় ইমেলের মাধ্যমেও পাঠানো যেতে পারে। এইচটিএমএল থেকে ই-মেইলে ডেটা পাঠানোর সময়, ব্যবহারকারী ক্ষেত্রগুলি পূরণ করে, ডেটা পাঠান বোতামে ক্লিক করার পরে, তার কম্পিউটারে ব্যবহৃত ডিফল্ট মেল প্রোগ্রাম চালু করবে।

এই ক্ষেত্রে খোলার ফর্ম ট্যাগটি এইরকম দেখতে হবে:

নির্বাচন করুন এবং বিকল্প - ড্রপডাউন তালিকা ট্যাগ

সমস্ত ওয়েব ফর্ম উপাদান যা ড্রপ-ডাউন তালিকা ক্ষেত্র তৈরি করে একইভাবে গঠিত হয়। প্রথমে, কম্বো বক্সের ধারকটি খোলা এবং বন্ধ করার এইচটিএমএল নির্বাচন ট্যাগ ব্যবহার করে সেট করা হয়। এবং তারপর, এই পাত্রের ভিতরে, এই তালিকার আইটেমগুলি (উপাদানগুলি) দিয়ে আলাদা পাত্র তৈরি করা হয়। এটি খোলা এবং বন্ধ করার বিকল্প ট্যাগ ব্যবহার করে করা হয়।

এটা এই মত কিছু সক্রিয় আউট:

কিন্তু এটি একটি সরলীকৃত নকশা, কারণ সিলেক্ট এবং অপশনে অনেকগুলো অ্যাট্রিবিউট আছে, যা তৈরি করা ড্রপ-ডাউন তালিকা ক্ষেত্রের বৈশিষ্ট্য এবং উপস্থিতি সংজ্ঞায়িত করে।

1. নাম - নির্বাচন ব্যবহার করে তৈরি করা এই ওয়েব ফর্ম উপাদানটির জন্য আপনাকে অবশ্যই একটি অনন্য নাম উল্লেখ করতে হবে। ভেরিয়েবলের নাম হিসাবে এই নামটি ডেটা হ্যান্ডলার প্রোগ্রামে সার্ভারে প্রেরণ করা হবে। এই ভেরিয়েবলের মান হবে ব্যবহারকারীর নির্বাচিত ড্রপ-ডাউন তালিকা আইটেমের মান বৈশিষ্ট্যের মান (প্রতিটি আইটেমের জন্য বিকল্পে সেট করা)।
2. আকার - আপনি প্রদর্শিত আইটেম সংখ্যা সেট করতে এটি ব্যবহার করতে পারেন. অন্য কথায়, সাইজ ব্যবহার করে আপনি তালিকার উচ্চতা সেট করতে পারেন, প্রদর্শিত লাইনের সংখ্যায় পরিমাপ করা হয়। আপনি যদি নির্বাচন ট্যাগে স্পষ্টভাবে একটি মাপের মান উল্লেখ না করেন, তাহলে ড্রপডাউন তালিকার ডিফল্ট উচ্চতা ব্যবহার করা হবে, এবং নির্বাচন বৈশিষ্ট্যটি অনুপস্থিত বা নির্বাচন বৈশিষ্ট্যে উপস্থিত থাকলে এটি ভিন্ন হবে:
   1. যদি একাধিক সিলেক্টে উপস্থিত থাকে, তাহলে ওয়েব ফর্মে ড্রপ-ডাউন তালিকার উচ্চতা ডিফল্টভাবে এর উপাদানগুলির সংখ্যার সমান হবে। সেগুলো। সমস্ত একাধিক নির্বাচন ড্রপ ডাউন তালিকা আইটেম দেখানো হবে. নিচে উদাহরণ বহুবচন দেখুন. যদি সিলেক্টে সাইজ অ্যাট্রিবিউট আইটেমের সংখ্যার চেয়ে কম সেট করা থাকে, তাহলে ডানদিকে একটি স্ক্রোল বার দেখা যাবে।
   2. সিলেক্টে একাধিক অনুপস্থিত থাকলে, ওয়েব ফর্মে ড্রপ-ডাউন তালিকার উচ্চতা ডিফল্টরূপে এক লাইনের সমান হবে। সেগুলো। শুধুমাত্র একটি লাইন দৃশ্যমান হবে, এবং অবশিষ্ট আইটেমগুলি শুধুমাত্র লিফট বোতাম (ডান দিকে) টিপে অ্যাক্সেসযোগ্য হবে। নীচের উদাহরণ দেখুন
3. মাল্টিপল - সিলেক্ট ট্যাগে এই অ্যাট্রিবিউট অ্যাসাইন করা আপনাকে একই সময়ে একাধিক আইটেম নির্বাচন করার ক্ষমতা সহ একটি ড্রপ-ডাউন তালিকা তৈরি করতে দেয়। নীচে এই বৈশিষ্ট্য সম্পর্কে আরও পড়ুন.

ড্রপ-ডাউন তালিকা সহ ফর্ম দুটি বিকল্পে বিভক্ত করা যেতে পারে। প্রথম বিকল্পে, আপনি একটি ড্রপ-ডাউন তালিকা সহ ক্ষেত্রের শুধুমাত্র একটি উপাদান (লাইন) নির্বাচন করতে পারেন, Ctrl বা Shift ধরে রেখে আপনি একই সাথে উপলব্ধ বেশ কয়েকটি আইটেম নির্বাচন করতে পারেন।

এই ক্ষেত্রে, দ্বিতীয় বিকল্পে, সমস্ত নির্বাচিত আইটেম সম্পর্কে ডেটা সার্ভারে পাঠানো হবে। কোন ড্রপ-ডাউন তালিকা তৈরি করা হবে তা সিলেক্ট ট্যাগে একাধিক অ্যাট্রিবিউটের উপস্থিতি বা অনুপস্থিতি দ্বারা নির্ধারিত হয়।

মাল্টিপল একটি প্যারামিটার ছাড়া সিলেক্টে নির্দিষ্ট করা হয়েছে, কারণ এটি সহজভাবে একাধিক লেখা হয়েছে এবং এটাই। এটি উপস্থিত থাকলে, একাধিক নির্বাচন করার ক্ষমতা সহ একটি ড্রপ-ডাউন তালিকা ওয়েবফর্ম তৈরি করা হবে (Ctrl বা Shift ধরে রাখা)।

একটি ড্রপ-ডাউন তালিকা সহ একটি ক্ষেত্রের একটি বৈকল্পিক, যা থাকবে৷ একাধিক পছন্দ সম্ভব, এই মত কিছু দেখাবে:

ডানদিকে একটি একাধিক নির্বাচন ড্রপডাউন ওয়েবফর্মের উদাহরণ যা উপরের কোডের উপর ভিত্তি করে। আপনি দেখতে পাচ্ছেন, Ctrl বা Shift ধরে রেখে আপনি একই সময়ে বেশ কয়েকটি আইটেম নির্বাচন করতে পারেন।

যদি সিলেক্ট ট্যাগে কোনো একাধিক অ্যাট্রিবিউট না থাকে, তাহলে এই ড্রপ-ডাউন তালিকার (সারি) শুধুমাত্র একটি উপাদান নির্বাচন করা যেতে পারে।

একটি উদাহরণ যেখানে আপনি শুধুমাত্র একটি আইটেম নির্বাচন করতে পারেন এখানে দেখা যাবে:

লেবেল সিলেক্ট সিলেক্টেড সাইট লেজেন্ড

বিকল্প ট্যাগ বৈশিষ্ট্য

তৈরি করা ড্রপ-ডাউন তালিকাতে (নির্বাচন এবং বিকল্প ব্যবহার করে), আপনি গ্রুপ শিরোনাম সহ বিভাজকগুলির মতো কিছু যোগ করতে পারেন, যা ফন্ট শৈলীতে মেনু আইটেমগুলির থেকে আলাদা হবে৷

ড্রপ-ডাউন তালিকা আইটেমগুলি থেকে একটি গোষ্ঠী তৈরি করতে, আপনাকে Optgroup ফর্মের খোলার এবং বন্ধ করার ট্যাগগুলিতে তাদের আবদ্ধ করতে হবে এবং ওপেনিং Optgroup ট্যাগে, লেবেল বৈশিষ্ট্য যোগ করতে হবে, যার একটি প্যারামিটার হিসাবে আপনাকে প্রবেশ করতে হবে গ্রুপের পছন্দসই নাম।

যেমন এই মত:

লেবেল নির্বাচন করুন
নির্বাচিত ওয়েবসাইট লিজেন্ড

Textarea - একটি ফর্মে একটি পাঠ্য ক্ষেত্র তৈরি করা

ওয়েব ফর্মগুলির আরও একটি উপাদান রয়েছে যা আমরা বিবেচনা করিনি - টেক্সটেরিয়া (মাল্টি-লাইন টেক্সট প্রবেশ করার ক্ষমতা সহ একটি ক্ষেত্র)। এটি পেয়ার করা Html ট্যাগ Textarea ব্যবহার করে তৈরি করা হয়েছে। তদুপরি, আপনি এটিতে একটি নতুন লাইনে পাঠ্য মোড়ানো করতে পারেন এবং এটি করা অনুবাদগুলিকে বিবেচনা করে সার্ভারে প্রেরণ করা হবে।

সুতরাং, একটি মাল্টিলাইন টেক্সট ক্ষেত্র তৈরি করতে, আপনাকে একটি খোলা এবং বন্ধ করার টেক্সটরিয়া নির্দিষ্ট করতে হবে এবং তাদের মধ্যে আপনি পাঠ্য যোগ করতে পারেন যা ওয়েব ফর্ম সহ পৃষ্ঠাটি লোড হলে দৃশ্যমান হবে৷ ব্যবহারকারী তারপর এই টেক্সট মুছে ফেলতে পারেন এবং তার নিজের লিখতে পারেন.

আপনি নিজের সম্পর্কে আমাদের কি বলতে পারেন?

আপনি দেখতে পাচ্ছেন, এই উপাদানটি সক্রিয় করতে পাঠ্যটিতে ক্লিক করা অকেজো - আপনাকে নিজেই এটিতে ক্লিক করতে হবে। লেবেল ট্যাগটি ঠিক করার জন্য ডিজাইন করা হয়েছে ঠিক এই অবস্থা। এটি আপনাকে ওয়েব ফর্ম উপাদানের পাশের পাঠ্যটিকে ক্লিকযোগ্য করে তুলতে দেয়, যা নিঃসন্দেহে ব্যবহারযোগ্যতা উন্নত করবে.

কিন্তু কিভাবে Html ফর্ম উপাদান এবং টেক্সট সংযোগ করতে? এটি করার জন্য, আপনাকে অ্যাট্রিবিউটে একটি অনন্য প্যারামিটার সহ একটি আইডি যুক্ত করতে হবে এবং লেবেল ট্যাগগুলি খোলা এবং বন্ধ করার মাধ্যমে পাঠ্যটিকে ঘিরে রাখতে হবে। এবং এটাই সব না। ওপেনিং লেবেল ট্যাগে আপনাকে ফর অ্যাট্রিবিউট অন্তর্ভুক্ত করতে হবে, যার প্যারামিটারটি অবশ্যই ফর্ম এলিমেন্টের এইচটিএমএল ট্যাগের আইডি অ্যাট্রিবিউটের মতোই হতে হবে। এটা এই মত কিছু সক্রিয় আউট:

আপনি দেখতে পাচ্ছেন, এখন, লেবেল ব্যবহারের জন্য ধন্যবাদ, ওয়েব ফর্ম উপাদানগুলি শুধুমাত্র এটিতে ক্লিক করেই নয়, এটির পাশে থাকা পাঠ্যটিতে ক্লিক করেও সক্রিয় করা যেতে পারে।

ফিল্ডসেট এবং কিংবদন্তি - অংশে ফর্ম ভাঙা

আপনি সম্ভবত প্রায়শই দেখেছেন যে এইচটিএমএল-এ বড় আকারগুলিকে গ্রুপে (ফিল্ডসেট) ভাগ করা হয়েছে, যেগুলি একটি ফ্রেম দ্বারা বেষ্টিত এবং এই জাতীয় প্রতিটি গ্রুপের নিজস্ব শিরোনাম (লেজেন্ড) রয়েছে। এটি মাত্র দুটি ট্যাগ ব্যবহার করে প্রয়োগ করা হয়েছে: ফিল্ডসেট এবং কিংবদন্তি। তারা জোড়া হয়, i.e. তাদের অবশ্যই একটি খোলার এবং একটি সমাপ্তি থাকতে হবে।

সুতরাং, কম্পোনেন্ট অংশগুলির একটি গ্রুপ তৈরি করতে, আপনাকে এই সমস্ত অংশগুলি খোলার এবং বন্ধ করার ফিল্ডসেট ট্যাগগুলিতে আবদ্ধ করতে হবে। এবং এই গোষ্ঠীর জন্য একটি শিরোনাম (লেজেন্ড) সেট করার জন্য, আপনাকে খোলার ফিল্ডসেটের অবিলম্বে একটি ওপেনিং এবং ক্লোজিং লেজেন্ডের একটি নির্মাণ লিখতে হবে, যার মধ্যে আপনাকে গ্রুপ শিরোনামের পাঠ্য সন্নিবেশ করতে হবে।

এখানে Fieldset এবং Legend ব্যবহার করে গোষ্ঠী তৈরি করার একটি উদাহরণ রয়েছে:

আপনার জন্য শুভকামনা! ব্লগ সাইটের পাতায় শীঘ্রই দেখা হবে

আপনি আগ্রহী হতে পারে

ড্রপ-ডাউন তালিকা এবং পাঠ্য ক্ষেত্রের ফর্মের জন্য নির্বাচন করুন, বিকল্প, টেক্সটেরিয়া, লেবেল, ফিল্ডসেট, কিংবদন্তি - এইচটিএমএল ট্যাগ
Html কোডে তালিকা - UL, OL, LI এবং DL ট্যাগ৷
MailTo - এটি কি এবং কিভাবে একটি ইমেল পাঠাতে Html এ একটি লিঙ্ক তৈরি করতে হয়
এইচটিএমএল এবং সিএসএস কোডে কীভাবে রঙ সেট করা হয়, টেবিলে আরজিবি শেড নির্বাচন, ইয়ানডেক্স আউটপুট এবং অন্যান্য প্রোগ্রাম
হাইপারটেক্সট মার্কআপ ল্যাঙ্গুয়েজ Html কি এবং কিভাবে W3C ভ্যালিডেটরে সমস্ত ট্যাগের তালিকা দেখতে হয়
কিভাবে HTML - IMG এবং A ট্যাগে একটি লিঙ্ক এবং একটি ছবি (ছবি) সন্নিবেশ করা যায়
Html-এ টেবিল - টেবিল, Tr এবং Td ট্যাগ, সেইসাথে Colspan, Cellpadding, Cellspacing এবং Rowspan তৈরি করার জন্য
ফন্ট (ফেস, সাইজ এবং কালার), ব্লককোট এবং প্রি ট্যাগ - বিশুদ্ধ এইচটিএমএল-এ লিগ্যাসি টেক্সট ফরম্যাটিং (কোনও সিএসএস ব্যবহার করা হয়নি)
কীভাবে একটি হাইপারলিঙ্ক তৈরি করবেন (A, Href, টার্গেট ব্ল্যাঙ্ক), কীভাবে এটি সাইটে একটি নতুন উইন্ডোতে খুলবেন এবং এইচটিএমএল কোডে একটি ছবিকে একটি লিঙ্ক তৈরি করবেন

এইচটিএমএল ফর্মওয়েবসাইট দর্শকদের কাছ থেকে তথ্য সংগ্রহ করতে ব্যবহার করা হয় যে নিয়ন্ত্রণ.

ওয়েব ফর্মগুলি পাঠ্য ক্ষেত্র, বোতাম, তালিকা এবং অন্যান্য নিয়ন্ত্রণের একটি সংগ্রহ নিয়ে গঠিত যা একটি মাউস ক্লিক দ্বারা সক্রিয় হয়। প্রযুক্তিগতভাবে, ফর্মগুলি ব্যবহারকারীর কাছ থেকে দূরবর্তী সার্ভারে ডেটা পাস করে।

ওয়েব প্রোগ্রামিং ভাষা যেমন পিএইচপি, পার্ল.

HTML5 এর আবির্ভাবের আগে, ওয়েব ফর্মগুলি বেশ কয়েকটি উপাদানের একটি সংগ্রহ ছিল , একটি বোতাম দিয়ে শেষ . বিভিন্ন ব্রাউজার জুড়ে ফর্ম স্টাইল করতে অনেক প্রচেষ্টা লেগেছে। অতিরিক্তভাবে, ইনপুট যাচাই করার জন্য ফর্মগুলির জাভাস্ক্রিপ্টের প্রয়োজন হয় এবং প্রতিদিনের তথ্য যেমন তারিখ, ইমেল ঠিকানা এবং URL উল্লেখ করার জন্য নির্দিষ্ট ইনপুট ক্ষেত্রের প্রকারের অভাব ছিল।

HTML5 ফর্মনতুন বৈশিষ্ট্যের উপস্থিতি সহ এই সাধারণ সমস্যাগুলির বেশিরভাগ সমাধান করেছে, যা দ্বারা ফর্ম উপাদানগুলির চেহারা পরিবর্তন করার ক্ষমতা প্রদান করে CSS3.

ভাত। 1. HTML5 সহ উন্নত ওয়েব ফর্ম

একটি HTML5 ফর্ম তৈরি করা

1. উপাদান

যে কোন ফর্মের ভিত্তি হল উপাদান .... এটি একটি ধারক হিসাবে কোন ইনপুট প্রয়োজন হয় না, সমস্ত ফর্ম নিয়ন্ত্রণ একসাথে রাখা - ক্ষেত্র. এই উপাদানের বৈশিষ্ট্যগুলি এমন তথ্য ধারণ করে যা সমস্ত ফর্ম ক্ষেত্রের জন্য সাধারণ, তাই যে ক্ষেত্রগুলি যৌক্তিকভাবে একত্রিত হয় সেগুলিকে অবশ্যই একটি ফর্মে অন্তর্ভুক্ত করতে হবে৷

সারণী 1. ট্যাগ বৈশিষ্ট্য

বৈশিষ্ট্য	অর্থ/বর্ণনা
গ্রহণ-বর্ণমালা	বৈশিষ্ট্য মান একটি স্থান পৃথক করা হয় অক্ষর এনকোডিংয়ের তালিকা, যা ফর্ম জমা দিতে ব্যবহার করা হবে, উদাহরণস্বরূপ, .
কর্ম	প্রয়োজনীয় বৈশিষ্ট্য, যা সার্ভারে ফর্ম হ্যান্ডলারের url নির্দিষ্ট করে যেখানে ডেটা পাঠানো হয়। এটি একটি ফাইল (উদাহরণস্বরূপ, action.php) যা বর্ণনা করে যে ফর্ম ডেটা দিয়ে কী করা দরকার। যদি অ্যাট্রিবিউটের মান নির্দিষ্ট করা না থাকে, তাহলে পৃষ্ঠাটি পুনরায় লোড হওয়ার পরে, ফর্ম উপাদানগুলি তাদের ডিফল্ট মানগুলি গ্রহণ করবে। যদি সমস্ত কাজ জাভাস্ক্রিপ্ট স্ক্রিপ্ট দ্বারা ক্লায়েন্টের দিকে করা হয়, তাহলে আপনি কর্ম বৈশিষ্ট্যের জন্য মান # নির্দিষ্ট করতে পারেন। আপনি ভিজিটর দ্বারা পূরণ করা ফর্মটি ইমেলের মাধ্যমে আপনাকে পাঠানোর ব্যবস্থা করতে পারেন। এটি করার জন্য আপনাকে নিম্নলিখিত এন্ট্রি করতে হবে:
স্বয়ংসম্পূর্ণ
এনটাইপ	নির্দেশ করতে ব্যবহৃত হয় MIME- ফর্মের সাথে পাঠানো ডেটার প্রকার, উদাহরণস্বরূপ, enctype="multipart/form-data"। শুধুমাত্র method="post" এর ক্ষেত্রে নির্দিষ্ট করা হয়েছে। application/x-www-form-urlencoded হল ডিফল্ট বিষয়বস্তুর ধরন, যা নির্দেশ করে যে পাস করা ডেটা URL-এনকোডেড ফর্ম ভেরিয়েবলের একটি তালিকা উপস্থাপন করে। স্পেস অক্ষর (ASCII 32) + হিসাবে এনকোড করা হবে এবং একটি বিশেষ অক্ষর যেমন ! হেক্সাডেসিমেলে %21 হিসাবে এনকোড করা হবে। মাল্টিপার্ট/ফর্ম-ডেটা - ফাইল, নন-এএসসিআইআই ডেটা এবং বাইনারি ডেটা সমন্বিত ফর্মগুলি জমা দিতে ব্যবহৃত হয়, এটি বেশ কয়েকটি অংশ নিয়ে গঠিত, যার প্রতিটি একটি পৃথক ফর্ম উপাদানের বিষয়বস্তু উপস্থাপন করে। টেক্সট/প্লেইন - নির্দেশ করে যে প্লেইন (এইচটিএমএল নয়) টেক্সট পাঠানো হচ্ছে।
পদ্ধতি	ফর্ম ডেটা কীভাবে জমা দেওয়া হয় তা নির্দিষ্ট করে। প্রাপ্ত পদ্ধতি ব্রাউজারের ঠিকানা বারের মাধ্যমে সার্ভারে ডেটা প্রেরণ করে। সার্ভারে একটি অনুরোধ তৈরি করার সময়, সমস্ত ভেরিয়েবল এবং তাদের মানগুলি www.anysite.ru/form.php?var1=1&var2=2 এর মতো একটি ক্রম তৈরি করে। পরিবর্তনশীল নাম এবং মান চিহ্নের পরে সার্ভার ঠিকানায় সংযুক্ত করা হয়? এবং & দ্বারা পৃথক করা হয়। সমস্ত বিশেষ অক্ষর এবং অ-ল্যাটিন অক্ষরগুলি %nn বিন্যাসে এনকোড করা হয়েছে, স্থানটি + দ্বারা প্রতিস্থাপিত হয়েছে। আপনি যদি প্রচুর পরিমাণে তথ্য স্থানান্তর না করেন তবে এই পদ্ধতিটি ব্যবহার করা উচিত। যদি আপনি ফর্ম সহ একটি ফাইল পাঠাতে অনুমিত হয়, এই পদ্ধতি কাজ করবে না. পোস্ট পদ্ধতিটি প্রচুর পরিমাণে ডেটা, সেইসাথে গোপনীয় তথ্য এবং পাসওয়ার্ড পাঠাতে ব্যবহৃত হয়। এই পদ্ধতি ব্যবহার করে পাঠানো ডেটা URL শিরোনামে দৃশ্যমান নয় কারণ এটি বার্তার মূল অংশে রয়েছে।
নাম	সেট ফর্মের নাম, যা স্ক্রিপ্টের মাধ্যমে ফর্ম উপাদানগুলি অ্যাক্সেস করতে ব্যবহার করা হবে, যেমন name="opros"।
বৈধ করা	ফর্ম জমা বোতামে বৈধতা অক্ষম করে। কোনো মান উল্লেখ না করেই অ্যাট্রিবিউট ব্যবহার করা হয়
লক্ষ্য	যে উইন্ডোতে তথ্য পাঠানো হবে তা নির্দিষ্ট করে: _খালি - নতুন উইন্ডো _self - একই ফ্রেম _parent — প্যারেন্ট ফ্রেম (যদি এটি বিদ্যমান থাকে, যদি না থাকে, তাহলে বর্তমানের সাথে) _top হল এই ফ্রেমের সাপেক্ষে শীর্ষ-স্তরের উইন্ডো। যদি একটি চাইল্ড ফ্রেম থেকে কল না আসে, তবে একই ফ্রেমে।

2. গ্রুপিং ফর্ম উপাদান

উপাদান

...

একে অপরের সাথে সম্পর্কিত উপাদানগুলিকে গোষ্ঠীভুক্ত করার জন্য ডিজাইন করা হয়েছে, এইভাবে ফর্মটিকে লজিক্যাল খণ্ডে বিভক্ত করে৷

উপাদানগুলির প্রতিটি গ্রুপকে উপাদান ব্যবহার করে নামকরণ করা যেতে পারে

, যা ট্যাগের পরপরই আসে

. গ্রুপের নাম বাম উপরের সীমানায় প্রদর্শিত হবে

. উদাহরণস্বরূপ, যদি একটি উপাদান

যোগাযোগের তথ্য সংরক্ষণ করা হয়:

যোগাযোগের তথ্য

নাম *

ইমেইল

ভাত। 2. গ্রুপিং ফর্ম উপাদান ব্যবহার করে

টেবিল 2. ট্যাগ বৈশিষ্ট্য

বৈশিষ্ট্য	অর্থ/বর্ণনা
অক্ষম	যদি অ্যাট্রিবিউটটি উপস্থিত থাকে, তাহলে ধারকটির ভিতরে অবস্থিত সম্পর্কিত ফর্ম উপাদানগুলির একটি গ্রুপ , পূরণ এবং সম্পাদনার জন্য অক্ষম। পূর্বে প্রবেশ করা ডেটা ধারণকারী নির্দিষ্ট ফর্ম ক্ষেত্রের অ্যাক্সেস সীমাবদ্ধ করতে ব্যবহৃত হয়। বৈশিষ্ট্যটি একটি মান উল্লেখ না করে ব্যবহার করা হয় - .
ফর্ম	একই নথিতে। এক বা একাধিক ফর্ম নির্দেশ করে যা এই উপাদানগুলির গ্রুপের অন্তর্গত। অ্যাট্রিবিউটটি বর্তমানে কোনো ব্রাউজার দ্বারা সমর্থিত নয়।
নাম	সংজ্ঞায়িত করে নাম, যা জাভাস্ক্রিপ্টের উপাদানগুলিকে রেফারেন্স করতে বা ফর্মটি পূরণ এবং জমা দেওয়ার পরে ফর্ম ডেটা রেফার করতে ব্যবহার করা হবে৷ এটি আইডি অ্যাট্রিবিউটের সাথে সাদৃশ্যপূর্ণ।

3. ফর্ম ক্ষেত্র তৈরি করুন

উপাদান বেশিরভাগ ফর্ম ক্ষেত্র তৈরি করে। একটি উপাদানের বৈশিষ্ট্যগুলি উপাদানটি তৈরি করতে ব্যবহৃত ক্ষেত্রের ধরণের উপর নির্ভর করে পৃথক হয়।

CSS শৈলী ব্যবহার করে, আপনি ফন্টের আকার, ফন্টের ধরন, রঙ এবং অন্যান্য পাঠ্য বৈশিষ্ট্য পরিবর্তন করতে পারেন, পাশাপাশি সীমানা, পটভূমির রঙ এবং পটভূমি চিত্র যোগ করতে পারেন। ক্ষেত্রের প্রস্থ প্রস্থ বৈশিষ্ট্য দ্বারা নির্দিষ্ট করা হয়।

সারণী 3. ট্যাগ বৈশিষ্ট্য

বৈশিষ্ট্য	অর্থ/বর্ণনা
গ্রহণ	সার্ভারে পাঠানোর জন্য অনুমোদিত ফাইলের ধরন নির্ধারণ করে। শুধুমাত্র জন্য নির্দেশিত . সম্ভাব্য মান: file_extension - নির্দিষ্ট এক্সটেনশন সহ ফাইল ডাউনলোড করার অনুমতি দেয়, উদাহরণস্বরূপ, accept=".gif" , accept=".pdf" , accept=".doc" অডিও/* - অডিও ফাইল ডাউনলোড করার অনুমতি দেয় ভিডিও/* - ভিডিও ফাইল ডাউনলোড করার অনুমতি দেয় image/* - ছবি লোড করার অনুমতি দেয় media_type - ডাউনলোড করা ফাইলগুলির মিডিয়া প্রকার নির্দেশ করে।
alt	সংজ্ঞায়িত করে বিকল্প পাঠ্যছবির জন্য, শুধুমাত্র জন্য নির্দেশিত .
স্বয়ংসম্পূর্ণ	পাঠ্য ক্ষেত্রে প্রবেশ করা মানগুলি মনে রাখার জন্য এবং পরের বার যখন আপনি সেগুলি প্রবেশ করবেন তখন স্বয়ংক্রিয়ভাবে সেগুলি প্রতিস্থাপন করার জন্য দায়ী: অন ​​- এর অর্থ হল ক্ষেত্রটি সুরক্ষিত নয় এবং এর মান সংরক্ষণ এবং পুনরুদ্ধার করা যেতে পারে, বন্ধ - ফর্ম ক্ষেত্রগুলির জন্য স্বতঃপূরণ নিষ্ক্রিয় করে৷
অটোফোকাস	আপনাকে নিশ্চিত করতে দেয় যে লোডিং ফর্মে এক বা অন্য ইনপুট ক্ষেত্রে ইতিমধ্যেই ফোকাস রয়েছে (নির্বাচিত করা হয়েছে), একটি মান প্রবেশ করার জন্য প্রস্তুত।
চেক করা	টাইপ="চেকবক্স" এবং type="radio" এর মতো ক্ষেত্রগুলির জন্য পৃষ্ঠা লোডে ডিফল্ট চেকবক্সটি চেক করা হয়েছে কিনা তা অ্যাট্রিবিউটটি পরীক্ষা করে।
অক্ষম
ফর্ম	অ্যাট্রিবিউটের মান অবশ্যই এলিমেন্টের আইডি অ্যাট্রিবিউটের সমান হতে হবে একই নথিতে। এক বা একাধিক ফর্ম শনাক্ত করে যা এই ফর্ম ক্ষেত্রটির অন্তর্গত৷
গঠন	ফাইলের url নির্দিষ্ট করে যা ফর্ম জমা দেওয়ার সময় ক্ষেত্রগুলিতে প্রবেশ করা ডেটা প্রক্রিয়া করবে। শুধুমাত্র type="submit" এবং type="image" ক্ষেত্রগুলির জন্য সেট করুন। অ্যাট্রিবিউট ফর্মের অ্যাকশন অ্যাট্রিবিউটের মানকে ওভাররাইড করে।
গঠন প্রকার	সার্ভারে পাঠানো হলে ফর্ম ফিল্ড ডেটা কীভাবে এনকোড করা হবে তা নির্ধারণ করে। ফর্মের এনটাইপ অ্যাট্রিবিউটের মান ওভাররাইড করে। শুধুমাত্র type="submit" এবং type="image" ক্ষেত্রগুলির জন্য সেট করুন। বিকল্প: application/-x-www-form-urlencoded হল ডিফল্ট মান। পাঠানোর আগে সমস্ত অক্ষর এনকোড করা হয় (স্পেসগুলি + অক্ষর দিয়ে প্রতিস্থাপিত হয়, বিশেষ অক্ষরগুলি ASCII HEX মানগুলিতে রূপান্তরিত হয়) মাল্টিপার্ট/ফর্ম-ডেটা - অক্ষর এনকোড করা হয় না টেক্সট/প্লেন - স্পেসগুলি + চিহ্ন দিয়ে প্রতিস্থাপিত হয় এবং বিশেষ অক্ষর এনকোড করা হয় না।
ফর্ম পদ্ধতি	বৈশিষ্ট্যটি সার্ভারে ফর্ম ডেটা জমা দেওয়ার জন্য ব্রাউজার যে পদ্ধতি ব্যবহার করবে তা নির্দিষ্ট করে৷ শুধুমাত্র type="submit" এবং type="image" ক্ষেত্রগুলির জন্য সেট করুন। ফর্মের মেথড অ্যাট্রিবিউটের মান ওভাররাইড করে। বিকল্প: get হল ডিফল্ট মান। ফর্ম থেকে ডেটা (নাম/মান জোড়া) ইউআরএলে যোগ করা হয় এবং সার্ভারে পাঠানো হয়: URL?name=value&name=value পোস্ট-ফর্ম ডেটা একটি http অনুরোধ হিসাবে পাঠানো হয়।
ফর্মনোলিডেট	নির্দিষ্ট করে যে ফর্ম ফিল্ড ডেটা ফর্ম জমা দেওয়ার সময় যাচাই করা উচিত নয়৷ ফর্মের নোভালিডেট অ্যাট্রিবিউটের মান ওভাররাইড করে। একটি বৈশিষ্ট্য মান উল্লেখ না করে ব্যবহার করা যেতে পারে.
ফরমটার্গেট	ফর্ম জমা দেওয়ার পরে প্রাপ্ত প্রতিক্রিয়া কোথায় প্রদর্শন করতে হবে তা নির্ধারণ করে। শুধুমাত্র type="submit" এবং type="image" ক্ষেত্রগুলির জন্য সেট করুন। ফর্মের টার্গেট অ্যাট্রিবিউটের মান ওভাররাইড করে। _parent - অভিভাবক ফ্রেমে প্রতিক্রিয়া লোড করে _top - পূর্ণ পর্দায় প্রতিক্রিয়া লোড করে framename - নির্দিষ্ট নামের সাথে একটি ফ্রেমে প্রতিক্রিয়া লোড করে।
উচ্চতা	অ্যাট্রিবিউট মান পরিমাপের একটি একক উল্লেখ না করেই পিক্সেলের সংখ্যা ধারণ করে। type="image" টাইপের ফর্ম ক্ষেত্রের উচ্চতা সেট করে, উদাহরণস্বরূপ, . এটি একই সময়ে ক্ষেত্রের উচ্চতা এবং প্রস্থ উভয় সেট করার সুপারিশ করা হয়।
তালিকা	একটি উপাদান একটি রেফারেন্স
সর্বোচ্চ	আপনাকে সাংখ্যিক ডেটার অনুমোদিত ইনপুটকে সর্বাধিক মান পর্যন্ত সীমাবদ্ধ করার অনুমতি দেয়; মিন অ্যাট্রিবিউটের সাথে এই অ্যাট্রিবিউটটি ব্যবহার করার পরামর্শ দেওয়া হয়। নিম্নলিখিত ক্ষেত্রের প্রকারের সাথে কাজ করে: সংখ্যা, পরিসর, তারিখ, তারিখ সময়, তারিখ-স্থানীয়, মাস, সময় এবং সপ্তাহ।
সর্বোচ্চ দৈর্ঘ্য	বৈশিষ্ট্যটি ক্ষেত্রে প্রবেশ করা অক্ষরের সর্বাধিক সংখ্যা নির্দিষ্ট করে। ডিফল্ট মান হল 524288 অক্ষর।
মিনিট	আপনাকে অনুমোদিত সাংখ্যিক ইনপুটকে ন্যূনতম মান পর্যন্ত সীমিত করার অনুমতি দেয়।
একাধিক	ব্যবহারকারীকে কমা দ্বারা পৃথক করা একাধিক বৈশিষ্ট্য মান প্রবেশ করার অনুমতি দেয়৷ ফাইল এবং ইমেল ঠিকানা প্রযোজ্য. অ্যাট্রিবিউট মান ছাড়াই নির্দিষ্ট করা হয়েছে।
নাম	নামটি নির্দিষ্ট করে যা উপাদানটি অ্যাক্সেস করতে ব্যবহার করা হবে , উদাহরণস্বরূপ, css স্টাইল শীটে। এটি আইডি অ্যাট্রিবিউটের সাথে সাদৃশ্যপূর্ণ।
প্যাটার্ন	আপনি ব্যবহার নির্ধারণ করতে পারবেন নিয়মিত অভিব্যক্তিডেটার সিনট্যাক্স যা একটি নির্দিষ্ট ক্ষেত্রে প্রবেশ করার অনুমতি দেওয়া আবশ্যক। উদাহরণস্বরূপ, প্যাটার্ন="(3)-(3)" - বর্গাকার বন্ধনীগুলি গ্রহণযোগ্য অক্ষরগুলির পরিসর সেট করে, এই ক্ষেত্রে - যে কোনও ছোট হাতের অক্ষর, কোঁকড়া বন্ধনীতে সংখ্যাটি নির্দেশ করে যে তিনটি ছোট হাতের অক্ষর প্রয়োজন, একটি ড্যাশ অনুসরণ করে, তারপর 0 থেকে 9 এর মধ্যে তিনটি সংখ্যা।
স্থানধারক	টেক্সট ধারণ করে যা ইনপুট ফিল্ডে পূর্ণ হওয়ার আগে প্রদর্শিত হয় (বেশিরভাগ ক্ষেত্রে এটি একটি টুলটিপ)।
শুধুমাত্র পাঠযোগ্য	ব্যবহারকারীকে ফর্ম উপাদানগুলির মান পরিবর্তন করার অনুমতি দেয় না, পাঠ্য নির্বাচন এবং অনুলিপি করা এখনও উপলব্ধ। অ্যাট্রিবিউট মান ছাড়াই নির্দিষ্ট করা হয়েছে।
প্রয়োজনীয়	এই ক্ষেত্রটি প্রয়োজনীয় তা নির্দেশ করে একটি বার্তা প্রদর্শন করে। যদি ব্যবহারকারী এই ক্ষেত্রে প্রয়োজনীয় মান না লিখে ফর্মটি জমা দেওয়ার চেষ্টা করে, তাহলে স্ক্রিনে একটি সতর্কতা বার্তা প্রদর্শিত হবে। অ্যাট্রিবিউট মান ছাড়াই নির্দিষ্ট করা হয়েছে।
আকার	ক্ষেত্রের দৃশ্যমান প্রস্থ অক্ষরে সেট করে। ডিফল্ট মান হল 20। নিম্নলিখিত ক্ষেত্রের প্রকারের সাথে কাজ করে: পাঠ্য, অনুসন্ধান, টেলিফোন, ইউআরএল, ইমেল এবং পাসওয়ার্ড।
src	ফর্ম জমা বোতাম হিসাবে ব্যবহৃত ছবির url নির্দিষ্ট করে। শুধুমাত্র ক্ষেত্রের জন্য নির্দেশিত .
পদক্ষেপ	সাংখ্যিক মানের ইনপুট প্রয়োজন এমন উপাদানগুলির জন্য ব্যবহৃত, পরিসীমা সামঞ্জস্য প্রক্রিয়া (ধাপ) চলাকালীন মানগুলি বৃদ্ধি বা হ্রাস করার পরিমাণ নির্দেশ করে।
টাইপ	বোতাম - একটি বোতাম তৈরি করে।
	চেকবক্স - একটি ইনপুট ক্ষেত্রকে একটি চেকবক্সে পরিণত করে যা চেক বা সাফ করা যেতে পারে, যেমন আমার একটা গাড়ি আছে
	রঙ - সমর্থনকারী ব্রাউজারগুলিতে রঙ প্যালেট তৈরি করে, ব্যবহারকারীদের হেক্সাডেসিমেল বিন্যাসে রঙের মান নির্বাচন করতে দেয়।
	তারিখ — আপনাকে dd.mm.yyyy বিন্যাসে একটি তারিখ লিখতে দেয়। জন্মদিন:
	datetime-local - আপনাকে dd.mm.yyyy hh:mm প্যাটার্ন ব্যবহার করে একটি বড় ইংরেজি অক্ষর T দ্বারা পৃথক করা তারিখ এবং সময় প্রবেশ করতে দেয়। জন্মদিন - দিন এবং সময়:
	ইমেল - এই বৈশিষ্ট্যটিকে সমর্থন করে এমন ব্রাউজারগুলি ব্যবহারকারীর কাছে এমন ডেটা প্রবেশের আশা করবে যা ইমেল ঠিকানাগুলির সিনট্যাক্সের সাথে মেলে। ইমেইল:
	ফাইল - আপনাকে ব্যবহারকারীর কম্পিউটার থেকে ফাইল ডাউনলোড করতে দেয়। ফাইল পছন্দ কর:
	লুকানো - নিয়ন্ত্রণ লুকিয়ে রাখে, যা ব্রাউজার দ্বারা প্রদর্শিত হয় না এবং ব্যবহারকারীকে ডিফল্ট মান পরিবর্তন করতে বাধা দেয়।
	চিত্র - একটি বোতাম তৈরি করে, আপনাকে বোতামে পাঠ্যের পরিবর্তে একটি চিত্র সন্নিবেশ করার অনুমতি দেয়।
	মাস - ব্যবহারকারীকে yyyy-mm প্যাটার্ন ব্যবহার করে বছর এবং মাসের সংখ্যা প্রবেশ করার অনুমতি দেয়৷
	সংখ্যা - পূর্ণসংখ্যা মান প্রবেশ করার উদ্দেশ্যে। এর ন্যূনতম, সর্বোচ্চ এবং ধাপের বৈশিষ্ট্যগুলি যথাক্রমে উপরের, নিম্ন সীমা এবং মানগুলির মধ্যে ধাপ নির্দিষ্ট করে৷ এই বৈশিষ্ট্যগুলি সংখ্যাসূচক সূচক আছে এমন সমস্ত উপাদানের জন্য অনুমান করা হয়। তাদের ডিফল্ট মান উপাদান ধরনের উপর নির্ভর করে. অনুগ্রহ করে পরিমাণ নির্দেশ করুন (1 থেকে 5 পর্যন্ত):
	পাসওয়ার্ড - ফর্মটিতে পাঠ্য ক্ষেত্র তৈরি করে, যখন ব্যবহারকারীর দ্বারা প্রবেশ করা অক্ষরগুলি তারকাচিহ্ন, বুলেট বা ব্রাউজার দ্বারা ইনস্টল করা অন্যান্য আইকন দ্বারা প্রতিস্থাপিত হয়। পাসওয়ার্ড লিখুন:
	রেডিও - একটি সুইচ তৈরি করে - একটি ছোট বৃত্তের আকারে একটি নিয়ন্ত্রণ যা চালু বা বন্ধ করা যেতে পারে। নিরামিষাশী:
	পরিসীমা - আপনাকে একটি ইন্টারফেস উপাদান তৈরি করার অনুমতি দেবে যেমন একটি স্লাইডার, ন্যূনতম / সর্বোচ্চ - আপনাকে নির্বাচনের পরিসর সেট করার অনুমতি দেবে
	রিসেট - একটি বোতাম তৈরি করে যা ব্যবহারকারীর প্রবেশ করা ডেটার ফর্ম ক্ষেত্রগুলি সাফ করে।
	অনুসন্ধান - একটি অনুসন্ধান ক্ষেত্র নির্দেশ করে, ডিফল্টরূপে ইনপুট ক্ষেত্রটি আয়তক্ষেত্রাকার আকারে থাকে। অনুসন্ধান:
	জমা - একটি স্ট্যান্ডার্ড বোতাম তৈরি করে যা একটি মাউস ক্লিক দ্বারা সক্রিয় হয়। বোতামটি ফর্ম থেকে তথ্য সংগ্রহ করে এবং প্রক্রিয়াকরণের জন্য জমা দেয়।
	পাঠ্য - একটি ফর্মে পাঠ্য ক্ষেত্র তৈরি করে, পাঠ্য ইনপুটের জন্য একটি একক-লাইন পাঠ্য ক্ষেত্র আউটপুট করে।
	সময় - আপনাকে hh:mm প্যাটার্ন ব্যবহার করে 24-ঘন্টা বিন্যাসে সময় প্রবেশ করতে দেয়। সমর্থনকারী ব্রাউজারগুলিতে, এটি একটি মাউস-সম্পাদনাযোগ্য মান সহ একটি সংখ্যাসূচক ইনপুট ক্ষেত্র নিয়ন্ত্রণ হিসাবে প্রদর্শিত হয় এবং শুধুমাত্র সময়ের মানগুলি প্রবেশ করার অনুমতি দেয়। সময় নির্দিষ্ট করুন:
	url-ক্ষেত্রটি ইউআরএল নির্দিষ্ট করার উদ্দেশ্যে। হোম পেজ:
	সপ্তাহ - সংশ্লিষ্ট পয়েন্টার টুল ব্যবহারকারীকে বছরের একটি সপ্তাহ নির্বাচন করতে দেয়, যার পরে এটি nn-yyyy বিন্যাসে ডেটা এন্ট্রি প্রদান করবে। বছরের উপর নির্ভর করে, সপ্তাহের সংখ্যা 52 বা 53 হতে পারে। সপ্তাহ নির্দিষ্ট করুন:
মান	একটি বোতামে, একটি ক্ষেত্রে বা সংশ্লিষ্ট পাঠ্যে প্রদর্শিত পাঠ্য নির্ধারণ করে। টাইপ ফাইলের ক্ষেত্রের জন্য নির্দিষ্ট নয়।
প্রস্থ	বৈশিষ্ট্যের মানটিতে পিক্সেলের সংখ্যা রয়েছে। আপনাকে ফর্ম ক্ষেত্রগুলির প্রস্থ সেট করার অনুমতি দেয়।

4. টেক্সট ইনপুট ক্ষেত্র

উপাদান ...উপাদানের পরিবর্তে ব্যবহৃত হয় যখন আপনাকে বড় পাঠ্য ক্ষেত্র তৈরি করতে হবে। মূল মান হিসাবে প্রদর্শিত পাঠ্যটি ট্যাগের ভিতরে স্থাপন করা হয়। ক্ষেত্রের মাত্রাগুলি অ্যাট্রিবিউটগুলি ব্যবহার করে সেট করা হয় col - অনুভূমিক মাত্রা, সারি - উল্লম্ব মাত্রা। উচ্চতা বৈশিষ্ট্য ব্যবহার করে ক্ষেত্রের উচ্চতা সেট করা যেতে পারে। একটি মনোস্পেস ফন্টে একটি অক্ষরের আকারের উপর ভিত্তি করে সমস্ত আকার গণনা করা হয়।

সারণী 4. ট্যাগ বৈশিষ্ট্য <tr><th>বৈশিষ্ট্য</th> <th>অর্থ/বর্ণনা</th> </tr><tr><td>অটোফোকাস</td> <td>স্বয়ংক্রিয়ভাবে পছন্দসই প্রাথমিক পাঠ্য ক্ষেত্রে ফোকাস সেট করে।</td> </tr><tr><td>কলস</td> <td>অক্ষরের সংখ্যা অনুসারে প্রস্থ নির্ধারণ করে। ব্যবহারকারী যদি আরও পাঠ্য প্রবেশ করে, একটি স্ক্রোল বার প্রদর্শিত হয়।</td> </tr><tr><td>অক্ষম</td> <td>ক্ষেত্রের বিষয়বস্তু সম্পাদনা এবং অনুলিপি করার ক্ষমতা অক্ষম করে।</td> </tr><tr><td>ফর্ম</td> <td>অ্যাট্রিবিউটের মান অবশ্যই এলিমেন্টের আইডি অ্যাট্রিবিউটের মানের সমান হতে হবে <form>একই নথিতে। এই পাঠ্য ক্ষেত্রটি এক বা একাধিক ফর্ম সনাক্ত করে।</td> </tr><tr><td>সর্বোচ্চ দৈর্ঘ্য</td> <td>অ্যাট্রিবিউট মান ক্ষেত্রের মধ্যে প্রবেশ করতে অক্ষরের সর্বাধিক সংখ্যা নির্দিষ্ট করে।</td> </tr><tr><td>নাম</td> <td>পাঠ্য ক্ষেত্রের নাম নির্দিষ্ট করে।</td> </tr><tr><td>স্থানধারক</td> <td>একটি সংক্ষিপ্ত পাঠ্য প্রম্পট সংজ্ঞায়িত করে যা প্রত্যাশিত ইনপুট মান বর্ণনা করে।</td> </tr><tr><td>শুধুমাত্র পাঠযোগ্য</td> <td>ক্ষেত্রের বিষয়বস্তু সম্পাদনা করার ক্ষমতা অক্ষম করে।</td> </tr><tr><td>প্রয়োজনীয়</td> <td>এই ক্ষেত্রটি প্রয়োজনীয় তা নির্দেশ করে একটি বার্তা প্রদর্শন করে।</td> </tr><tr><td>সারি</td> <td>একটি সংখ্যা নির্দিষ্ট করে যা নির্দেশ করে যে পাঠ্য এলাকায় কতগুলি লাইন প্রদর্শিত হবে।</td> </tr><tr><td>মোড়ানো</td> <td>ফর্ম জমা দেওয়ার সময় টেক্সট লাইন বিরতি সংরক্ষণ করা উচিত কিনা তা নির্ধারণ করে। কঠিন মান মোড়ক সংরক্ষণ করে, কিন্তু নরম মান তা করে না। হার্ড ব্যবহার করা হলে, cols অ্যাট্রিবিউটের মান অবশ্যই উল্লেখ করতে হবে।</td> </tr></table><h3>5. ড্রপডাউন তালিকা</h3> <p>তালিকাগুলি কম্প্যাক্টভাবে বিপুল সংখ্যক আইটেম সাজানো সম্ভব করে তোলে। ড্রপডাউন তালিকা উপাদান ব্যবহার করে তৈরি করা হয় <select>...</select>. তারা আপনাকে প্রস্তাবিত সেট থেকে এক বা একাধিক মান নির্বাচন করার অনুমতি দেয়। ডিফল্টরূপে, একটি তালিকা বাক্স তার প্রথম উপাদান প্রদর্শন করে।</p> <p>তালিকায় আইটেম যোগ করতে উপাদান ব্যবহার করা হয় <option>...</option>, যা ভিতরে অবস্থিত <select> .</p> <p>তালিকাগুলিকে পদ্ধতিগত করতে, উপাদানটি ব্যবহার করুন <optgroup>...</optgroup>, যা তালিকায় শিরোনাম তৈরি করে।</p> <p>তালিকার জন্য, আপনি ফন্টের আকার, ফন্টের ধরন, রঙ এবং অন্যান্য পাঠ্য বৈশিষ্ট্য পরিবর্তন করতে পারেন, সেইসাথে সীমানা, পটভূমির রঙ এবং পটভূমি চিত্র যোগ করতে পারেন।</p> <table class="t3">সারণি 5. ট্যাগ বৈশিষ্ট্য <select> <tr><th>বৈশিষ্ট্য</th> <th>অর্থ/বর্ণনা</th> </tr><tr><td>অটোফোকাস</td> <td>পৃষ্ঠা লোড হলে একটি উপাদানের উপর স্বয়ংক্রিয় ফোকাস সেট করে।</td> </tr><tr><td>অক্ষম</td> <td>ড্রপডাউন তালিকা নিষ্ক্রিয় করে।</td> </tr><tr><td>ফর্ম</td> <td>এই তালিকাটি যে ফর্মের সাথে সম্পর্কিত তা নির্ধারণ করে। বৈশিষ্ট্য মান হল ফর্ম শনাক্তকারী।</td> </tr><tr><td>একাধিক</td> <td>এটি করার জন্য আপনাকে এক বা একাধিক আইটেম নির্বাচন করার অনুমতি দেয়, নির্বাচন করার সময়, আপনাকে Ctrl কী টিপুন এবং ধরে রাখতে হবে।</td> </tr><tr><td>নাম</td> <td>ড্রপডাউন তালিকার জন্য একটি নাম সংজ্ঞায়িত করে। বৈশিষ্ট্যের মানটিতে একটি নাম রয়েছে যা তালিকার বিষয়কে প্রতিফলিত করে।</td> </tr><tr><td>প্রয়োজনীয়</td> <td>একটি বার্তা প্রদর্শন করে যা নির্দেশ করে যে ব্যবহারকারীকে ফর্ম জমা দেওয়ার আগে ড্রপ-ডাউন তালিকা থেকে একটি মান নির্বাচন করতে হবে।</td> </tr><tr><td>আকার</td> <td>একই সময়ে পর্দায় দৃশ্যমান তালিকা আইটেমের সংখ্যা সেট করে। যদি তালিকা আইটেম সংখ্যা নির্দিষ্ট সংখ্যা অতিক্রম করে, একটি স্ক্রল বার প্রদর্শিত হবে. বৈশিষ্ট্য মান একটি ধনাত্মক পূর্ণসংখ্যা হিসাবে নির্দিষ্ট করা হয়.</td> </tr></table><h3>6. ফর্ম ক্ষেত্রগুলির জন্য লেবেল৷</h3> <p>ফর্ম উপাদানগুলির জন্য লেবেলগুলি উপাদান ব্যবহার করে তৈরি করা হয় <label>...</label>. গ্রুপ লেবেল এবং ক্ষেত্র দুটি উপায় আছে. যদি ক্ষেত্রটি একটি উপাদানের ভিতরে থাকে <label>, তাহলে এর জন্য বৈশিষ্ট্য নির্দিষ্ট করার প্রয়োজন নেই।</p><p> <!-- с указанием атрибута for --> <label for="comments">শেষবার আপনি কখন একটি বিমানে উড়েছিলেন?</label> <textarea id="comments">

বিড়াল

7. বোতাম

উপাদান ...ক্লিকযোগ্য বোতাম তৈরি করে। অসদৃশ বোতাম তৈরি ( , , , ), উপাদানের ভিতরে আপনি বিষয়বস্তু রাখতে পারেন - পাঠ্য বা চিত্র।

সঠিকভাবে উপাদান প্রদর্শন

বিভিন্ন ব্রাউজারকে টাইপ অ্যাট্রিবিউট নির্দিষ্ট করতে হবে, উদাহরণস্বরূপ, .

বোতামগুলি ব্যবহারকারীদের একটি ফর্মে ডেটা জমা দিতে, ফর্মের বিষয়বস্তু পরিষ্কার করতে বা অন্য কিছু পদক্ষেপ নিতে দেয়। আপনি সীমানা তৈরি করতে পারেন, পটভূমি পরিবর্তন করতে পারেন এবং একটি বোতামে পাঠ্য সারিবদ্ধ করতে পারেন।

সারণি 9. ট্যাগ বৈশিষ্ট্য

বৈশিষ্ট্য	অর্থ/বর্ণনা
অটোফোকাস	পৃষ্ঠা লোড হলে বোতামে ফোকাস সেট করে।
অক্ষম	বোতামটি নিষ্ক্রিয় করে, এটিকে ক্লিক করা যায় না।
ফর্ম	এই বোতামটি যে এক বা একাধিক ফর্মের সাথে সম্পর্কিত তা নির্দেশ করে৷ অ্যাট্রিবিউট মান হল সংশ্লিষ্ট ফর্মের শনাক্তকারী।
গঠন	বৈশিষ্ট্যের মানটিতে বোতামটি ক্লিক করার সময় পাঠানো ফর্ম ডেটা হ্যান্ডলারের URL থাকে৷ শুধুমাত্র বোতাম প্রকারের জন্য টাইপ="জমা দিন"। এলিমেন্টের জন্য নির্দিষ্ট করা অ্যাকশন অ্যাট্রিবিউটের মান ওভাররাইড করে .
গঠন প্রকার	যখন type="submit"-এর মতো বোতামগুলি ক্লিক করা হয় তখন সার্ভারে পাঠানোর আগে ফর্ম ডেটার এনকোডিং প্রকার সেট করে। এলিমেন্টের জন্য নির্দিষ্ট করা এনটাইপ অ্যাট্রিবিউটের মান ওভাররাইড করে . সম্ভাব্য মান: application/x-www-form-urlencoded হল ডিফল্ট মান। পাঠানোর আগে সমস্ত অক্ষর এনকোড করা হবে। মাল্টিপার্ট/ফর্ম-ডেটা - অক্ষর এনকোড করা হয় না। একটি ফর্ম ব্যবহার করে ফাইল আপলোড করার সময় ব্যবহৃত হয়। টেক্সট/প্লেইন - অক্ষরগুলি এনকোড করা হয় না এবং স্পেসগুলি + চিহ্ন দিয়ে প্রতিস্থাপিত হয়।
ফর্ম পদ্ধতি	বৈশিষ্ট্যটি নির্দিষ্ট করে যে পদ্ধতিটি ব্রাউজার ফর্মটি জমা দেওয়ার জন্য ব্যবহার করবে। উপাদানের জন্য নির্দিষ্ট পদ্ধতি বৈশিষ্ট্যের মান ওভাররাইড করে . শুধুমাত্র টাইপ="জমা দিন" টাইপের বোতামের জন্য নির্দিষ্ট করা হয়েছে। সম্ভাব্য মান: get - ফর্ম থেকে ডেটা (নাম/মান জোড়া) url এ যোগ করা হয় এবং সার্ভারে পাঠানো হয়। এই পদ্ধতিতে পাঠানো ডেটার আকারের সীমাবদ্ধতা রয়েছে এবং এটি পাসওয়ার্ড এবং গোপনীয় তথ্য পাঠানোর জন্য উপযুক্ত নয়। পোস্ট - ফর্ম থেকে ডেটা একটি http অনুরোধ হিসাবে যোগ করা হয়। পদ্ধতিটি পাওয়ার চেয়ে আরও নির্ভরযোগ্য এবং নিরাপদ এবং এতে কোন আকারের সীমাবদ্ধতা নেই।
ফর্মনোলিডেট	বৈশিষ্ট্যটি নির্দিষ্ট করে যে ফর্ম ডেটা জমা দেওয়ার পরে যাচাই করা উচিত নয়। শুধুমাত্র টাইপ="জমা দিন" টাইপের বোতামের জন্য নির্দিষ্ট করা হয়েছে।
ফরমটার্গেট	ফর্ম জমা দেওয়ার পরে কোন উইন্ডোতে ফলাফল প্রদর্শন করতে হবে তা বৈশিষ্ট্যটি নির্দিষ্ট করে। শুধুমাত্র টাইপ="জমা দিন" টাইপের বোতামের জন্য নির্দিষ্ট করা হয়েছে। এলিমেন্টের জন্য নির্দিষ্ট করা টার্গেট অ্যাট্রিবিউটের মান ওভাররাইড করে . _blank - একটি নতুন উইন্ডো/ট্যাবে প্রতিক্রিয়া লোড করে _self - একই উইন্ডোতে প্রতিক্রিয়া লোড করে (ডিফল্ট) _parent - অভিভাবক ফ্রেমে প্রতিক্রিয়া লোড করে _top - পূর্ণ পর্দায় প্রতিক্রিয়া লোড করে framename - নির্দিষ্ট নামের সাথে একটি ফ্রেমে প্রতিক্রিয়া লোড করে।
নাম	বোতামের নাম সেট করে, বৈশিষ্ট্যের মানটি পাঠ্য। ফর্ম জমা দেওয়ার পরে ফর্ম ডেটা লিঙ্ক করতে বা জাভাস্ক্রিপ্টে একটি প্রদত্ত বোতাম(গুলি) লিঙ্ক করতে ব্যবহৃত হয়।
টাইপ	বোতামের ধরন সংজ্ঞায়িত করে। সম্ভাব্য মান: বোতাম - ক্লিকযোগ্য বোতাম রিসেট — রিসেট বোতাম, আসল মান প্রদান করে জমা - ফর্ম ডেটা জমা দেওয়ার জন্য বোতাম।
মান	বোতামটি ক্লিক করা হলে পাঠানো ডিফল্ট মান সেট করে।

8. আকারে চেকবক্স এবং রেডিও বোতাম

ফর্মের চেকবক্সগুলি গঠন ব্যবহার করে সেট করা হয় , এবং সুইচ - ব্যবহার করে .

চেকবক্স, রেডিও বোতামের বিপরীতে, একটি ফর্মে একাধিক চেকবক্স থাকতে পারে। যদি চেক করা বৈশিষ্ট্যটি চেকবক্সগুলির জন্য নির্দিষ্ট করা হয়, তাহলে পৃষ্ঠাটি লোড হলে, সংশ্লিষ্ট ফর্ম ক্ষেত্রের চেকবক্সগুলি ইতিমধ্যেই নির্বাচন করা হবে৷

উপাদান রেডিও বোতাম এবং চেকবক্স ব্যবহার করে নির্বাচন বাস্তবায়নের সময় ব্যবহৃত হয়। আপনি কেবল এটির সাথে যুক্ত পাঠ্যটিতে ক্লিক করে আপনার পছন্দসই আইটেমটি নির্বাচন করতে পারেন। এটি করার জন্য আপনাকে স্থাপন করতে হবে উপাদানের ভিতরে .

...ফর্ম বিষয়বস্তু...

শুধু ফর্ম উপাদানের ভিতরে নিয়ন্ত্রণ থাকা উচিত, যার মধ্যে যতগুলি ইচ্ছা ততগুলি থাকতে পারে৷

ফর্ম বৈশিষ্ট্য:

• অ্যাকশন অ্যাট্রিবিউট ফর্ম থেকে পাঠানো ডেটার প্রধান প্রক্রিয়াকরণের জন্য দায়ী একটি স্ক্রিপ্ট সহ একটি সার্ভার ফাইল নির্দিষ্ট করে। সাধারণত, এই ফাইলের কোড একটি সার্ভার-সাইড প্রোগ্রামিং ভাষায় লেখা হয়, উদাহরণস্বরূপ, in phpবা পার্ল.
• এনকটাইপ অ্যাট্রিবিউট সার্ভারে প্রেরিত তথ্যের ধরন নির্দেশ করে, যদি এটি শুধুমাত্র টেক্সট ডেটা হয় - টেক্সট/প্লেন, যদি ফাইলগুলি ফর্মের সাথে পাঠানো হয়, তাহলে মাল্টিপার্ট/ফর্ম-ডেটা নির্দিষ্ট করা উচিত।
• মেথড অ্যাট্রিবিউট ডেটা ট্রান্সফারের ফর্ম নির্দিষ্ট করে এবং সংজ্ঞায়িত করে। আমরা এই বিষয়ে বিস্তারিতভাবে আলোচনা করব না, তবে এটি বলা উচিত যে আরও নির্ভরযোগ্য সংক্রমণের জন্য, পোস্ট পদ্ধতিটি নির্দিষ্ট করা উচিত।

এইচটিএমএল ফর্ম উপাদান

<ইনপুট প্রকার = "টেক্সট" নাম = "লগইন" আকার = "২০" মান = "লগইন" maxlength = "25" > !}

ফলাফল:

• টাইপ অ্যাট্রিবিউটের মান - পাঠ্য - নির্দেশ করে যে এটি একটি পাঠ্য ক্ষেত্র
• আকার - অক্ষরগুলিতে পাঠ্য ক্ষেত্রের আকার
• maxlength — ক্ষেত্রে ফিট হতে পারে যে অক্ষর সর্বোচ্চ সংখ্যা
• মান - পাঠ্য ক্ষেত্রের প্রাথমিক পাঠ্য
• নাম — উপাদানের নাম, হ্যান্ডলার ফাইলে ডেটা প্রক্রিয়াকরণের জন্য প্রয়োজনীয়

ফলাফল:


পাঠ্যের পরিবর্তে, ক্ষেত্রে একটি মাস্ক প্রদর্শিত হয় - তারা বা বৃত্ত

<ইনপুট প্রকার = "জমা দিন" মান = "তথ্য পাঠান">

ফলাফল:

জমা বোতামটি ব্যবহারকারীর দ্বারা প্রবেশ করা সমস্ত ফর্ম ডেটা সংগ্রহ করে এবং ফর্মের অ্যাকশন অ্যাট্রিবিউটে নির্দিষ্ট ঠিকানায় পাঠায়।

<ইনপুট প্রকার = "রিসেট" মান = "(! LANG: সাফ ফর্ম" > !}

ফলাফল:

বোতামটি সমস্ত নিয়ন্ত্রণের অবস্থাকে তাদের আসল অবস্থায় ফিরিয়ে দেয় (ফর্মটি সাফ করে)

<ইনপুট প্রকার = "চেকবক্স" নাম = "এএসপি" মান = "হ্যাঁ" > !} A.S.P.<br> <ইনপুট প্রকার = "চেকবক্স" নাম = "js" মান = "হ্যাঁ" checked = "checked" > !}জাভাস্ক্রিপ্ট<br> <ইনপুট প্রকার = "চেকবক্স" নাম = "php" মান = "yes" > !}পিএইচপি<br> <ইনপুট প্রকার = "চেকবক্স" নাম = "html" মান = "হ্যাঁ" checked = "checked" > !}এইচটিএমএল<br>

A.S.P.
জাভাস্ক্রিপ্ট
পিএইচপি
এইচটিএমএল



ফলাফল:

A.S.P.
জাভাস্ক্রিপ্ট
পিএইচপি
এইচটিএমএল

html এ, একাধিক নির্বাচন সংগঠিত করতে একটি চেকবক্স ব্যবহার করা হয়, যেমন যখন এটি প্রয়োজনীয় এবং বিভিন্ন উত্তর বিকল্প নির্বাচন করা সম্ভব

<ইনপুট প্রকার = "রেডিও" নাম = "বই" মান = "asp" > !} A.S.P.<br> <ইনপুট প্রকার = "রেডিও" নাম = "বই" মান = "js" > !}জাভাস্ক্রিপ্ট<br> <ইনপুট প্রকার = "রেডিও" নাম = "বই" মান = "php" > !}পিএইচপি<br> <ইনপুট প্রকার = "রেডিও" নাম = "বই" মান = "html" checked = "checked" > !}এইচটিএমএল<br>

A.S.P.
জাভাস্ক্রিপ্ট
পিএইচপি
এইচটিএমএল




ফলাফল:

A.S.P.
জাভাস্ক্রিপ্ট
পিএইচপি
এইচটিএমএল

রেডিও বোতাম html বিভিন্ন বিকল্প থেকে একক পছন্দের জন্য পরিবেশন করে

চেক করা অ্যাট্রিবিউট অবিলম্বে উপাদানটিকে চেক করা হিসাবে সেট করে

গুরুত্বপূর্ণ:উপাদান জন্য রেডিওএটা প্রয়োজনীয় যে বৈশিষ্ট্য মান নামগ্রুপের সমস্ত উপাদান একই ছিল: এই ক্ষেত্রে, উপাদানগুলি আন্তঃসংযুক্ত কাজ করবে, যখন একটি উপাদান চালু করা হবে, অন্যগুলি বন্ধ হয়ে যাবে

HTML ড্রপডাউন তালিকা

আসুন একটি ড্রপ-ডাউন তালিকা যোগ করার একটি উদাহরণ দেখি:

1 2 3 4 5 6

<নাম = "বই" সাইজ = "1" > নির্বাচন করুন <বিকল্প মান = "asp" > !} A.S.P.</বিকল্প> <বিকল্প মান = "js" > !}জাভাস্ক্রিপ্ট</বিকল্প> <বিকল্প মান = "php" > !}পিএইচপি</বিকল্প> <বিকল্প মান = "html" selected = "selected" > !}এইচটিএমএল</বিকল্প> </নির্বাচন>

A.S.P. জাভাস্ক্রিপ্ট পিএইচপি এইচটিএমএল

ফলাফল:

• ড্রপ-ডাউন তালিকায় একটি প্রধান ট্যাগ রয়েছে - নির্বাচন করুন - যার একটি ক্লোজিং পেয়ার রয়েছে এবং প্রতিটি তালিকা আইটেম একটি বিকল্প ট্যাগ, যার ভিতরে আইটেমের পাঠ্য প্রদর্শিত হয়
• মান সহ আকার বৈশিষ্ট্য "1"ইঙ্গিত দেয় যে ভেঙে পড়া তালিকাটি একটি আইটেম প্রদর্শন করে, বাকিগুলি মেনু তীরটিতে ক্লিক করে খোলা হয়
• একটি আইটেমের নির্বাচিত বৈশিষ্ট্য (বিকল্প) নির্দেশ করে যে এই নির্দিষ্ট আইটেমটি প্রাথমিকভাবে দৃশ্যমান হবে, এবং অবশিষ্ট আইটেমগুলি "সংহত"

বড় এবং জটিল তালিকার জন্য একটি বিকল্প আছে উপশিরোনাম যোগ করুন— লেবেল বৈশিষ্ট্য সহ অপ্টগ্রুপ ট্যাগ:

1 2 3 4 5 6 7 8 9 10 11 12

<নাম = "বই" সাইজ = "1" > নির্বাচন করুন <optgroup লেবেল = "ইংরেজি" > <বিকল্প মান = "asp" > !} A.S.P.</বিকল্প> <বিকল্প মান = "js" > !}জাভাস্ক্রিপ্ট</বিকল্প> <বিকল্প মান = "php" > !}পিএইচপি</বিকল্প> <বিকল্প মান = "html" selected = "selected" > !}এইচটিএমএল</বিকল্প> </optgroup> <optgroup লেবেল = "রাশিয়ান" > <বিকল্প মান = "asp_rus" > !}রাশিয়ান ভাষায় ASP</বিকল্প> <বিকল্প মান = "js_rus" > !}রাশিয়ান ভাষায় জাভাস্ক্রিপ্ট</বিকল্প> </optgroup> </নির্বাচন>

A.S.P. জাভাস্ক্রিপ্ট পিএইচপি এইচটিএমএল রাশিয়ান ভাষায় ASP রাশিয়ান ভাষায় জাভাস্ক্রিপ্ট

সুযোগ দেওয়ার জন্য একসাথে বেশ কয়েকটি আইটেম নির্বাচন করাআপনাকে একাধিক বৈশিষ্ট্য যোগ করতে হবে। কিন্তু এই ক্ষেত্রে, সাইজ অ্যাট্রিবিউটটিও 1-এর চেয়ে বেশি একটি মান সেট করা উচিত:

পাঠ্য

ফলাফল:

• উপাদানটির প্রস্থ কলস বৈশিষ্ট্যের উপর নির্ভর করে, যা অনুভূমিকভাবে কতগুলি অক্ষর ফিট হবে তা নির্দিষ্ট করে
• সারি বৈশিষ্ট্য একটি উপাদানের সারির সংখ্যা নির্দিষ্ট করে

অন্যান্য উপাদান

অতিরিক্ত উপাদান এবং বৈশিষ্ট্য

• নিয়ন্ত্রণের জন্য রেডিওএবং চেকবক্সঅতিরিক্ত উপাদানগুলি ব্যবহার করা সুবিধাজনক যা, প্রথমত, পাঠ্যটিকে রেডিও বা চেকবক্স উপাদানের সাথে আবদ্ধ করে এবং দ্বিতীয়ত, ক্লিক করার সময় একটি স্ট্রোক যুক্ত করুন:

<ইনপুট প্রকার = "চেকবক্স" আইডি = "বুক1" > <= "book1" > এর জন্য লেবেল A.S.P.</লেবেল>

A.S.P.

উদাহরণে, চেকবক্স উপাদানের জন্য একটি শিলালিপি (লেবেল ট্যাগ) তৈরি করা হয়েছে। বাইন্ডিং আইডি অ্যাট্রিবিউটের মাধ্যমে বাহিত হয়, যার মান লেবেলের জন্য বৈশিষ্ট্যে নির্দিষ্ট করা হয়।

ফলাফল:



• অক্ষম বৈশিষ্ট্য আপনাকে একটি উপাদান লক করতে দেয়, এটি ব্যবহারকারীর দ্বারা অপরিবর্তনীয় করে তোলে:

<ইনপুট প্রকার = "টেক্সট" নাম = "লগইন" আকার = "২০" মান = "লগইন" maxlength = "25" disabled = "disabled" >!} <ইনপুট প্রকার = "চেকবক্স" নাম = "এএসপি" মান = "হ্যাঁ" > !} A.S.P.<br> <ইনপুট প্রকার = "চেকবক্স" নাম = "js" মান = "হ্যাঁ" checked = "checked" disabled = "disabled" > !}জাভাস্ক্রিপ্ট<br>


A.S.P.
জাভাস্ক্রিপ্ট

বর্ণনা

ট্যাগ

একটি ওয়েব পৃষ্ঠায় একটি ফর্ম ইনস্টল করে। ফর্মটি ব্যবহারকারী এবং সার্ভারের মধ্যে ডেটা বিনিময়ের উদ্দেশ্যে করা হয়েছে৷ ফর্মের প্রয়োগের সুযোগ ক্লায়েন্ট স্ক্রিপ্ট ব্যবহার করে সার্ভারে ডেটা পাঠানোর মধ্যেই সীমাবদ্ধ নয়, আপনি ফর্মের যেকোনো উপাদান অ্যাক্সেস করতে পারেন, এটি পরিবর্তন করতে পারেন এবং আপনার বিবেচনার ভিত্তিতে এটি প্রয়োগ করতে পারেন।

একটি নথিতে যেকোন সংখ্যক ফর্ম থাকতে পারে, কিন্তু একটি সময়ে সার্ভারে শুধুমাত্র একটি ফর্ম জমা দেওয়া যেতে পারে। এই কারণে, ফর্ম ডেটা একে অপরের থেকে স্বাধীন হতে হবে।

সার্ভারে ফর্মটি জমা দিতে, জমা দিন বোতামটি ব্যবহার করুন, ফর্মের মধ্যে এন্টার কী টিপে এটি অর্জন করা যেতে পারে। জমা বোতামটি ফর্মে উপস্থিত না থাকলে, এন্টার কী এটির ব্যবহার অনুকরণ করে।

যখন ফর্মটি সার্ভারে জমা দেওয়া হয়, তখন ডেটার নিয়ন্ত্রণ ট্যাগের অ্যাকশন অ্যাট্রিবিউট দ্বারা নির্দিষ্ট প্রোগ্রামে স্থানান্তরিত হয় . ব্রাউজার প্রথমে একটি "নাম = মান" জোড়া আকারে তথ্য প্রস্তুত করে, যেখানে ট্যাগের নাম বৈশিষ্ট্য দ্বারা নাম নির্ধারণ করা হয় , এবং মানটি ব্যবহারকারী দ্বারা প্রবেশ করানো হয় বা ডিফল্ট ফর্ম ক্ষেত্রে সেট করা হয়। যদি ডেটা পাঠাতে GET পদ্ধতি ব্যবহার করা হয়, তাহলে ঠিকানা বার নিম্নলিখিত ফর্মটি নিতে পারে।

http://www..cgi?nick=%C2%E0%ED%FF+%D8%E0%EF%EE%F7%EA%E8%ED&page=5

পরামিতিগুলি CGI প্রোগ্রাম ঠিকানার পরে নির্দিষ্ট করা প্রশ্ন চিহ্নের পরে তালিকাভুক্ত করা হয় এবং একটি অ্যাম্পারস্যান্ড অক্ষর (&) দ্বারা পৃথক করা হয়। নন-ল্যাটিন অক্ষরগুলি হেক্সাডেসিমেল উপস্থাপনায় রূপান্তরিত হয় (% HH আকারে, যেখানে HH হল ASCII অক্ষর মানের জন্য হেক্সাডেসিমেল কোড), এবং স্থানটি একটি প্লাস (+) দ্বারা প্রতিস্থাপিত হয়।

পাত্রের ভিতরে অনুমোদিত অন্যান্য ট্যাগ রাখুন, কিন্তু ফর্মটি নিজেই ওয়েব পৃষ্ঠায় কোনওভাবেই প্রদর্শিত হয় না, শুধুমাত্র এর উপাদানগুলি এবং নেস্টেড ট্যাগের ফলাফলগুলি দৃশ্যমান হয়৷

বাক্য গঠন

...

গুণাবলী

এনকোডিং সেট করে যেখানে সার্ভার ডেটা গ্রহণ এবং প্রক্রিয়া করতে পারে। প্রোগ্রাম বা নথির ঠিকানা যা ফর্ম ডেটা প্রক্রিয়া করে। ফর্ম ক্ষেত্রগুলির স্বয়ংক্রিয়ভাবে পূরণ করতে সক্ষম করে৷ ফর্ম ডেটা এনকোড করার পদ্ধতি। HTTP প্রোটোকল পদ্ধতি। ফর্মের নাম। ইনপুট সঠিকতার জন্য ফর্ম ডেটার অন্তর্নির্মিত চেক ওভাররাইড করে। উইন্ডো বা ফ্রেমের নাম যেখানে হ্যান্ডলার ফেরত ফলাফল লোড করবে।

ক্লোজিং ট্যাগ

প্রয়োজন।

HTML5 IE Cr Op Sa Fx

আপনি কিভাবে মনে করেন সংক্ষিপ্ত রূপ "OS" এর জন্য দাঁড়িয়েছে?

অফিসাররা
অপারেটিং সিস্টেম
মহান ডোরাকাটা মাছি

এই উদাহরণের ফলাফল চিত্রে দেখানো হয়েছে। 1.

ভাত। 1. একটি ব্রাউজার উইন্ডোতে ফর্ম উপাদানগুলির দৃশ্য৷

HTML-এ ফর্মগুলি সবচেয়ে জটিল, কিন্তু অন্যদিকে, সম্ভবত HTML-এর সবচেয়ে আকর্ষণীয় বিষয়।

ওয়েব ফর্মগুলি সাইটের দর্শকদের বিশেষ ক্ষেত্রে নির্দিষ্ট তথ্য প্রবেশ করার অনুমতি দেয় এবং বিকাশকারী তার জন্য সুবিধাজনক ফর্মে এটি গ্রহণ করে।

একটি ফর্মের উদাহরণ একটি অতিথি বই, একটি প্রশ্নাবলী, বা একটি অনলাইন পরীক্ষা হতে পারে। ওয়েবসাইটে নিবন্ধন করার সময়, অনলাইন স্টোরে অর্ডার দেওয়ার সময়, ইত্যাদির সময় ফর্মগুলি পূরণ করা হয়।

HTML ব্যবহার করে, আপনি একটি ফর্ম ফ্রেমওয়ার্ক তৈরি করতে পারেন: পাঠ্য ক্ষেত্র, মেনু, তালিকা, বোতাম, চেকবক্স এবং রেডিও বোতাম। অর্থাৎ সেই উপাদানগুলির সাহায্যে নির্দিষ্ট তথ্য ফর্মে প্রবেশ করানো হয়।

তারপর ফর্মে প্রবেশ করা ডেটা প্রক্রিয়াকরণের জন্য সার্ভারে পাঠানো হয়। কিন্তু এইচটিএমএল এখানে শক্তিহীন - এটির সাথে সংযুক্ত একটি প্রোগ্রাম বা স্ক্রিপ্ট ইতিমধ্যে ফর্ম প্রক্রিয়াকরণের কাজ করছে৷ এই জাতীয় প্রোগ্রামগুলি সাধারণত পিএইচপি বা জাভাস্ক্রিপ্টে লেখা হয়।

ফর্ম বৈশিষ্ট্য - ট্যাগ

একটি ওয়েব পৃষ্ঠায় বিভিন্ন ফর্ম থাকতে পারে ( যতটা ডেভেলপারের প্রয়োজন) তাদের প্রত্যেকটি ট্যাগ দিয়ে শুরু হয় এবং একটি ক্লোজিং ট্যাগ দিয়ে শেষ হয় .

যে কোনো ফর্মের জন্য অ্যাকশন অ্যাট্রিবিউট বাধ্যতামূলক - এটি ফর্মটি পরিবেশনকারী ফাইলের ঠিকানা উল্লেখ করে ( এতে প্রবেশ করা ডেটা প্রক্রিয়া করে).

পদ্ধতির বৈশিষ্ট্যটি কীভাবে ফর্ম সামগ্রী জমা হবে তা নির্দিষ্ট করে। দুটি পদ্ধতি আছে - GET এবং POST। এখন এই পরামিতিগুলি অনুসন্ধান করার কোনও অর্থ নেই, যেহেতু GET এবং POST পদ্ধতি ব্যবহার করে তথ্য প্রেরণের বিষয়টি ডেটা প্রক্রিয়াকরণ ভাষার সাথে সম্পর্কিত ( যেমন পিএইচপি) এটি জানা যথেষ্ট যে এটি পোস্ট ডেটা স্থানান্তর পদ্ধতি যা বেশিরভাগ ক্ষেত্রে ফর্মগুলিতে ব্যবহৃত হয়।

ট্যাগ নামের বৈশিষ্ট্য

ঐচ্ছিক। কিন্তু যদি নথিতে বেশ কয়েকটি ফর্ম থাকে, তবে তাদের প্রত্যেককে হ্যান্ডলার দ্বারা কোনো না কোনোভাবে চিহ্নিত করতে হবে। অতএব, এই ক্ষেত্রে নামের বৈশিষ্ট্যের উপস্থিতি প্রয়োজনীয় - এটি ফর্মটির অনন্য নাম নির্দিষ্ট করে।

আপনি ইনপুট ডেটার জন্য এনকোডিংও সেট করতে পারেন - গ্রহণ-অক্ষর বৈশিষ্ট্য এটির জন্য দায়ী, এবং এছাড়াও, লক্ষ্য বৈশিষ্ট্য ব্যবহার করে, জমা দেওয়া ফর্মটি প্রক্রিয়াকরণের ফলাফল প্রদর্শিত হবে এমন উইন্ডোটি সংজ্ঞায়িত করুন ( একটি নতুন বা বর্তমান উইন্ডোতে).

কিন্তু ট্যাগ নিজেই কোন অর্থ নেই, কারণ ফর্মটি ডেটা প্রেরণ করে যা প্রথমে কোথাও প্রবেশ করতে হবে!

ডাটা প্রবেশ। ফর্ম ক্ষেত্র - ট্যাগ

ট্যাগ এটি ফর্মগুলিতে পাওয়া সবচেয়ে সাধারণ ট্যাগ। এটি বিভিন্ন উপাদান তৈরি করার জন্য ডিজাইন করা হয়েছে যা একটি ফর্মের মধ্যে ডেটা প্রবেশ করতে পরিবেশন করে: পাঠ্য ক্ষেত্র, বোতাম, চেকবক্স, রেডিও বোতাম।

type হল ট্যাগের প্রধান বৈশিষ্ট্য . এটি ক্ষেত্রের ধরন সেট করে ( উপাদান) ফর্ম:

অ্যাট্রিবিউট মান টাইপ="..."	ফলাফল	বর্ণনা
		পাঠ্য প্রবেশের জন্য একক লাইন পাঠ্য ক্ষেত্র। আকার বৈশিষ্ট্য অক্ষরের ক্ষেত্রে ক্ষেত্রের প্রস্থ নির্দিষ্ট করে।
		একটি পাসওয়ার্ড প্রবেশের জন্য পাঠ্য ক্ষেত্র। সর্বাধিক দৈর্ঘ্যের বৈশিষ্ট্যটি প্রবেশ করা যেতে পারে এমন সর্বাধিক সংখ্যক অক্ষর সেট করে
		সুইচ আপনি অফার করা থেকে শুধুমাত্র একটি বিকল্প নির্বাচন করতে পারেন. চেক করা বৈশিষ্ট্য একটি পূর্ব-চেক করা ক্ষেত্র নির্দিষ্ট করে।
		চেকবক্স। বেছে নেওয়ার জন্য বেশ কয়েকটি বিকল্প রয়েছে।বৈশিষ্ট্য checked একটি পূর্ব-চেক করা ক্ষেত্র সংজ্ঞায়িত করে।
		বোতাম। মান বৈশিষ্ট্য বোতামে লেবেল সেট করে।
		রিসেট বোতাম। ফর্ম ক্ষেত্রগুলিকে তাদের আসল ফর্মে ফিরিয়ে দেয়। প্রবেশ করা ডেটা রিসেট করুন।
		প্রবেশ করা ডেটা পাঠানোর জন্য বোতাম।
		পাঠানো ফাইলের নাম লেখার জন্য ক্ষেত্র।
		ছবি বোতাম। এটি সার্ভারে ডেটা পাঠাতেও ব্যবহৃত হয়। src অ্যাট্রিবিউট ইমেজ ফাইলের ঠিকানা নির্দিষ্ট করে।
		লুকানো ক্ষেত্র - ব্যবহারকারীর কাছে অদৃশ্য।

ড্রপডাউন - ট্যাগ এবং

ট্যাগ

ট্যাগের মত একই তথ্য সংগ্রহ করতে কাজ করে - এটি একটি তালিকা তৈরি করে যা থেকে এক বা একাধিক উপাদান নির্বাচন করা যেতে পারে। প্রতিটি উপাদান একটি মানের সাথে মিলে যায়, যা প্রক্রিয়াকরণের জন্য সার্ভারে পাঠানো হয়।

তৈরি করা তালিকার ধরনটি আকারের বৈশিষ্ট্যের মানের উপর নির্ভর করে: size= "1" ( ডিফল্ট মান) তালিকাটি ড্রপ-ডাউন হবে।

সাইজ অ্যাট্রিবিউটের জন্য একটি ভিন্ন মান প্রদর্শিত তালিকা আইটেমের সংখ্যার সাথে সঙ্গতিপূর্ণ হবে। উদাহরণস্বরূপ, size="3" সহ, তিনটি উপাদান দৃশ্যমান হবে। অন্যান্য তালিকা আইটেম দেখতে ( যদি সেখানে আরো থাকে) আপনার উল্লম্ব স্ক্রোল বার ব্যবহার করা উচিত, যা স্বয়ংক্রিয়ভাবে যোগ করা হয়।

ডিফল্টরূপে, শুধুমাত্র একটি তালিকা আইটেম নির্বাচন করা যেতে পারে. একটি ট্যাগে একাধিক অ্যাট্রিবিউট যোগ করা আপনাকে মাউস এবং Ctrl এবং Shift কী ব্যবহার করে একাধিক তালিকা আইটেম নির্বাচন করতে দেয়।

যদি একাধিক অ্যাট্রিবিউট উপস্থিত থাকে, তবে তালিকা আইটেমগুলির সমস্ত বা অংশ প্রদর্শিত হবে ( ব্রাউজারের উপর নির্ভর করে), যদি না আকারের বৈশিষ্ট্যটি দৃশ্যমান আইটেমের একটি নির্দিষ্ট সংখ্যক সেট করা থাকে।

ড্রপ-ডাউন তালিকার প্রয়োজনীয় উপাদান হল ট্যাগ

. এটি ট্যাগের ভিতরে অবস্থিত এবং প্রতিটি তালিকা আইটেম তৈরি করে।

ট্যাগের নাম বৈশিষ্ট্য ব্যবহার করে তালিকাটিকে একটি নাম দেওয়া হয় এবং ট্যাগের মান বৈশিষ্ট্য ব্যবহার করে তালিকা উপাদান একটি মান বরাদ্দ করা হয়. এইভাবে, একটি "নাম = মান" জোড়া সার্ভারে পাঠানো হয় - তালিকার নাম এবং নির্বাচিত উপাদান/সেগুলির মান।

একটি ট্যাগের নির্বাচিত বৈশিষ্ট্য

পূর্বে নির্বাচিত একটি তালিকা আইটেম সংজ্ঞায়িত করে, এবং নিষ্ক্রিয় বৈশিষ্ট্য তালিকা আইটেমটিকে ব্লক করে - এটি নির্বাচন করা যাবে না।

মূল দিক চারটি প্রধান দিকগুলির মধ্যে একটি:

উত্তর
দক্ষিণ
পশ্চিম
পূর্ব

বিশ্বের ৭টি বিস্ময়!

চিওপসের পিরামিড
ব্যাবিলনের ঝুলন্ত উদ্যান
অলিম্পিয়ায় জিউসের মূর্তি
ইফিসাসে আর্টেমিসের মন্দির
হ্যালিকারনাসাসে সমাধি
রোডসের কলোসাস
আলেকজান্দ্রিয়ান বাতিঘর

মাল্টিলাইন টেক্সট ফিল্ড - ট্যাগ </h3> <p>ট্যাগ <textarea>একটি মাল্টিলাইন পাঠ্য ক্ষেত্র তৈরি করে। এতে লাইন ব্রেক করা অনুমোদিত, যা হ্যান্ডলারে ডেটা প্রেরণ করার সময় সংরক্ষণ করা হয়।</p> <p>ট্যাগ নামের বৈশিষ্ট্য <textarea>বাধ্যতামূলক - এটি ব্যবহার করে, পাঠ্য ক্ষেত্রের একটি নাম দেওয়া হয়।</p> <p>অক্ষম বৈশিষ্ট্য ক্ষেত্রটিকে নিষ্ক্রিয় করে - ক্ষেত্রের বিষয়বস্তু পরিবর্তন করা যায় না এবং এটি অ্যাক্সেসযোগ্য নয়। শুধুমাত্র পঠনযোগ্য বৈশিষ্ট্যটি নির্দেশ করে যে ক্ষেত্রটি শুধুমাত্র পঠনযোগ্য - ব্যবহারকারীর বিষয়বস্তু সম্পাদনা করার ক্ষমতা নেই, তবে এটি উপলব্ধ - এটি নির্বাচন করা যেতে পারে এবং উদাহরণস্বরূপ, অনুলিপি করা যেতে পারে।</p> <p>আপনি যথাক্রমে কল এবং সারি বৈশিষ্ট্যগুলি ব্যবহার করে অক্ষরগুলিতে পাঠ্য ক্ষেত্রের প্রস্থ এবং লাইনগুলিতে ক্ষেত্রের উচ্চতা সেট করতে পারেন।</p> <p><img src='https://i2.wp.com/webpupil.ru/img/java/java_example.jpg' height="68" width="200" loading=lazy loading=lazy></p> <p><p> <textarea name= "text" cols= "40" rows= "5" readonly> <span>যদি ক্ষেত্রের বিষয়বস্তু তার আকার অতিক্রম করে, একটি স্লাইডার প্রদর্শিত হবে।</span>

যদি ক্ষেত্রের বিষয়বস্তু তার আকার অতিক্রম করে, একটি স্লাইডার প্রদর্শিত হবে।

একটি ফর্ম ব্যবহার করার উদাহরণ

এখন দেখা যাক কিভাবে ফর্ম কাজ করে।

শিক্ষামূলক ভিডিও অর্ডার ফর্ম:

তোমার নাম: *

তোমার আদেশ:

HTML এর ভিডিও টিউটোরিয়াল
CSS এর ভিডিও টিউটোরিয়াল
পিএইচপি ভিডিও টিউটোরিয়াল

মিডিয়া নির্বাচন করুন:

সিডি

ডিভিডি

ইউএসবি ফ্ল্যাশ

তোমার ইমেইল: *

আপনার ঠিকানা: *