ASP.NET MVC हां / नहीं रेडियो बटन मजबूत बाउंड मॉडल MVC के साथ


132

क्या किसी को पता है कि ASP.NET MVC में एक मजबूत टाइप मॉडल के बूलियन प्रॉपर्टी के लिए हां / ना रेडियो बटन को कैसे बांधना है।

नमूना

public class MyClass
{
     public bool Blah { get; set; }
}

राय

<%@  Page Title="blah"  Inherits="MyClass"%>
    <dd>
        <%= Html.RadioButton("blah", Model.blah) %> Yes
        <%= Html.RadioButton("blah", Model.blah) %> No
    </dd>

धन्यवाद

उपाय:

दिशा के लिए ब्रायन के लिए धन्यवाद, लेकिन उन्होंने जो लिखा उसके विपरीत था। जैसे -

<%@  Page Title="blah"  Inherits="MyClass"%>
<dd>
    <%= Html.RadioButton("blah", !Model.blah) %> Yes
    <%= Html.RadioButton("blah", Model.blah) %> No
</dd>

4
इन समाधानों के साथ "समस्या" (और मैं अपनी परियोजना में बेन कल शैली का उपयोग कर रहा हूं) यह है कि आप उनके साथ लेबल नहीं कर सकते। दोनों रेडियो बटन इनपुट में एक ही आईडी और नाम होगा, इसलिए यदि आप Html.LabelFor का उपयोग करते हैं, तो यह उस आईडी के साथ DOM में पहले रेडियो बटन इनपुट से लिंक होगा। जैसा कि मैंने कहा, मैं बूलियन क्षेत्र का प्रतिनिधित्व करने के लिए रेडियो बटन के लिए इस समाधान का उपयोग कर रहा हूं, मैं सिर्फ लोगों को यह जानना चाहता था कि लेबल थोड़ा विजयी होगा।
ग्रोमर

2
जेफ बॉबीश का जवाब देखें कि लेबल के मुद्दे को कैसे सुरुचिपूर्ण ढंग से ठीक किया जाए।
रेने

जवाबों:


74

दूसरा पैरामीटर चुना गया है, इसलिए उपयोग करें! बूलियन के झूठे होने पर कोई मूल्य चुनने के लिए नहीं।

<%= Html.RadioButton("blah", !Model.blah) %> Yes 
<%= Html.RadioButton("blah", Model.blah) %> No 

198

यदि आप MVC 3 और रेजर का उपयोग कर रहे हैं, तो आप निम्नलिखित का भी उपयोग कर सकते हैं:

@Html.RadioButtonFor(model => model.blah, true) Yes
@Html.RadioButtonFor(model => model.blah, false) No

56

यहां fieldsetएक्सेसिबिलिटी कारणों के लिए एक और अधिक पूर्ण उदाहरण दिया गया है और पहले बटन को डिफ़ॉल्ट के रूप में निर्दिष्ट किया गया है। एक के बिना fieldset, रेडियो बटन एक पूरे के लिए क्या प्रोग्रामेटिक रूप से निर्धारित नहीं किए जा सकते हैं।

नमूना

public class MyModel
{
    public bool IsMarried { get; set; }
}

राय

<fieldset>
    <legend>Married</legend>

    @Html.RadioButtonFor(e => e.IsMarried, true, new { id = "married-true" })
    @Html.Label("married-true", "Yes")

    @Html.RadioButtonFor(e => e.IsMarried, false, new { id = "married-false" })
    @Html.Label("married-false", "No")
</fieldset>

आप @checkedरेडियो बटन को डिफ़ॉल्ट के रूप में सेट करने के लिए अनाम ऑब्जेक्ट में एक तर्क जोड़ सकते हैं :

new { id = "married-true", @checked = 'checked' }

ध्यान दें कि आप एक स्ट्रिंग को प्रतिस्थापित करके trueऔर falseस्ट्रिंग मानों से बांध सकते हैं ।


आपको वास्तव में नए {id = Html.Id ("विवाहित-सत्य")} का उपयोग करना चाहिए, उत्पन्न आईडी उपसर्गों के संभावित गुंजाइश मुद्दों को कम करना चाहिए।
इलियरी

26

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

<%: Html.Label("isBlahYes", "Yes")%><%= Html.RadioButtonFor(model => model.blah, true, new { @id = "isBlahYes" })%>
<%: Html.Label("isBlahNo", "No")%><%= Html.RadioButtonFor(model => model.blah, false, new { @id = "isBlahNo" })%>

आशा है कि ये आपकी मदद करेगा।


7
आम तौर पर लेबल एक रेडियो बटन के बाद होता है।
डैनियल इम्स

6
एक रेडियो बटन के चारों ओर एक लेबल लगाना पूरी तरह से मान्य है।
स्कॉट बेकर

23

नियमित HTML का उपयोग करके रेडियो बटन के चारों ओर लेबल टैग जोड़ना 'labelfor' समस्या को ठीक करेगा:

<label><%= Html.RadioButton("blah", !Model.blah) %> Yes</label>
<label><%= Html.RadioButton("blah", Model.blah) %> No</label>

पाठ पर क्लिक करके अब उपयुक्त रेडियो बटन का चयन करता है।



5

यदि मैं अपनी टोपी को रिंग में फेंक सकता हूं, तो मुझे लगता है कि रेडियो बटन की कार्यक्षमता का पुन: उपयोग करने के लिए मौजूदा उत्तरों की तुलना में एक क्लीनर तरीका है।

मान लें कि आपके ViewModel में निम्नलिखित संपत्ति है :

Public Class ViewModel
    <Display(Name:="Do you like Cats?")>
    Public Property LikesCats As Boolean
End Class

आप पुन: प्रयोज्य संपादक टेम्पलेट के माध्यम से उस संपत्ति को उजागर कर सकते हैं :

सबसे पहले, फ़ाइल बनाएँ Views/Shared/EditorTemplates/YesNoRadio.vbhtml

इसके बाद YesNoRadio.vbhtml पर निम्न कोड जोड़ें :

@ModelType Boolean?

<fieldset>
    <legend>
        @Html.LabelFor(Function(model) model)
    </legend>

    <label>
        @Html.RadioButtonFor(Function(model) model, True) Yes
    </label>
    <label>
        @Html.RadioButtonFor(Function(model) model, False) No
    </label>
</fieldset>

आप अपने व्यू में टेम्प्लेट नाम को मैन्युअल रूप से निर्दिष्ट करके संपत्ति के लिए संपादक को कॉल कर सकते हैं :

@Html.EditorFor(Function(model) model.LikesCats, "YesNoRadio")

पेशेवरों:

  • पीछे कोड में तार जोड़ने के बजाय एक HTML संपादक में HTML लिखने के लिए।
  • DisplayName DataAnnotation को सुरक्षित रखता है
  • रेडियो बटन को टॉगल करने के लिए लेबल पर क्लिक की अनुमति देता है
  • फॉर्म (1 लाइन) में बनाए रखने के लिए कम से कम संभव कोड। यदि यह जिस तरह से चल रहा है, उसके साथ कुछ गलत है, तो इसे टेम्पलेट के साथ उठाएं।

यह अच्छा है, लेकिन बुलियन के लिए एक तीसरा विकल्प क्या है? @ Html.RadioButtonFor (फंक्शन (मॉडल) Model.IsVerified, True) <span> हाँ </ span> @ Html.RadioButtonFor (फ़ंक्शन (मॉडल) Model.IsVerified, गलत) <span> नहीं </ span> @ Html.RadioButtonFor (फंक्शन (मॉडल) मॉडल। सत्यापित, कुछ भी नहीं) <span> लंबित </ span>
JoshYates1980

1

मैंने इसे एक विस्तार विधि में पैकेजिंग के रूप में समाप्त किया, इसलिए (1) मैं एक ही बार में लेबल और रेडियो उत्पन्न कर सकता था और (2) इसलिए मुझे अपनी आईडी निर्दिष्ट करने के लिए उपद्रव नहीं करना पड़ा:

public static class HtmlHelperExtensions
{
    public static MvcHtmlString RadioButtonAndLabelFor<TModel, TProperty>(this HtmlHelper<TModel> self, Expression<Func<TModel, TProperty>> expression, bool value, string labelText)
    {
        // Retrieve the qualified model identifier
        string name = ExpressionHelper.GetExpressionText(expression);
        string fullName = self.ViewContext.ViewData.TemplateInfo.GetFullHtmlFieldName(name);

        // Generate the base ID
        TagBuilder tagBuilder = new TagBuilder("input");
        tagBuilder.GenerateId(fullName);
        string idAttr = tagBuilder.Attributes["id"];

        // Create an ID specific to the boolean direction
        idAttr = String.Format("{0}_{1}", idAttr, value);

        // Create the individual HTML elements, using the generated ID
        MvcHtmlString radioButton = self.RadioButtonFor(expression, value, new { id = idAttr });
        MvcHtmlString label = self.Label(idAttr, labelText);

        return new MvcHtmlString(radioButton.ToHtmlString() + label.ToHtmlString());
    }
}

उपयोग:

@Html.RadioButtonAndLabelFor(m => m.IsMarried, true, "Yes, I am married")
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.