Databases
StackOverflow2013
Postsdbo
PO
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Here is a JQuery solution I wrote for 3 cascading drop-downs with ajax callbacks to the controller to fill the next list based on the previous choices. This might get you going in the right direction.</p> <pre><code>Select: &lt;select id="category" style="width: 150px"&gt; &lt;option&gt;&lt;/option&gt; @foreach (string cat in ViewBag.Categories) { &lt;option&gt;@cat&lt;/option&gt; } &lt;/select&gt;&lt;span id="errorforcategory" style="color: red"&gt;&lt;/span&gt; &lt;select id="subcategory1" disabled="disabled" style="width: 150px"&gt;&lt;option&gt;&lt;/option&gt; &lt;/select&gt; &lt;select id="subcategory2" disabled="disabled" style="width: 150px"&gt;&lt;option&gt;&lt;/option&gt;&lt;/select&gt; &lt;script type="text/javascript"&gt; $("#category").change(function () { $("#subcategory1").load('@Url.Action("GetSubCategory")' + "?category=" + $("#category").val()); $('#subcategory2').empty(); $('#subcategory2').append($("&lt;option&gt;&lt;/option&gt;")); $('#subcategory2').attr('disabled', 'disabled'); }).ajaxStop(function () { if ($('#subcategory1 option').size() &gt; 2) { $('#subcategory1').attr('disabled', ''); } else { $('#subcategory1').attr('disabled', 'disabled'); } }); $("#subcategory1").change(function() { if ($("#subcategory1").val().trim()) { $("#subcategory2").load('@Url.Action("GetSubCategory")' + "?category=" + $("#category").val() + "&amp;subcategory=" + $("#subcategory1").val()); } else { $('#subcategory2').empty(); $('#subcategory2').attr('disabled', 'disabled'); } }).ajaxStop(function() { if ($('#subcategory2 option').size() &gt; 2) { $('#subcategory2').attr('disabled', ''); } else { $('#subcategory2').attr('disabled', 'disabled'); } }); </code></pre> <p>And then in your controller you can call your Stored Proc using whatever method you like then build out your result option text.</p> <pre><code>public string GetSubCategory(string category, string subcategory) { string returnval = "&lt;option&gt;&lt;/option&gt;"; if (!string.IsNullOrEmpty(subcategory)) { foreach ( var cat in db.Categories.Where(c =&gt; c.category1 == category &amp;&amp; c.subcategory1 == subcategory) .Select(c =&gt; c.subcategory2) .Distinct()) { if (!string.IsNullOrEmpty(cat.Trim())) returnval += "&lt;option&gt;" + cat + "&lt;/option&gt;"; } return returnval; } return Enumerable.Aggregate(db.Categories.Where(c =&gt; c.category1 == category).Select(c =&gt; c.subcategory1).Distinct().Where(cat =&gt; !string.IsNullOrEmpty(cat.Trim())), returnval, (current, cat) =&gt; current + ("&lt;option&gt;" + cat + "&lt;/option&gt;")); } </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

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