कैसे मैं एक साथ तत्वों का चयन करने के लिए jQuery मिलता है (अवधि) उनकी आईडी में?


172

निम्नलिखित वर्गों और नियंत्रक कार्रवाई विधि को देखते हुए:

public School
{
  public Int32 ID { get; set; }
  publig String Name { get; set; }
  public Address Address { get; set; }
}

public class Address
{
  public string Street1 { get; set; }
  public string City { get; set; }
  public String ZipCode { get; set; }
  public String State { get; set; }
  public String Country { get; set; }
}

[Authorize(Roles = "SchoolEditor")]
[AcceptVerbs(HttpVerbs.Post)]
public SchoolResponse Edit(Int32 id, FormCollection form)
{
  School school = GetSchoolFromRepository(id);

  UpdateModel(school, form);

  return new SchoolResponse() { School = school };
}

और निम्न रूप:

<form method="post">
  School: <%= Html.TextBox("Name") %><br />
  Street: <%= Html.TextBox("Address.Street") %><br />
  City:  <%= Html.TextBox("Address.City") %><br />
  Zip Code: <%= Html.TextBox("Address.ZipCode") %><br />
  Sate: <select id="Address.State"></select><br />
  Country: <select id="Address.Country"></select><br />
</form>

मैं स्कूल के उदाहरण और स्कूल के पते के सदस्य दोनों को अपडेट करने में सक्षम हूं। यह काफी अच्छा है! ASP.NET MVC टीम को धन्यवाद!

हालाँकि, मैं ड्रॉप डाउन सूची का चयन करने के लिए jQuery का उपयोग कैसे करूं ताकि मैं इसे पूर्व-भरण कर सकूं? मुझे एहसास है कि मैं इस सर्वर की ओर कर सकता हूं लेकिन सूची को प्रभावित करने वाले पृष्ठ पर अन्य गतिशील तत्व होंगे।

निम्नलिखित वह है जो मेरे पास अभी तक है, और यह काम नहीं करता है क्योंकि चयनकर्ता आईडी से मेल नहीं खाते हैं:

$(function() {
  $.getJSON("/Location/GetCountryList", null, function(data) {
    $("#Address.Country").fillSelect(data);
  });
  $("#Address.Country").change(function() {
    $.getJSON("/Location/GetRegionsForCountry", { country: $(this).val() }, function(data) {
      $("#Address.State").fillSelect(data);
    });
  });
});

जवाबों:


293

से Google समूह :

प्रत्येक विशेष वर्ण से पहले दो बैकस्लैश का उपयोग करें।

एक jQuery चयनकर्ता में एक बैकस्लैश अगले चरित्र से बच जाता है। लेकिन आपको उनमें से दो की आवश्यकता है क्योंकि बैकस्लैश जावास्क्रिप्ट स्ट्रिंग्स के लिए भागने का पात्र भी है। पहला बैकस्लैश दूसरे से बच जाता है, जिससे आप अपनी स्ट्रिंग में एक वास्तविक बैकस्लैश देते हैं - जो तब jQuery के लिए अगले चरित्र से बच जाता है।

इसलिए, मुझे लगता है कि आप देख रहे हैं

$(function() {
  $.getJSON("/Location/GetCountryList", null, function(data) {
    $("#Address\\.Country").fillSelect(data);
  });
  $("#Address\\.Country").change(function() {
    $.getJSON("/Location/GetRegionsForCountry", { country: $(this).val() }, function(data) {
      $("#Address\\.State").fillSelect(data);
    });
  });
});

यह भी देखें कि मैं एक आईडी द्वारा एक तत्व का चयन कैसे करता हूं जिसमें सीएसएस संकेतन में उपयोग किए गए वर्ण हैं? jQuery के अकसर किये गए सवाल पर।


4
मुझे आश्चर्य है कि डेवलपर को ऐसा करने के लिए युक्तिकरण की आवश्यकता क्या है, ऐसा लगता है कि jQuery के भीतर सांख्यिकी का एक सरल सेट इस समस्या को हल करेगा, क्योंकि आईडी में पीरियड के साथ कुछ भी गलत नहीं है ...
जेसन बंटिंग

5
यदि आपको बचना नहीं था, तो आप आईडी एड्रेस और क्लास स्टेट के साथ एक तत्व को कैसे क्वेरी करेंगे (यदि आप जानते हैं कि आईडी आपको क्लास निर्दिष्ट करके बहुत कुछ नहीं जोड़ रहा है, लेकिन यह अभी भी मान्य होना चाहिए, मैं। सोच)?
bdukes

12
उस कारण से, सीएसएस में ही, आपको एक आईडी में भी डॉट से बचना चाहिए। सभी jQuery आपको सीएसएस द्वारा निर्धारित नियमों का पालन करने की आवश्यकता है।
bdukes

6
आप आईडी के बजाय नाम से भी चयन कर सकते हैं। उदाहरण के लिए, $ ('[नाम = "
पता.काउंट्री

25

यदि आईडी में रिक्त स्थान हैं, तो आप jQuery आईडी चयनकर्ता का उपयोग नहीं कर सकते। एक विशेषता चयनकर्ता का उपयोग करें:

$('[id=foo bar]').show();

यदि संभव हो, तो तत्व प्रकार भी निर्दिष्ट करें:

$('div[id=foo bar]').show();

मैं इसे भागने के पात्रों का उपयोग करने की तुलना में इस तरह से करना पसंद करता हूं .... स्पष्ट रूप से सबसे अच्छा समाधान आईडी में अवधि का उपयोग नहीं करना है।
गॉर्डन बी.बी. 13'10

आईडी की अनुमति नहीं है, HTML5 वर्णों की अधिक उदार स्वीकृति में भी नहीं है। stackoverflow.com/questions/70579/…
Jay Blanchard

यह सच है, लेकिन 90 के दशक में तैनात एक खराब लिखित वेब ऐप में खिड़की की ड्रेसिंग को जोड़ने से अटकने वाले गरीब के लिए उन्हें अनुमति नहीं है या नहीं।
इलियट नेल्सन

4
काम करने के लिए क्वेट होना चाहिए: `$ (" div [id = '"+ चर +" "]") `या` $ ("div [id =' foo bar ']") `
olga

जैसा कि @olga ने कहा, जवाब किसी भी अधिक कानूनी नहीं है। विशेष रूप से, आपको एक त्रुटि संदेश मिलेगा "अनकवर्ड एरर: सिंटैक्स त्रुटि, अपरिचित अभिव्यक्ति: div [id = foo bar]"
जेम्स मूर

13

यह Jquery के लिए बच:

function escapeSelector(s){
    return s.replace( /(:|\.|\[|\])/g, "\\$1" );
}

उपयोग उदाहरण:

e.find('option[value='+escapeSelector(val)+']')

अधिक जानकारी यहाँ


2
JQuery डॉक्स के अनुसार समाधान केवल एक "\" (स्लैश) जोड़ रहा है। चेतावनी (escapeSelector ( "some.id")); कुछ \ .id के रूप में आउटपुट करेगा। इसलिए मुझे लगता है कि रिप्जेक्स की जगह s.replace (/(:pg\.pg पर करना चाहिए था।
अरुण

मेरे पास एक ही मुद्दा है, कोई और इसे क्यों नहीं देखता है?
TruthOf42

9

ASP.NET MVC का रिलीज़ कैंडिडेट जो अभी इस मुद्दे को तय किया गया था, अब यह ID विशेषता के लिए अंडरस्कोर के साथ डॉट्स को बदलता है।

<%= Html.TextBox("Person.FirstName") %>

को सौंपता है

<input type="text" name="Person.FirstName" id="Person_FirstName" />

अधिक जानकारी के लिए, रिलीज़ नोट्स देखें, पृष्ठ 14 पर शुरू।


1
मैं यह देखने में विफल हूं कि यह "फिक्स" कैसे है - ASP.NET MVC को आईडी को कुछ jQuery की जरूरतों के लिए क्यों बदलना चाहिए? मुझे लगता है कि jQuery वह जगह है जहां समस्या निहित है, ए का उपयोग नहीं। एक आईडी में।
जेसन बंटिंग

7
वर्गों को पहचानने / संयोजन करने के लिए सीएसएस में डॉट का विशेष अर्थ है, यही वजह है कि एक आईडी में यह परेशानी है। "समस्या" jquery के साथ नहीं है।
फनका

4

यह jQuery के चयनकर्ताओं डॉक्स में प्रलेखित है :

मेटा-वर्ण (जैसे कि के किसी भी उपयोग करने के लिए !"#$%&'()*+,./:;<=>?@[\]^`{|}~) एक नाम का एक शाब्दिक भाग के रूप में, यह दो बैकस्लैश के साथ के साथ भाग जाना चाहिए: \\। उदाहरण के लिए, एक तत्व id="foo.bar", चयनकर्ता का उपयोग कर सकता है $("#foo\\.bar")

संक्षेप में, उपसर्ग .के साथ \\इस प्रकार है:

$("#Address\\.Country")

.मेरी आईडी में काम क्यों नहीं करता है ?

समस्या यह है कि .इसका विशेष महत्व है, कक्षा चयनकर्ता के रूप में निम्नलिखित स्ट्रिंग की व्याख्या की गई है। इसलिए$('#Address.Country') मैच होगा <div id="Address" class="Country">

जब बच जाता है \\., तो डॉट को सामान्य पाठ के रूप में माना जाता है जिसका कोई विशेष महत्व नहीं है, जिस आईडी की आप इच्छा करते हैं<div id="Address.Country">

यह उन सभी पात्रों पर लागू होता है !"#$%&'()*+,./:;<=>?@[\]^`{|}~जो अन्यथा jQuery में चयनकर्ता के रूप में विशेष महत्व रखते हैं। बस बहाना है\\ उन्हें सामान्य पाठ के रूप में का करें।

क्यों २ \\ ?

जैसा कि bdukes उत्तर में उल्लेख किया गया है, एक कारण है कि हमें 2 \वर्णों की आवश्यकता है । \जावास्क्रिप्ट में निम्नलिखित चरित्र से बच जाएगा। सी जब जावास्क्रिप्ट स्ट्रिंग की व्याख्या करता है "#Address\.Country", तो यह देखेंगे \, इसका मतलब यह है कि निम्नलिखित चरित्र को लिटरली ले लें और स्ट्रिंग को तर्क के रूप में पारित होने पर हटा दें$() । इसका मतलब है कि jQuery अभी भी स्ट्रिंग को देखेगा"#Address.Country"

यहीं से दूसरा \खेलने आता है। पहला जावास्क्रिप्ट को दूसरे को शाब्दिक (गैर-विशेष) चरित्र के रूप में व्याख्या करने के लिए कहता है। इसका मतलब है कि दूसरा jQuery द्वारा देखा जाएगा और यह समझेगा कि निम्नलिखित . चरित्र एक शाब्दिक चरित्र है।

ओह! हो सकता है कि हम इसकी कल्पना कर सकें।

//    Javascript, the following \ is not special.
//         | 
//         |
//         v    
$("#Address\\.Country");
//          ^ 
//          |
//          |
//      jQuery, the following . is not special.

2

दो बैकस्लैश का उपयोग करना ठीक है, यह काम करता है। लेकिन यदि आप एक गतिशील नाम का उपयोग कर रहे हैं, तो मेरा मतलब है, एक चर नाम, आपको वर्णों को बदलने की आवश्यकता होगी।

यदि आप ऐसा करने के लिए अपने चर नाम बदलने के लिए wan wt नहीं करते हैं:

var variable="namewith.andother";    
var jqueryObj = $(document.getElementById(variable));

और आपके पास आपकी jquery वस्तु है।


0

बस अतिरिक्त जानकारी: इस ASP.NET MVC समस्या # 2403 की जाँच करें

जब तक समस्या ठीक नहीं हो जाती, तब तक मैं अपने स्वयं के एक्सटेंशन के तरीकों जैसे कि Html.TextBoxFixed, आदि का उपयोग करता हूं, जो बस आईडी विशेषता में अंडरस्कोर के साथ डॉट्स को प्रतिस्थापित करता है (नाम विशेषता में नहीं), ताकि आप $ ("# Address_Street") जैसे jquery का उपयोग करें लेकिन सर्वर पर, यह Address.Street की तरह है।

नमूना कोड इस प्रकार है:

public static string TextBoxFixed(this HtmlHelper html, string name, string value)
{
    return html.TextBox(name, value, GetIdAttributeObject(name));
}

public static string TextBoxFixed(this HtmlHelper html, string name, string value, object htmlAttributes)
{
    return html.TextBox(name, value, GetIdAttributeObject(name, htmlAttributes));
}

private static IDictionary<string, object> GetIdAttributeObject(string name)
{
    Dictionary<string, object> list = new Dictionary<string, object>(1);
    list["id"] = name.Replace('.', '_');
    return list;
}

private static IDictionary<string, object> GetIdAttributeObject(string name, object baseObject)
{
    Dictionary<string, object> list = new Dictionary<string, object>();
    list.LoadFrom(baseObject);
    list["id"] = name.Replace('.', '_');
    return list;
}

1
उपरोक्त मुद्दे से: "UpdateModel () एक डॉट का उपयोग करता है क्योंकि यह है कि फॉर्म तत्व कैसे आते हैं। फॉर्म तत्व एक डॉट का उपयोग करते हैं, क्योंकि यह है कि वे HTML सहायक कॉल में निर्दिष्ट कैसे हैं। HTML हेल्पर कॉल एक डॉट का उपयोग करते हैं क्योंकि यह कैसे है ViewData.Eval () काम करता है। अंत में, ViewData.Eval () एक डॉट का उपयोग करता है, क्योंकि यह कैसे एक वस्तु और उसकी संपत्ति को मुख्य .NET फ्रेमवर्क भाषाओं में अलग करता है। इस श्रृंखला में किसी भी बिंदु पर एक डॉट के अलावा अन्य सीमांकक का उपयोग करना टूट जाएगा। संपूर्ण श्रृंखला के लिए प्रवाह। "
सिमोन_वेर

0

मैंने jquery डॉक्स द्वारा दिए गए समाधान के साथ समस्या को हल किया

मेरा कार्य:

//funcion to replace special chars in ID of  HTML tag

function jq(myid){


//return "#" + myid.replace( /(:|\.|\[|\]|,)/g, "\\$1" );
return myid.replace( /(:|\.|\[|\]|,)/g, "\\$1" );


}

नोट: मैं "#" को हटा देता हूं क्योंकि मेरे कोड में मैं आईडी को किसी अन्य पाठ के साथ मिलाता हूं

फ़ॉन्ट: Jquery डॉक्स विशिष्ट वर्णों के साथ तत्व का चयन करते हैं

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.