सशर्त HTML रेजर MVC3 का उपयोग करने में भाग लेता है

100

चर strCSSClass में अक्सर एक मूल्य होता है लेकिन कभी-कभी खाली होता है।

मैं इस इनपुट तत्व के HTML में एक खाली वर्ग = "" को शामिल नहीं करना चाहता, जिसका अर्थ है कि अगर strSSSSass खाली है, तो मैं कक्षा = विशेषता बिल्कुल नहीं चाहता।

निम्नलिखित सशर्त HTML विशेषता करने का एक तरीका है:

<input type="text" id="@strElementID" @(CSSClass.IsEmpty() ? "" : "class=" + strCSSClass) />

क्या ऐसा करने का अधिक सुरुचिपूर्ण तरीका है? विशेष रूप से एक जहां मैं उसी सिंटैक्स का पालन कर सकता हूं जैसा कि तत्व के अन्य भागों में उपयोग किया जाता है: वर्ग = "@ strCSSClass"?

html asp.net-mvc-3 razor

— tony722
स्रोत

जवाबों:

160

आपने रेजर, पीएम फॉर रेजर, लेकिन रेजर 2 (वेब पेज 2 और एमवीसी 4) में इसे नहीं सुना है, हमारे पास रेजर में निर्मित सशर्त गुण होंगे (जैसा कि एमवीसी 4 आरसी सफलतापूर्वक परीक्षण किया गया है), इसलिए आप बस कह सकते हैं इस तरह की बातें ...

<input type="text" id="@strElementID" class="@strCSSClass" />

यदि strCSSClass शून्य है, तो वर्ग विशेषता बिल्कुल प्रस्तुत नहीं करेगी।

SSSHHH ... बताओ मत। :)

— एरिक पोर्टर
स्रोत

हाँ, आप निश्चित रूप से जवाब के रूप में मेरा स्वीकार नहीं करना चाहिए। उस ने कहा, आज ऐसा करने का कोई क्लीनर तरीका नहीं है (इसलिए हम इसे करने के लिए एक क्लीनर तरीका बना रहे हैं)। संभवत: इसे करने का सबसे साफ तरीका Html.TextBox का उपयोग करना है, लेकिन इसके लिए कम वांछनीय चीजों का एक अलग सेट है। :( खुशी है कि आप क्या हम हालांकि जोड़ रहे हैं की तरह है। :)

— एरिक पोर्टर

लेकिन मैं अन्य पाठ के साथ रेजर विशेषताओं को कैसे संयोजित कर सकता हूं? मुझे निम्नलिखित बनाने की आवश्यकता है: ... id = "track_@track.ID"। मुझे कुछ पसंद आया है ... id = "track_2", लेकिन इसने निम्न आउटपुट उत्पन्न किया: ... id = "track_@track.ID" ...

— लाससन

आप रेज़र को कोड को उसके चारों ओर लगाकर मूल्यांकन करने के लिए बाध्य कर सकते हैं। आईडी = "ट्रैक _ @ (ट्रैक.आईडी)"

— एरिक पोर्टर

जोड़ा गया नोट एमवीसी 4 के साथ इस काम को सफलतापूर्वक इंगित करता है। यदि आप एमवीसी 3 पर हैं तो नीचे मेरा जवाब देखें।

— एरोनल्स

@ErikPorter कृपया मेरे HTML के साथ मेल न करें !! यह भी देखें stackoverflow.com/questions/9234467/… यह अन्य बुरे व्यवहार के लिए है

— eaglestorm

126

ध्यान दें कि आप ऐसा कुछ कर सकते हैं (कम से कम MVC3 में):

<td align="left" @(isOddRow ? "class=TopBorder" : "style=border:0px") >

मेरा मानना है कि रेजर जोड़ने वाले उद्धरण वास्तव में ब्राउज़र थे। जैसा कि MVC 4 के साथ परीक्षण करते समय रिस्म ने बताया (मैंने MVC 3 के साथ परीक्षण नहीं किया है, लेकिन मुझे लगता है कि व्यवहार में कोई बदलाव नहीं हुआ है), यह वास्तव में उत्पादन करता है class=TopBorderलेकिन ब्राउज़र इस जुर्माना को पार्स करने में सक्षम हैं। HTML पार्सर्स लापता विशेषता उद्धरण पर कुछ क्षमा कर रहे हैं, लेकिन अगर आपके पास स्थान या कुछ वर्ण हैं तो यह टूट सकता है ।

<td align="left" class="TopBorder" >

या

<td align="left" style="border:0px" >

अपने स्वयं के उद्धरण प्रदान करने में क्या गलत है

यदि आप नेस्टेड उद्धरणों के लिए कुछ सामान्य सी # सम्मेलनों का उपयोग करने की कोशिश करते हैं, तो आप अधिक उद्धरणों के साथ समाप्त हो जाएंगे क्योंकि आपने रेजर को सुरक्षित रूप से बचने की कोशिश कर रहे हैं। उदाहरण के लिए:

<button type="button" @(true ? "style=\"border:0px\"" : string.Empty)>

यह मूल्यांकन करना चाहिए<button type="button" style="border:0px"> लेकिन रेजर C # से सभी आउटपुट से बच जाता है और इस प्रकार उत्पादन करता है:

style=&quot;border:0px&quot;

आप इसे केवल तभी देखेंगे जब आप नेटवर्क पर प्रतिक्रिया देखेंगे। यदि आप एक HTML इंस्पेक्टर का उपयोग करते हैं, तो अक्सर आप वास्तव में DOM देख रहे होते हैं, कच्चा HTML नहीं। ब्राउज़रों HTML को DOM में पार्स करते हैं, और बाद में DOM प्रतिनिधित्व को पार्स करने के बाद पहले से ही कुछ बारीकियों को लागू किया जाता है। इस स्थिति में ब्राउज़र देखता है कि विशेषता मान के आसपास उद्धरण नहीं हैं, उन्हें जोड़ता है:

style="&quot;border:0px&quot;"

लेकिन DOM इंस्पेक्टर में HTML कैरेक्टर कोड ठीक से प्रदर्शित होते हैं इसलिए आप वास्तव में देखते हैं:

style=""border:0px""

Chrome में, यदि आप HTML को राइट-क्लिक करते हैं और Edit HTML का चयन करते हैं, तो वह वापस स्विच हो जाता है ताकि आप उन गंदे HTML कैरेक्टर कोड को देख सकें, जिससे यह स्पष्ट हो सकता है कि आपके पास वास्तविक बाहरी उद्धरण हैं, और HTML इनर कोटेड हैं।

तो खुद को रेजर करने की कोशिश के साथ समस्या रेजर इन से बच जाता है।

यदि आप उद्धरणों का पूर्ण नियंत्रण चाहते हैं

उद्धरण से बचने के लिए Html.Raw का उपयोग करें:

<td @Html.Raw( someBoolean ? "rel='tooltip' data-container='.drillDown a'" : "" )>

निम्नानुसार रेंडर करें:

<td rel='tooltip' title='Drilldown' data-container='.drillDown a'>

उपरोक्त पूरी तरह से सुरक्षित है क्योंकि मैं किसी भी HTML को एक चर से आउटपुट नहीं कर रहा हूं। शामिल केवल चर ही टर्नेरी स्थिति है। हालाँकि, सावधान रहें कि यह अंतिम तकनीक आपको कुछ सुरक्षा समस्याओं के लिए उजागर कर सकती है यदि उपयोगकर्ता द्वारा दिए गए डेटा से तार का निर्माण किया जाए। उदाहरण के लिए, यदि आपने डेटा फ़ील्ड से एक विशेषता का निर्माण किया है जो उपयोगकर्ता द्वारा दिए गए डेटा, Html.Raw के उपयोग से उत्पन्न हुआ है, तो इसका मतलब है कि स्ट्रिंग में विशेषता और टैग का समय से पहले अंत हो सकता है, फिर एक स्क्रिप्ट टैग शुरू करें जो वर्तमान में लॉग इन की ओर से कुछ करता है। उपयोगकर्ता (संभवतः लॉग इन उपयोगकर्ता से भिन्न)। हो सकता है कि आपके पास सभी उपयोगकर्ताओं के चित्रों की सूची वाला एक पृष्ठ हो और आप प्रत्येक व्यक्ति का उपयोगकर्ता नाम होने के लिए टूलटिप सेट कर रहे हों, और सभी उपयोगकर्ता स्वयं'/><script>$.post('changepassword.php?password=123')</script> और अब कोई भी अन्य उपयोगकर्ता जो इस पृष्ठ को देखता है, उनका पासवर्ड तुरंत पासवर्ड में बदल जाता है जिसे दुर्भावनापूर्ण उपयोगकर्ता जानता है।

— AaronLS
स्रोत

यह एक बहुत अच्छी बात है! और वास्तव में, यह ज्यादातर स्थितियों में इसे पठनीय और उपयोगी बनाता है।

— दिमित्रो शेवचेंको

मैं अपने प्रश्न में उदाहरण में यही कर रहा था। अधिक विस्तृत विवरण और उदाहरण के लिए धन्यवाद। :)

— tony722

रिक्त स्थान से सावधान रहें। "शैली = प्रदर्शन: कोई नहीं;"

— रेंडरर्स एनी नो

तो यह काम फिर से क्यों नहीं होता है: जादू दोहरा उद्धरण <span @ (सच? "वर्ग = लोगो-स्वामी": string.Empty) /> यह सिर्फ <span class = logo-owner />

— rism

@AaronLS हाँ, ठीक यही है कि वे कैसे हैं। खिचड़ी भाषा समझती है कि कैसे ब्राउज़र (क्रोम 40 / FF33.1 / IE 10) कुछ भी प्रभावित करेगा क्योंकि यह सर्वर जनरेट किया गया मार्कअप है और यदि ऐसा है तो केवल उन दो वर्ग विशेषताओं को कैसे प्राप्त करें, लेकिन पूछो बटन के वर्ग विशेषता या यहां तक कि टाइप के लिए नहीं = "बटन" सभी तीन बटन की विशेषताएँ। निश्चित रूप से एक सर्वर की बात IMHO क्योंकि मैं भी एक ही परिणाम IE / फ़ायरफ़ॉक्स / क्रोम के लिए दुनिया भर में आवंटित Azure आभासी मशीनों के एक जोड़े में RDP कर सकते हैं।

— ३

मुझे लगता है कि थोड़ा और अधिक सुविधाजनक और संरचित तरीका एचटीएमएल हेल्पर का उपयोग करना है। आपके विचार में इसे ऐसे देखा जा सकता है:

@{
 var htmlAttr = new Dictionary<string, object>();
 htmlAttr.Add("id", strElementId);
 if (!CSSClass.IsEmpty())
 {
   htmlAttr.Add("class", strCSSClass);
 }
}

@* ... *@

@Html.TextBox("somename", "", htmlAttr)

अगर यह तरीका आपके लिए उपयोगी होगा, तो मैं आपको htmlAttrअपने मॉडल में शब्दकोश को परिभाषित करने की सलाह देता हूं, ताकि आपके विचार में किसी @{ }तर्क ब्लॉक की आवश्यकता न हो (अधिक स्पष्ट हो)।

— Yaschur
स्रोत

-1, कभी किसी को विचारों में तर्क रखने की सलाह नहीं देते। The विचार केवल प्रतिपादन के लिए जिम्मेदार होना चाहिए। इसके बजाय एक HtmlHelper उदाहरण जोड़ें और मैं आपको +1 दूंगा।

— jgauffin

चीजों को देखने के लिए मैं कोड ब्लॉक का उपयोग कर सकता हूं - यह अधिक तेज है। और मेरी सिफारिश इस ब्लॉक को मॉडल में स्थानांतरित करने की थी।

— यशचूर

हां, लेकिन जवाबों को सबसे अच्छा अभ्यास दिखाना चाहिए न कि त्वरित और गंदे संस्करण जो कोड रखरखाव को एक बुरा सपना बनाता है।

— jgauffin

@jgauffin मुझे लगता है कि यहाँ Html हेल्पर अनावश्यक है। मेरा जवाब देखिए।

— gdoron

+1 @Yaschur आपका उत्तर प्रेरणादायक है। अच्छा काम करते रहें। अर्थात। C # स्पष्ट रूपांतरण सुविधा के साथ, हम इस उत्तर को और भी अधिक बढ़ा सकते हैं। सभी कोड को एक निश्चित तरीके से आकार नहीं देना था। हमेशा एक बेहतर तरीका है जिसके बारे में हम नहीं जानते हैं। और कुछ परियोजना कोड संगठन के पक्ष में हैं। कोड संगठन अभ्यास से हैं अवधारणाएं नहीं!

— बाँस