একটি নির্বাচন উপাদান রেন্ডার করতে নির্বাচন করুন সহায়ক নির্বাচন করুন
আপনার জিইটি অ্যাকশনে আপনার ভিউ মডেলের একটি অবজেক্ট তৈরি করুন, EmployeeList
সংগ্রহের সম্পত্তিটি লোড করুন এবং এটিকে দর্শনে প্রেরণ করুন।
public IActionResult Create()
{
var vm = new MyViewModel();
vm.EmployeesList = new List<Employee>
{
new Employee { Id = 1, FullName = "Shyju" },
new Employee { Id = 2, FullName = "Bryan" }
};
return View(vm);
}
এবং আপনার তৈরি দৃশ্যে, সম্পত্তি SelectList
থেকে একটি নতুন অবজেক্ট তৈরি করুন এবং EmployeeList
সম্পত্তিটির মান হিসাবে এটি পাস করুন asp-items
।
@model MyViewModel
<form asp-controller="Home" asp-action="Create">
<select asp-for="EmployeeId"
asp-items="@(new SelectList(Model.EmployeesList,"Id","FullName"))">
<option>Please select one</option>
</select>
<input type="submit"/>
</form>
এবং জমা দেওয়া ফর্ম ডেটা গ্রহণ করার জন্য আপনার এইচটিটিপিপোস্ট অ্যাকশন পদ্ধতি।
[HttpPost]
public IActionResult Create(MyViewModel model)
{
// check model.EmployeeId
// to do : Save and redirect
}
অথবা
যদি আপনার ভিউ মডেলটিতে List<SelectListItem>
আপনার ড্রপডাউন আইটেমগুলির সম্পত্তি হিসাবে থাকে।
public class MyViewModel
{
public int EmployeeId { get; set; }
public string Comments { get; set; }
public List<SelectListItem> Employees { set; get; }
}
এবং আপনার পদক্ষেপ গ্রহণ,
public IActionResult Create()
{
var vm = new MyViewModel();
vm.Employees = new List<SelectListItem>
{
new SelectListItem {Text = "Shyju", Value = "1"},
new SelectListItem {Text = "Sean", Value = "2"}
};
return View(vm);
}
এবং ভিউতে, আপনি সরাসরি Employees
সম্পত্তিটির জন্য ব্যবহার করতে পারেন asp-items
।
@model MyViewModel
<form asp-controller="Home" asp-action="Create">
<label>Comments</label>
<input type="text" asp-for="Comments"/>
<label>Lucky Employee</label>
<select asp-for="EmployeeId" asp-items="@Model.Employees" >
<option>Please select one</option>
</select>
<input type="submit"/>
</form>
ক্লাসটি নেমস্পেসের SelectListItem
অন্তর্গত Microsoft.AspNet.Mvc.Rendering
।
আপনি নির্বাচনের উপাদানগুলির জন্য একটি সুস্পষ্ট সমাপনী ট্যাগ ব্যবহার করছেন তা নিশ্চিত করুন। আপনি যদি স্ব-ক্লোজিং ট্যাগ পদ্ধতির ব্যবহার করেন, ট্যাগ সহায়কটি একটি খালি SELECT উপাদান রেন্ডার করবে!
নীচের পদ্ধতির কাজ করবে না
<select asp-for="EmployeeId" asp-items="@Model.Employees" />
তবে এটি কাজ করবে।
<select asp-for="EmployeeId" asp-items="@Model.Employees"></select>
সত্তা ফ্রেমওয়ার্ক ব্যবহার করে আপনার ডাটাবেস টেবিল থেকে ডেটা প্রাপ্ত করা
উপরের উদাহরণগুলি বিকল্পগুলির জন্য হার্ড কোডিং আইটেমগুলি ব্যবহার করছে। সুতরাং আমি ভেবেছিলাম যে সত্ত্বার কাঠামো ব্যবহার করে ডেটা পেতে আমি কিছু নমুনা কোড যুক্ত করব কারণ অনেক লোক এটি ব্যবহার করে use
চলুন, আপনার DbContext বস্তুর একটি সম্পত্তি বলা অনুমান Employees
, টাইপ করা হয়, যা DbSet<Employee>
যেখানে Employee
সত্তা বর্গ একটি হয়েছে Id
এবং Name
এই মত সম্পত্তি
public class Employee
{
public int Id { set; get; }
public string Name { set; get; }
}
আপনি কর্মচারীদের পেতে একটি লিনকিউ ক্যোয়ারী ব্যবহার করতে পারেন SelectListItem
এবং প্রতিটি কর্মচারীর জন্য সামগ্রীর তালিকা তৈরি করতে আপনার লিনকিউ এক্সপ্রেশনটিতে সিলেক্ট পদ্ধতিটি ব্যবহার করতে পারেন ।
public IActionResult Create()
{
var vm = new MyViewModel();
vm.Employees = context.Employees
.Select(a => new SelectListItem() {
Value = a.Id.ToString(),
Text = a.Name
})
.ToList();
return View(vm);
}
ধরে context
নেওয়া আপনার ডিবি কনটেক্সট অবজেক্ট। ভিউ কোডটি উপরের মতো।
নির্বাচন করা তালিকা ব্যবহার করা হচ্ছে Using
কিছু লোক SelectList
বিকল্পগুলি রেন্ডার করতে প্রয়োজনীয় আইটেমগুলি ধরে রাখতে ক্লাস ব্যবহার করতে পছন্দ করে ।
public class MyViewModel
{
public int EmployeeId { get; set; }
public SelectList Employees { set; get; }
}
এখন আপনার জিইটি অ্যাকশনে, আপনি ভিউ মডেলের সম্পত্তি SelectList
পপুলেশন করতে কনস্ট্রাক্টরটি ব্যবহার করতে পারেন Employees
। আপনি dataValueField
এবং dataTextField
পরামিতি নির্দিষ্ট করে দিচ্ছেন তা নিশ্চিত করুন ।
public IActionResult Create()
{
var vm = new MyViewModel();
vm.Employees = new SelectList(GetEmployees(),"Id","FirstName");
return View(vm);
}
public IEnumerable<Employee> GetEmployees()
{
// hard coded list for demo.
// You may replace with real data from database to create Employee objects
return new List<Employee>
{
new Employee { Id = 1, FirstName = "Shyju" },
new Employee { Id = 2, FirstName = "Bryan" }
};
}
এখানে আমি আহ্বান করছি GetEmployees
পদ্ধতি, একটি সঙ্গে প্রতিটি কর্মচারী বস্তুর সম্বন্ধে জানতে-- Id
এবং FirstName
সম্পত্তি এবং আমি হিসাবে যারা বৈশিষ্ট্য ব্যবহার DataValueField
এবং DataTextField
এর SelectList
বস্তুর আমরা তৈরি করেছি। আপনি হার্ডকোডযুক্ত তালিকাটি এমন একটি কোডে পরিবর্তন করতে পারেন যা একটি ডাটাবেস টেবিল থেকে ডেটা পড়বে।
ভিউ কোডটি একই হবে।
<select asp-for="EmployeeId" asp-items="@Model.Employees" >
<option>Please select one</option>
</select>
স্ট্রিংয়ের তালিকা থেকে একটি নির্বাচন উপাদান রেন্ডার করুন।
কখনও কখনও আপনি স্ট্রিংয়ের তালিকা থেকে একটি নির্বাচিত উপাদান রেন্ডার করতে চাইতে পারেন। সেক্ষেত্রে আপনি SelectList
কেবল কনস্ট্রাক্টর ব্যবহার করতে পারেনIEnumerable<T>
var vm = new MyViewModel();
var items = new List<string> {"Monday", "Tuesday", "Wednesday"};
vm.Employees = new SelectList(items);
return View(vm);
ভিউ কোডটি একই হবে।
নির্বাচিত বিকল্পগুলি সেট করা হচ্ছে
কিছু সময়, আপনি SELECT উপাদানটিতে ডিফল্ট বিকল্প হিসাবে একটি বিকল্প সেট করতে চাইতে পারেন (উদাহরণস্বরূপ, একটি সম্পাদনা স্ক্রিনে, আপনি পূর্ববর্তী সংরক্ষিত বিকল্প মানটি লোড করতে চান)। এটি করতে, আপনি যে EmployeeId
বিকল্পটি নির্বাচন করতে চান তার মানের জন্য আপনি কেবল সম্পত্তি মান সেট করতে পারেন।
public IActionResult Create()
{
var vm = new MyViewModel();
vm.Employees = new List<SelectListItem>
{
new SelectListItem {Text = "Shyju", Value = "11"},
new SelectListItem {Text = "Tom", Value = "12"},
new SelectListItem {Text = "Jerry", Value = "13"}
};
vm.EmployeeId = 12; // Here you set the value
return View(vm);
}
পৃষ্ঠাটি যখন রেন্ডার করা হয় তখন এটি নির্বাচনের উপাদানটিতে টম বিকল্পটি নির্বাচন করবে।
একাধিক নির্বাচন ড্রপডাউন
আপনি যদি কোনও মাল্টি সিলেক্ট ড্রপডাউন রেন্ডার করতে চান তবে আপনি কেবল নিজের ভিউ মডেল প্রপার্টিটি পরিবর্তন করতে পারেন যা আপনি asp-for
আপনার দৃষ্টিতে বৈশিষ্ট্যের জন্য ব্যবহার করেন অ্যারের প্রকারে।
public class MyViewModel
{
public int[] EmployeeIds { get; set; }
public List<SelectListItem> Employees { set; get; }
}
এটি multiple
বৈশিষ্ট্যের সাহায্যে নির্বাচিত উপাদানগুলির জন্য এইচটিএমএল মার্কআপ রেন্ডার করবে যা ব্যবহারকারীকে একাধিক বিকল্প নির্বাচন করতে দেয়।
@model MyViewModel
<select id="EmployeeIds" multiple="multiple" name="EmployeeIds">
<option>Please select one</option>
<option value="1">Shyju</option>
<option value="2">Sean</option>
</select>
মাল্টি সিলেক্টে নির্বাচিত বিকল্পগুলি সেট করা
একক নির্বাচনের অনুরূপ, EmployeeIds
আপনি যে মানটি চান সেগুলিতে অ্যারেটিতে সম্পত্তি মান সেট করুন ।
public IActionResult Create()
{
var vm = new MyViewModel();
vm.Employees = new List<SelectListItem>
{
new SelectListItem {Text = "Shyju", Value = "11"},
new SelectListItem {Text = "Tom", Value = "12"},
new SelectListItem {Text = "Jerry", Value = "13"}
};
vm.EmployeeIds= new int[] { 12,13} ;
return View(vm);
}
পৃষ্ঠাটি যখন রেন্ডার করা হবে তখন এটি মাল্টি সিলেক্ট এলিমেন্টে টম এবং জেরি বিকল্পটি নির্বাচন করবে।
আইটেমের তালিকা স্থানান্তর করতে ভিউব্যাগ ব্যবহার করা
যদি আপনি একটি সংগ্রহে টাইপ সম্পত্তি রাখার দৃশ্যে অপশনের তালিকা পাস করতে পছন্দ না করেন, তাহলে আপনি এটা করতে গতিশীল ViewBag ব্যবহার করতে পারেন। ( এটা আমার পদ্ধতির ব্যক্তিগতভাবে বাঞ্ছনীয় নয় viewbag গতিশীল এবং আপনার কোড uncatched প্রবণ টাইপ ত্রুটি )
public IActionResult Create()
{
ViewBag.Employees = new List<SelectListItem>
{
new SelectListItem {Text = "Shyju", Value = "1"},
new SelectListItem {Text = "Sean", Value = "2"}
};
return View(new MyViewModel());
}
এবং দেখুন
<select asp-for="EmployeeId" asp-items="@ViewBag.Employees">
<option>Please select one</option>
</select>
আইটেমের তালিকা স্থানান্তর করতে ও নির্বাচিত বিকল্পটি সেট করতে ভিউব্যাগ ব্যবহার করা
এটি উপরের মতোই। আপনাকে যা করতে হবে তা হল, সম্পত্তি নির্বাচন করুন (যার জন্য আপনি ড্রপডাউনকে বাধ্য করছেন) আপনি যে বিকল্পটি নির্বাচন করতে চান তার মান নির্ধারণ করুন।
public IActionResult Create()
{
ViewBag.Employees = new List<SelectListItem>
{
new SelectListItem {Text = "Shyju", Value = "1"},
new SelectListItem {Text = "Bryan", Value = "2"},
new SelectListItem {Text = "Sean", Value = "3"}
};
vm.EmployeeId = 2; // This will set Bryan as selected
return View(new MyViewModel());
}
এবং দেখুন
<select asp-for="EmployeeId" asp-items="@ViewBag.Employees">
<option>Please select one</option>
</select>
দলবদ্ধকরণ আইটেম
নির্বাচিত ট্যাগ সহায়ক পদ্ধতিটি একটি ড্রপডাউনে গ্রুপিং বিকল্পগুলিকে সমর্থন করে। আপনাকে যা করতে হবে তা হ'ল, আপনার ক্রিয়া পদ্ধতিতে Group
প্রত্যেকটির সম্পত্তি মান নির্দিষ্ট করুন SelectListItem
।
public IActionResult Create()
{
var vm = new MyViewModel();
var group1 = new SelectListGroup { Name = "Dev Team" };
var group2 = new SelectListGroup { Name = "QA Team" };
var employeeList = new List<SelectListItem>()
{
new SelectListItem() { Value = "1", Text = "Shyju", Group = group1 },
new SelectListItem() { Value = "2", Text = "Bryan", Group = group1 },
new SelectListItem() { Value = "3", Text = "Kevin", Group = group2 },
new SelectListItem() { Value = "4", Text = "Alex", Group = group2 }
};
vm.Employees = employeeList;
return View(vm);
}
ভিউ কোডে কোনও পরিবর্তন নেই। নির্বাচন ট্যাগ সাহায্যকারী এখন 2 অপটগ্রুপ আইটেমের মধ্যে বিকল্পগুলি রেন্ডার করবে ।