asp.net-core
टैग सहायक

पैरामीटर

फॉर्म टैग हेल्पर - मूल उदाहरण

<form asp-action="create" asp-controller="Home">
     <!--Your form elements goes here--> 
</form>

फॉर्म टैग हेल्पर - कस्टम मार्ग विशेषताओं के साथ

<form asp-action="create" 
      asp-controller="Home" 
      asp-route-returnurl="dashboard" 
      asp-route-from="google">
     <!--Your form elements goes here--> 
</form>

यह नीचे मार्कअप उत्पन्न करेगा

<form action="/Home/create?returnurl=dashboard&amp;from=google" method="post">
    <!--Your form elements goes here--> 
</form>

इनपुट टैग हेल्पर

अपने विचार को दृढ़ता से देखने वाले मॉडल की तरह टाइप किया जाता है

public class CreateProduct
{
   public string Name { set; get; }
}

और आप अपने एक्शन मेथड से इसे देखने के लिए एक ऑब्जेक्ट पास कर रहे हैं।

@model CreateProduct
<form asp-action="create" asp-controller="Home" >

    <input type="text" asp-for="Name"/>   
    <input type="submit"/>

</form>

यह नीचे मार्कअप उत्पन्न करेगा।

<form action="/Home/create" method="post"> 

    <input type="text" id="Name" name="Name" value="" />
    <input type="submit"/>
    <input name="__RequestVerificationToken" type="hidden" value="ThisWillBeAUniqueToken" />

</form>

यदि आप चाहते हैं कि इनपुट फ़ील्ड को डिफ़ॉल्ट मान के साथ प्रदान किया जाए, तो आप एक्शन विधि में अपने दृश्य मॉडल का नाम गुण मान सेट कर सकते हैं।

public IActionResult Create()
{
  var vm = new CreateProduct { Name="IPhone"};
  return View(vm);
} 

फॉर्म जमा करना और मॉडल बाइंडिंग

यदि आप अपने HttpPost एक्शन विधि पैरामीटर / name पैरामीटर के रूप में CreateProduct उपयोग करते हैं तो मॉडल बाइंडिंग ठीक काम करेगी

टैग हेल्पर का चयन करें

अपने विचार को इस तरह एक दृश्य मॉडल के लिए दृढ़ता से टाइप किया गया है

public class CreateProduct
{       
   public IEnumerable<SelectListItem> Categories { set; get; }
   public int SelectedCategory { set; get; }
}

और अपनी GET एक्शन विधि में, आप इस दृश्य मॉडल का एक ऑब्जेक्ट बना रहे हैं, श्रेणियाँ संपत्ति सेट कर रहे हैं और दृश्य को भेज रहे हैं

public IActionResult Create()
{
    var vm = new CreateProduct();
    vm.Categories = new List<SelectListItem>
    {
        new SelectListItem {Text = "Books", Value = "1"},
        new SelectListItem {Text = "Furniture", Value = "2"}
    };
    return View(vm);
}

और आपके विचार में

@model CreateProduct

<form asp-action="create" asp-controller="Home">
    <select asp-for="SelectedCategory" asp-items="@Model.Categories">
        <option>Select one</option>
    </select>
    <input type="submit"/>
</form>

यह नीचे दिए गए मार्कअप को प्रस्तुत करेगा ( केवल फॉर्म / फ़ील्ड के प्रासंगिक हिस्से शामिल हैं )

<form action="/Home/create" method="post">  
    <select data-val="true" id="SelectedCategory" name="SelectedCategory">
        <option>Select one</option>
        <option value="1">Shyju</option>
        <option value="2">Sean</option>
    </select>
    <input type="submit"/>
</form>

फ़ॉर्म सबमिशन में चयनित ड्रॉपडाउन मान प्राप्त करना

आप अपने HttpPost एक्शन विधि पैरामीटर के समान दृश्य मॉडल का उपयोग कर सकते हैं

[HttpPost]
public ActionResult Create(CreateProduct model)
{
  //check model.SelectedCategory value
  / /to do : return something
}

चयनित के रूप में एक विकल्प सेट करें

यदि आप एक विकल्प को चयनित विकल्प के रूप में सेट करना चाहते हैं, तो आप केवल SelectedCategory संपत्ति मूल्य निर्धारित कर सकते हैं।

public IActionResult Create()
{
    var vm = new CreateProduct();
    vm.Categories = new List<SelectListItem>
    {
        new SelectListItem {Text = "Books", Value = "1"},
        new SelectListItem {Text = "Furniture", Value = "2"},
        new SelectListItem {Text = "Music", Value = "3"}
    };
    vm.SelectedCategory = 2;
    return View(vm);
}

बहु चयन ड्रॉपडाउन / लिस्टबॉक्स का प्रतिपादन

यदि आप एक बहु चयन ड्रॉपडाउन को प्रस्तुत करना चाहते हैं, तो आप अपनी व्यू मॉडल प्रॉपर्टी को बदल सकते हैं, जिसका उपयोग आप अपने व्यू में asp-for एट्रिब्यूट के लिए एक अरै टाइप प्रकार के लिए कर सकते हैं।

public class CreateProduct
{       
   public IEnumerable<SelectListItem> Categories { set; get; }
   public int[] SelectedCategories { set; get; }
}

दृश्य में

@model CreateProduct

<form asp-action="create" asp-controller="Home" >
    <select asp-for="SelectedCategories" asp-items="@Model.Categories">
        <option>Select one</option>
    </select>
    <input type="submit"/>
</form>

यह multiple विशेषता के साथ SELECT तत्व उत्पन्न करेगा

<form action="/Home/create" method="post">
     <select id="SelectedCategories" multiple="multiple" name="SelectedCategories">
        <option>Select one</option>
        <option value="1">Shyju</option>
       <option value="2">Sean</option>
     </select>
    <input type="submit"/>
</form>

कस्टम टैग हेल्पर

आप ITagHelper को लागू ITagHelper या सुविधा वर्ग TagHelper से प्राप्त करके अपने स्वयं के टैग मददगार बना सकते हैं।

• डिफ़ॉल्ट सम्मेलन एक HTML टैग को लक्षित करना है जो वैकल्पिक टैग हेल्पर प्रत्यय के बिना सहायक के नाम से मेल खाता है। उदाहरण के लिए WidgetTagHelper <widget> टैग को लक्षित करेगा।
• [HtmlTargetElement] विशेषता का उपयोग टैग को लक्षित किए जाने को नियंत्रित करने के लिए किया जा सकता है
• वर्ग की किसी भी सार्वजनिक संपत्ति को रेजर मार्कअप में एक विशेषता के रूप में एक मूल्य दिया जा सकता है। उदाहरण के लिए एक सार्वजनिक संपत्ति public string Title {get; set;} को <widget title="my title"> रूप में एक मूल्य दिया जा सकता है
• डिफ़ॉल्ट रूप से, टैग हेल्पर्स पास्कल-केसेड सी # क्लास नामों और संपत्तियों को टैग सहायकों के लिए कम कबाब मामले में अनुवादित करते हैं। उदाहरण के लिए, यदि आप का उपयोग कर छोड़ देते हैं [HtmlTargetElement] और वर्ग के नाम है WidgetBoxTagHelper , तो उस्तरा में आप लिखेंगे <widget-box></widget-box> ।
• Process और ProcessAsync में प्रतिपादन तर्क होते हैं। दोनों वर्तमान टैग के बारे में जानकारी के साथ एक संदर्भ पैरामीटर प्राप्त करते हैं और प्रदान किए गए परिणाम को अनुकूलित करने के लिए एक आउटपुट पैरामीटर का उपयोग किया जाता है।

कस्टम टैग हेल्पर्स युक्त किसी भी असेंबली को _ViewImports.cshtml फ़ाइल में जोड़ा जाना चाहिए (ध्यान दें कि यह असेंबली पंजीकृत की जा रही है, नेमस्पेस नहीं):

@addTagHelper *, MyAssembly

नमूना विजेट कस्टम टैग हेल्पर

निम्न उदाहरण एक कस्टम विजेट टैग सहायक बनाता है जो रेजर मार्कअप को लक्षित करेगा:

<widget-box title="My Title">This is my content: @ViewData["Message"]</widget-box>

जिसे निम्नानुसार प्रस्तुत किया जाएगा:

<div class="widget-box">
    <div class="widget-header">My Title</div>
    <div class="widget-body">This is my content: some message</div>
</div>

ऐसे टैग हेल्पर को बनाने के लिए आवश्यक कोड निम्न है:

[HtmlTargetElement("widget-box")]
public class WidgetTagHelper : TagHelper
{
    public string Title { get; set; }

    public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
    {
        var outerTag = new TagBuilder("div");
        outerTag.Attributes.Add("class", output.TagName);
        output.MergeAttributes(outerTag);
        output.TagName = outerTag.TagName;

        //Create the header
        var header = new TagBuilder("div");
        header.Attributes.Add("class", "widget-header");
        header.InnerHtml.Append(this.Title);
        output.PreContent.SetHtmlContent(header);

        //Create the body and replace original tag helper content
        var body = new TagBuilder("div");
        body.Attributes.Add("class", "widget-body");
        var originalContents = await output.GetChildContentAsync();
        body.InnerHtml.Append(originalContents.GetContent());
        output.Content.SetHtmlContent(body);
    }
}

लेबल टैग हेल्पर

लेबल टैग हेल्पर का उपयोग मॉडल संपत्ति के लिए label रेंडर करने के लिए किया जा सकता है। यह MVC के पिछले संस्करणों में विधि Html.LabelFor जगह लेता है।

मान लीजिए कि आपके पास एक मॉडल है:

public class FormViewModel
{
    public string Name { get; set; }
}

दृश्य में आप label HTML तत्व और asp-for टैग हेल्पर का उपयोग कर सकते हैं:

<form>
    <label asp-for="Name"></label>
    <input asp-for="Name" type="text" />
</form>

यह MVC के पुराने संस्करणों में निम्नलिखित कोड के बराबर है:

<form>
    @Html.LabelFor(x => x.Name)
    @Html.TextBoxFor(x => x.Name)
</form>

ऊपर दिए गए दोनों कोड स्निपेट एक ही HTML प्रस्तुत करते हैं:

<form>
    <label for="Name">Name</label>
    <input name="Name" id="Name" type="text" value="">
</form>

एंकर टैग हेल्पर

एंकर टैग सहायक का उपयोग किसी विशेष नियंत्रक क्रिया या MVC मार्ग से लिंक करने के लिए href विशेषताएँ उत्पन्न करता है। मूल उदाहरण

<a asp-controller="Products" asp-action="Index">Login</a>

कभी-कभी, हमें नियंत्रक क्रिया के लिए अतिरिक्त पैरामीटर निर्दिष्ट करने की आवश्यकता होती है जिसे आप के लिए बाध्य कर रहे हैं। हम इन मापदंडों के लिए एस्प-रूट-उपसर्ग के साथ विशेषताओं को जोड़कर मान निर्दिष्ट कर सकते हैं।

<a asp-controller="Products" asp-action="Details" asp-route-id="@Model.ProductId">
   View Details
</a>