Databases
StackOverflow2013
Postsdbo
POJSON not fired the event on MVC 4
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POJSON not fired the event on MVC 4
    text
    copied!<p>I need to do cascading on the 2 dropdown with JSON, after I applied the code, the JSON should query my data on subcategory dropdown after I select on the Category dropdown. But nothing happen. </p> <p>Did I do something wrong in my code?</p> <p><strong>Controller :</strong></p> <pre><code>public ActionResult Create() { ViewBag.Category = ads.Categories.ToList(); ViewBag.SubCategory = ads.SubCategories.ToList(); return View(); } private IList&lt;SubCategory&gt; GetSubCategory(int id_category) { return ads.SubCategories.Where(m =&gt; m.id_category == id_category).ToList(); } [AcceptVerbs(HttpVerbs.Get)] public JsonResult LoadSubcategoryByCategory(string id_category) { var SubCategoryList = this.GetSubCategory(Convert.ToInt32(id_category)); var SubCategoryData = SubCategoryList.Select(m =&gt; new SelectListItem() { Text = m.name.ToString(), Value = m.id.ToString() }); return Json(SubCategoryData, JsonRequestBehavior.AllowGet); } </code></pre> <p><strong>View :</strong></p> <pre><code>&lt;script type="text/javascript"&gt; $(document).ready(function () { $("#ddlCategory").change(function () { var category_id = $(this).val(); $.getJSON("../Ads/LoadSubcategoryByCategory", { id_category: category_id }, function (SubCategoryData) { var select = $("#ddlSubCategory"); select.empty(); select.append($('&lt;option/&gt;', { value: 0, text: "-Select a SubCategory-" })); $.each(SubCategoryData, function (index, itemData) { alert(SubCategoryData); select.append($('&lt;option/&gt;', { value: itemData.Value, text: itemData.Text })); }); }); }); &lt;/script&gt; &lt;div class="editor-label"&gt; Category : &lt;/div&gt; &lt;div class="drop-down"&gt; @Html.DropDownListFor(Model =&gt; Model.id_category, new SelectList(ViewBag.Category as System.Collections.IEnumerable, "id", "name"), "-Choose Category-", new { id = "ddlCategory" }) &lt;/div&gt; &lt;div class="editor-label"&gt; Subcategory : &lt;/div&gt; &lt;div class="drop-down"&gt; @Html.DropDownListFor(Model =&gt; Model.id_subcategory, new SelectList(Enumerable.Empty&lt;SelectListItem&gt;(), "id", "name"), "-Choose SubCategory-", new { id = "ddlSubCategory" }) &lt;/div&gt; </code></pre> <p>Hopefully someone can help me. </p> <hr> <p><strong>UPDATE</strong></p> <p>In my console firefox shows </p> <p><code>[10:24:59.464] ReferenceError: $ is not defined @ http://localhost:63280/Ads/Create:29</code></p> <p><code>[10:25:03.565] Use of getPreventDefault() is deprecated. Use defaultPrevented instead. @ http://localhost:63280/Scripts/jquery-1.7.1.js:3446</code></p> <p><code>[10:25:08.284] Use of attributes' specified attribute is deprecated. It always returns true. @ http://localhost:63280/Scripts/jquery-1.7.1.js:2378</code></p>
 

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