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

এই টিউটোরিয়ালে আমরা দেখব কিভাবে ASP.NET Core MVC বা Razor Pages অ্যাপ্লিকেশন তৈরি করে ফর্ম তৈরি এবং ডেটা সাবমিট করা যায়।

ফর্ম তৈরি করা

ASP.NET Core MVC বা Razor Pages এ ফর্ম তৈরি করার জন্য সাধারণত HTML ফর্ম উপাদান ব্যবহার করা হয়। সাধারণ ফর্মে ইনপুট ফিল্ড যেমন TextBox, DropDownList, RadioButton, CheckBox ইত্যাদি থাকতে পারে। এছাড়া, ফর্মটি সাবমিট করার জন্য একটি submit বাটন ব্যবহার করা হয়।

MVC Example:

1. Model: প্রথমে একটি মডেল তৈরি করুন যাতে ফর্ম থেকে পাঠানো ডেটা মডেল বাউন্ড হবে।

public class ContactModel
{
    public string Name { get; set; }
    public string Email { get; set; }
    public string Message { get; set; }
}

2. View: পরবর্তীতে View ফাইলে ফর্ম তৈরি করুন। এখানে Razor সিনট্যাক্স ব্যবহার করা হবে।

@model YourApp.Models.ContactModel

<form asp-action="SubmitContact" method="post">
    <div>
        <label for="Name">Name:</label>
        <input type="text" id="Name" name="Name" />
    </div>

    <div>
        <label for="Email">Email:</label>
        <input type="email" id="Email" name="Email" />
    </div>

    <div>
        <label for="Message">Message:</label>
        <textarea id="Message" name="Message"></textarea>
    </div>

    <button type="submit">Submit</button>
</form>

এই ফর্মে একটি Name, Email এবং Message ইনপুট ফিল্ড রয়েছে। asp-action="SubmitContact" অ্যাট্রিবিউটটি নির্দেশ করে যে ফর্মটি SubmitContact একশন মেথডে সাবমিট হবে।

ডেটা সাবমিট করা

ফর্মটি সাবমিট করার জন্য, Controller তে একটি একশন মেথড তৈরি করতে হবে যাতে ফর্ম থেকে পাঠানো ডেটা প্রসেস করা যায়। এখানে, HTTP POST রিকোয়েস্টের মাধ্যমে ফর্মের ডেটা সাবমিট করা হবে।

1. Controller: ContactController নামে একটি কন্ট্রোলার তৈরি করে ফর্মের ডেটা গ্রহণ এবং প্রক্রিয়া করার জন্য একশন মেথড তৈরি করুন।

using Microsoft.AspNetCore.Mvc;
using YourApp.Models;

public class ContactController : Controller
{
    [HttpGet]
    public IActionResult Index()
    {
        return View();
    }

    [HttpPost]
    public IActionResult SubmitContact(ContactModel model)
    {
        if (ModelState.IsValid)
        {
            // ডেটা প্রক্রিয়া করা (যেমন, ডেটাবেসে সংরক্ষণ বা ইমেইল পাঠানো)
            // এখানে আপনি ডেটার সাথে কাজ করতে পারেন

            TempData["SuccessMessage"] = "Your message has been sent successfully!";
            return RedirectToAction("Index");
        }

        // যদি মডেল ইনভ্যালিড হয়, তাহলে আবার ফর্ম দেখানো হবে
        return View("Index", model);
    }
}

এখানে, SubmitContact মেথড ContactModel ডেটা মডেলকে গ্রহণ করবে। ModelState.IsValid চেক করে নিশ্চিত হবে যে ফর্মে কোন ভুল নেই। যদি ফর্মে সবকিছু ঠিক থাকে, তাহলে ফর্মের ডেটা প্রসেস করা হবে (যেমন, ডেটাবেসে সেভ করা বা ইমেইল পাঠানো)। যদি মডেল ভ্যালিড না হয়, তবে আবার ফর্ম দেখানো হবে।

Model Binding এবং Validation Attributes

ASP.NET Core MVC তে Model Binding ব্যবহার করে ফর্মের ইনপুট ডেটা সরাসরি মডেল প্রপার্টিতে পাঠানো হয়। মডেল বাউন্ড ডেটা শুদ্ধভাবে ফর্মে ফিরে আসে, এবং আপনি এই ডেটা ভ্যালিডেশনের জন্য Validation Attributes ব্যবহার করতে পারেন।

Example of Validation Attributes:

public class ContactModel
{
    [Required(ErrorMessage = "Name is required.")]
    public string Name { get; set; }

    [Required(ErrorMessage = "Email is required.")]
    [EmailAddress(ErrorMessage = "Please enter a valid email address.")]
    public string Email { get; set; }

    [Required(ErrorMessage = "Message is required.")]
    public string Message { get; set; }
}

এখানে, Required এবং EmailAddress অ্যাট্রিবিউট ফর্ম ইনপুটে যাচাই করবে যে ইউজার ফিল্ডগুলি সঠিকভাবে পূর্ণ করেছে। যদি ফিল্ডটি খালি থাকে অথবা ইমেইল সঠিক না হয়, তাহলে একটি এরর মেসেজ প্রদর্শিত হবে।

Custom Validation এবং Client-Side Validation

ASP.NET Core MVC ফর্মের জন্য কাস্টম ভ্যালিডেশন তৈরি করা যেতে পারে, যা ব্যবহারকারীকে নির্দিষ্ট শর্তে ডেটা সাবমিট করতে বাধ্য করে। এছাড়া, ক্লায়েন্ট সাইড ভ্যালিডেশন সক্ষম করার জন্য JavaScript ব্যবহার করতে পারেন।

Client-Side Validation:

ASP.NET Core MVC সরাসরি ক্লায়েন্ট সাইড ভ্যালিডেশন সমর্থন করে। এটি jquery.validate.js এবং jquery.validate.unobtrusive.js স্ক্রিপ্ট ফাইল ব্যবহার করে কাজ করে। এই স্ক্রিপ্ট ফাইলগুলো প্রজেক্টে যুক্ত করলে ফর্ম সাবমিট করার আগে ফর্মের ডেটা চেক করা হবে।

আপনার _Layout.cshtml ফাইলে এই স্ক্রিপ্টগুলো যোগ করুন:

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.3/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate-unobtrusive/3.2.11/jquery.validate.unobtrusive.min.js"></script>

এই স্ক্রিপ্টগুলি স্বয়ংক্রিয়ভাবে ক্লায়েন্ট সাইডে ভ্যালিডেশন চালায় এবং ইউজারকে ইনপুট ত্রুটির জন্য সতর্ক করে।

সারাংশ

ASP.NET Core অ্যাপ্লিকেশনে ফর্ম তৈরি এবং ডেটা সাবমিট করা একটি সাধারণ কিন্তু গুরুত্বপূর্ণ কার্যক্রম। আপনি MVC বা Razor Pages ব্যবহার করে সহজে ফর্ম তৈরি করতে পারেন এবং ব্যবহারকারীর ইনপুট সংগ্রহ করতে পারেন। ফর্ম সাবমিট করার পর, ডেটা প্রসেস করা, মডেল বাউন্ডিং এবং ভ্যালিডেশন অটোমেটিকভাবে সম্পন্ন হয়। এতে ফর্মের ইনপুট সঠিক কিনা তা যাচাই করা এবং সাবমিটের পরে প্রয়োজনীয় পদক্ষেপ নেওয়া যায়।