Quartz 5

3. Strongly Typed Partial Views

5 min read

হ্যালো হাসিব! কোর্স আউটলাইন অনুযায়ী, আমরা এখন Section 10: Partial Views-এর তৃতীয় লেকচার “Strongly Typed Partial Views” (Lecture 116) নিয়ে আলোচনা করবো। আগের লেকচারে তুমি ViewData এবং ViewBag দিয়ে ডাটা পাস করা শিখেছো। কিন্তু প্রফেশনাল এবং সিকিউরড অ্যাপ্লিকেশনে আমরা সাধারণত Strongly Typed Models ব্যবহার করি।

চলো, এই লেকচারটির প্রতিটি বিষয় বিস্তারিতভাবে ডিকোড করি।

সারসংক্ষেপ (Quick Revision List)

  • Strongly Typed Partial View কী: যখন একটি Partial View নির্দিষ্ট কোনো Model Class-এর সাথে শক্তভাবে যুক্ত (Tightly Coupled) থাকে এবং ডাটা ট্রান্সফারের জন্য সেই Model-এর অবজেক্ট ব্যবহার করে।

  • কেন ব্যবহার করবো: ViewData বা ViewBag ব্যবহার করলে রানটাইমে এরর (Spelling mistake, null type) হওয়ার সম্ভাবনা থাকে। Model ব্যবহার করলে Compile-time Type checking এবং Intelisense সাপোর্ট পাওয়া যায়।

  • কিভাবে তৈরি করবো: ১. একটি Model Class তৈরি করা। ২. Partial View ফাইলে @model ModelClassName ডিক্লেয়ার করা। ৩. Model প্রোপার্টির মাধ্যমে ভ্যালু অ্যাক্সেস করা (যেমন: Model.ListTitle)।

  • কিভাবে ডাটা পাঠাবো:

  • Tag Helper দিয়ে: <partial name="_ViewName" model="ModelObject" />

  • HTML Helper দিয়ে: @await Html.PartialAsync("_ViewName", ModelObject)

  • The Null Reference Danger: Strongly Typed Partial View কল করার সময় যদি Model Object না পাঠানো হয়, তবে অ্যাপ্লিকেশনে NullReferenceException খাবে।

Comprehensive Breakdown

১. Model Class তৈরি করা [Priority: 10/10]

যেহেতু আমরা Strongly Typed ডাটা পাঠাতে চাই, প্রথমে আমাদের একটি Model Class তৈরি করতে হবে।

  • Models নামে একটি ফোল্ডার তৈরি করো।
  • সেখানে ListModel.cs নামে একটি ক্লাস তৈরি করো।

Code Implementation (Models/ListModel.cs):

namespace PartialViewsExample.Models
{
    public class ListModel
    {
        public string ListTitle { get; set; } = "";
        public List<string> ListItems { get; set; } = new List<string>();
    }
}

২. _ViewImports.cshtml-এ Namespace অ্যাড করা [Priority: 9/10]

যেহেতু ListModel ক্লাসটি Models ফোল্ডারে আছে, View ফাইলগুলো বাই ডিফল্ট একে চিনবে না। তাই Views/_ViewImports.cshtml ফাইলে এর Namespace ইমপোর্ট করে দিতে হবে, যাতে সব View ফাইল এটিকে অ্যাক্সেস করতে পারে।

Code Implementation:

@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@using PartialViewsExample.Models  <!-- আপনার প্রজেক্টের নাম অনুযায়ী Namespace -->

৩. Parent View থেকে Model Object পাঠানো [Priority: 10/10]

এখন Index.cshtml-এ ListModel-এর একটি অবজেক্ট তৈরি করে সেটিকে Partial View-এর কাছে পাঠাতে হবে।

Code Implementation (Views/Home/Index.cshtml):

<!-- C# Code block to create Model Object -->
@{
    var listModelObj = new ListModel()
    {
        ListTitle = "List of Countries",
        ListItems = new List<string>() { "Bangladesh", "USA", "UK", "Japan" }
    };
}
 
<h2>Welcome to Home Page</h2>
 
<!-- Sending Model using Tag Helper -->
<partial name="_ListPartialView" model="listModelObj" />

৪. Partial View-কে Strongly Typed করা [Priority: 10/10]

এখন _ListPartialView.cshtml-কে বলে দিতে হবে যে, সে শুধুমাত্র ListModel টাইপের ডাটা রিসিভ করবে।

  • ফাইলের একদম উপরে @model ListModel লিখতে হবে (ছোট হাতের m)।
  • নিচে ডাটা অ্যাক্সেস করার জন্য @Model.PropertyName ব্যবহার করতে হবে (বড় হাতের M)।

Code Implementation (Views/Shared/_ListPartialView.cshtml):

@model ListModel  <!-- Defining the type -->
 
<div class="list-container">
    <!-- Accessing Properties via Model object -->
    <h2>@Model.ListTitle</h2> 
    
    <ul class="list">
        @foreach (var item in Model.ListItems)
        {
            <li>@item</li>
        }
    </ul>
</div>

৫. HTML Helper দিয়ে Model পাঠানো [Priority: 8/10]

লেকচারার About.cshtml-এ দেখিয়েছেন কিভাবে HTML Helper ব্যবহার করে Model পাঠানো যায়। এখানে মেথডের ২য় আর্গুমেন্ট হিসেবে অবজেক্টটিকে পাস করতে হয়।

Code Implementation (Views/Home/About.cshtml):

@{
    var programmingLanguages = new ListModel()
    {
        ListTitle = "Programming Languages",
        ListItems = new List<string>() { "C#", "Java", "Python", "JavaScript" }
    };
}
 
<h2>About Us</h2>
 
<!-- Sending Model using HTML Helper -->
@await Html.PartialAsync("_ListPartialView", programmingLanguages)

৬. The Null Reference Exception (সতর্কতা) [Priority: 10/10]

যদি তোমার Partial View Strongly Typed হয় (অর্থাৎ উপরে @model ডিক্লেয়ার করা থাকে), কিন্তু তুমি কল করার সময় কোনো মডেল পাস না করো:

<partial name="_ListPartialView" /> <!-- Model parameter is missing! -->

তাহলে অ্যাপ রান করার সময় NullReferenceException খাবে। কারণ Partial View রেন্ডার করার সময় সে @Model.ListTitle খুঁজতে যাবে, কিন্তু দেখবে Model অবজেক্টটি null।

  • Fix: Strongly Typed Partial View-তে সবসময় মডেল পাস করতে হবে।

VS / VS Code Shortcuts (For faster development)

  • Quick Fix / Import Namespace (VS Code): ক্লাসের নামের উপর কার্সর রেখে Ctrl + . চাপলে Missing namespace import করার অপশন আসবে।
  • Rename Variable (Refactoring): কোনো ভ্যারিয়েবলের নামের উপর ক্লিক করে F2 চাপলে, পুরো ফাইলে যেখানে যেখানে ঐ নাম আছে সব একবারে চেঞ্জ হয়ে যাবে।

Best Practices & .NET 10 Context

Best Practices for Strongly Typed Partial Views:

  1. Always Prefer Strongly Typed: প্রফেশনাল কাজে ViewBag বা ViewData পরিহার করে সবসময় Strongly Typed Partial Views ব্যবহার করবে। এতে কোড অনেক বেশি সেইফ থাকে এবং ভুল হওয়ার সম্ভাবনা কমে যায়।
  2. Null Validation in Partial View: যদিও Parent থেকে মডেল পাঠানো ম্যান্ডেটরি, তবুও সেফ সাইডে থাকার জন্য Partial View-এর ভেতরে একটি Null Check রাখা ভালো প্র্যাকটিস।
@model ListModel
 
@if(Model != null && Model.ListItems.Any())
{
    // Render UI
}
  1. Dedicated ViewModels: ডাটাবেস এ্যান্টিটি (Entity Model) সরাসরি Partial View-তে পাস না করে, শুধুমাত্র UI-এর জন্য একটি আলাদা ViewModel (যেমন: ProductCardViewModel) বানিয়ে সেটি পাস করা উচিত।

.NET 10 Context: ASP.NET Core 10-এ Strongly Typed Partial View-এর বেসিক কনসেপ্ট সম্পূর্ণ এক। তবে .NET 8, 9 এবং 10-এ C#-এর কিছু নতুন ফিচার যুক্ত হয়েছে, যেমন Nullable Reference Types (string?)। মডার্ন .NET 10-এ তোমার Model ক্লাসটি এমন দেখতে হওয়া উচিত:

namespace PartialViewsExample.Models; // C# 10 File-scoped namespace
 
public class ListModel
{
    // required modifier assures that these properties must be initialized
    public required string ListTitle { get; set; } 
    public required List<string> ListItems { get; set; } = new(); // C# 9 feature: Target-typed new
}

হাসিব, Strongly Typed Partial View-এর কনসেপ্ট কি ক্লিয়ার হয়েছে? তুমি রেডি হলে আমরা এই সেকশনের শেষ লেকচার “PartialViewResult”-এ মুভ করতে পারি!

Graph View

Backlinks