2009-08-20 10 views
28

मैंने few minutes ago सीखा है कि डेटा विशेषताओं को जोड़ना HTML तत्वों को कस्टम जानकारी जोड़ने का एक अच्छा तरीका है। तो मैंने ऐसा करने की कोशिश की:एएसपी.नेट एमवीसी में एचटीएमएल तत्व में डेटा विशेषताओं को कैसे जोड़ा जाए?

<%= Html.TextBox ("textBox", "Value", new { data-myid = m.ID })%> 

लेकिन यह वाक्यविन्यास त्रुटि के रूप में समाप्त होता है। मैं कस्टम डेटा विशेषताओं को कैसे परिभाषित कर सकता हूं?

संपादित करें:

मुझे लगता है कि मैं का उपयोग कर इस प्रभाव को प्राप्त कर सकते हैं:

<%= Html.TextBox ("textBox", "Value", new Dictionary<string, object> {{ "data-myid", m.ID }})%> 

लेकिन वह नहीं दिखता है ... उम्म ... साफ! क्या ऐसा करने का कोई बेहतर तरीका है?

+0

इस प्रश्न को 'एस्पनेट एमवीसी के साथ हाइफेनेटेड एचटीएमएल विशेषताओं' देखें http://stackoverflow.com/questions/2897733/hyphenated-html-attributes-with-asp-net-mvc/12091886#12091886 –

+0

नोट: नया सही उत्तर http: // stackoverflow है।कॉम/ए/5872576/1037 9 48, यदि आपको स्क्रॉलिंग पसंद नहीं है तो इस पृष्ठ को आगे बढ़ाएं;) – drzaus

उत्तर

103

उपयोग इसे कहते एक को रेखांकित एक पानी का छींटा के बजाय सकता है।

new { data_myid = m.ID }

यह निश्चित रूप से MVC3 में काम करता है (अन्य संस्करणों की जाँच नहीं की है)। जब HTML प्रस्तुत किया जाता है तो अंडरस्कोर को डैश में परिवर्तित कर दिया जाएगा।

+0

धन्यवाद, यह – shatl

+6

काम करता है एमसीसी 4 में भी काम करता है। – Ryan

+3

यह निश्चित रूप से उत्तर चिह्नित किया जाना चाहिए :) – benpage

-2
<%= Html.TextBox ("myTextBox", "", 
     new { @class="redText", title="Enter red text here"})%> 

परिणामों में:

<input type="text" id="myTextBox" class="redText" title="Enter red text here" /> 

मुझे यकीन है कि यह आपकी समस्या नहीं हूँ। आपके अज्ञात प्रकार के संपत्ति नाम में "-" के साथ कुछ करने के लिए हो सकता है।


हाँ, कंपाइलर आपके विशेषता का नाम पसंद नहीं करता है। टिप्पणियों से, एचटीएमएल 5 डेटा-एट्रिब्यूट्स जोड़ने के लिए, आपको शब्दकोश का उपयोग करना होगा या एक और एक्सटेंशन बनाना होगा जो शब्दकोशों के निर्माण को सरल बनाता है।

+0

यह कोड टेक्स्ट बॉक्स पर "डेटा-मायिड" विशेषता को कैसे परिभाषित करता है? – Hemant

+0

आप अपने एचटीएमएल पर एक अवैध विशेषता क्यों डालना चाहते हैं? – Will

+1

संकलक किसी ऑब्जेक्ट कुंजी – redsquare

0

मुझे लगता है कि आपको यह करने के लिए अपना स्वयं का सहायक बनाना होगा। मुझे इसे सीधे देखने में कोई रास्ता नहीं मिल रहा है।

5

मुझे data-myid स्वीकार करने के लिए अज्ञात प्रकार की घोषणा प्राप्त करने का कोई तरीका नहीं दिख रहा है, क्योंकि यह C# में मान्य संपत्ति नाम नहीं है। एक विकल्प के लिए एक नया अधिभार कि एक अतिरिक्त dataAttributes पैरामीटर लेता है, और आप के लिए नामों को data- पहले जोड़ता बनाने के लिए किया जाएगा ...

using System.ComponentModel; 
using System.Web.Mvc; 
using System.Web.Mvc.Html; 
using System.Web.Routing; 

static class TextBoxExtensions 
{ 
    public static string TextBox(this HtmlHelper htmlHelper, string name, object value, object htmlAttributes, object dataAttributes) 
    { 
     RouteValueDictionary attributes = new RouteValueDictionary(htmlAttributes); 
     attributes.AddDataAttributes(dataAttributes); 

     return htmlHelper.TextBox(
      name, 
      value, 
      ((IDictionary<string, object>)attributes); 
    } 

    private static void AddDataAttributes(this RouteValueDictionary dictionary, object values) 
    { 
     if (values != null) 
     { 
      foreach (PropertyDescriptor descriptor in TypeDescriptor.GetProperties(values)) 
      { 
       object obj2 = descriptor.GetValue(values); 
       dictionary.Add("data-" + descriptor.Name, obj2); 
      } 
     } 

    } 
} 

तो फिर तुम

<%= Html.TextBox ("textBox", "Value", 
     new { title = "Some ordinary attribute" }, 
     new { myid = m.ID }) %> 

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

public static IDictionary<string,object> MergeDataAttributes(
    this HtmlHelper htmlHelper, 
    object htmlAttributes, 
    object dataAttributes) 

के तर्क को ले जाकर मिलता है और के रूप में

<%= Html.TextBox ("textBox", "Value", 
     Html.MergeDataAttributes(new { title = "Some ordinary attribute" }, new { myid = m.ID })) %> 
संबंधित मुद्दे