Note that there are some explanatory texts on larger screens.

plurals
  1. POHow do I get jQuery to select elements with a . (period) in their ID?
    text
    copied!<p>Given the following classes and controller action method:</p> <pre><code>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 }; } </code></pre> <p>And the following form:</p> <pre><code>&lt;form method="post"&gt; School: &lt;%= Html.TextBox("Name") %&gt;&lt;br /&gt; Street: &lt;%= Html.TextBox("Address.Street") %&gt;&lt;br /&gt; City: &lt;%= Html.TextBox("Address.City") %&gt;&lt;br /&gt; Zip Code: &lt;%= Html.TextBox("Address.ZipCode") %&gt;&lt;br /&gt; Sate: &lt;select id="Address.State"&gt;&lt;/select&gt;&lt;br /&gt; Country: &lt;select id="Address.Country"&gt;&lt;/select&gt;&lt;br /&gt; &lt;/form&gt; </code></pre> <p>I am able to update both the School instance and the Address member of the school. This is quite nice! Thank you ASP.NET MVC team!</p> <p>However, how do I use jQuery to select the drop down list so that I can pre-fill it? I realize that I could do this server side but there will be other dynamic elements on the page that affect the list.</p> <p>The following is what I have so far, and it does not work as the selectors don't seem to match the IDs:</p> <pre><code>$(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); }); }); }); </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload