Databases
StackOverflow2013
Postsdbo
POUpdating Data in Table from AJAX Call
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POUpdating Data in Table from AJAX Call
    primarykey
    data
    text
    <p><strong>EDIT: OK, so I got it to call the Partial View _GridView by changing my return statement to <code>return PartialView("_GridView", model);</code> but it won't update the table with my data. I've traced it and it it's sending the correct model and iterating through the table with the correct data and the AJAX call is successful, but the data is still the same data. Any ideas anyone?</strong></p> <p>I have two partial views in a view. One that has a few dropdownlists that I'm using as filters and the other is a table that displays database info:</p> <p>My View:</p> <pre><code>@model IEnumerable&lt;PPL.Models.GridPart&gt; @{ ViewBag.Title = "Index"; } &lt;h2&gt;Index&lt;/h2&gt; &lt;div id="dropDownsDiv"&gt; @Html.Partial("_DropDownsView", Model) &lt;/div&gt; &lt;div id="theGrid"&gt; @Html.Partial("_GridView", Model) &lt;/div&gt; </code></pre> <p>Partial View _GridView:</p> <pre><code>@model IEnumerable&lt;PPL.Models.GridPart&gt; @{ ViewBag.Title = "_GridView"; } &lt;div id="theGrid"&gt; &lt;table&gt; &lt;tr&gt; &lt;th&gt; @Html.DisplayNameFor(model =&gt; model.Category) &lt;/th&gt; &lt;th&gt; @Html.DisplayNameFor(model =&gt; model.Type) &lt;/th&gt; &lt;th&gt; @*@Html.DisplayNameFor(model =&gt; model.PartNum)*@ Part # &lt;/th&gt; &lt;th&gt; @Html.DisplayNameFor(model =&gt; model.Status) &lt;/th&gt; &lt;th&gt; @Html.DisplayNameFor(model =&gt; model.REL) &lt;/th&gt; &lt;/tr&gt; @foreach (var item in Model) { &lt;tr&gt; &lt;td&gt; @Html.DisplayFor(modelItem =&gt; item.Category) &lt;/td&gt; &lt;td&gt; @Html.DisplayFor(modelItem =&gt; item.Type) &lt;/td&gt; &lt;td&gt; @Html.DisplayFor(modelItem =&gt; item.PartNum) &lt;/td&gt; &lt;td bgcolor="#@Html.DisplayFor(modelItem =&gt; item.StatusColor)"&gt; @Html.DisplayFor(modelItem =&gt; item.Status) &lt;/td&gt; &lt;td bgcolor="#@Html.DisplayFor(modelItem =&gt; item.RELColor)"&gt; @Html.DisplayFor(modelItem =&gt; item.REL) &lt;/td&gt; &lt;/tr&gt; } &lt;/table&gt; </code></pre> <p>Partial View _DropDownsView:</p> <pre><code>@{ ViewBag.Title = "_DropDownsView"; } &lt;script src="~/Scripts/jquery-1.8.2.min.js"&gt;&lt;/script&gt; &lt;script src="~/Scripts/jquery.unobtrusive-ajax.min.js"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; // assuming you're using jQuery $(document).ready(function () { $("#Categories").change(function () { //alert("I'm here!"); //Update typeDropDown $.ajax({ url: '/Part/Myajaxcall', type: 'POST', datatype: 'json', data: { id: $("#Categories").val() }, success: function (data) { $('#typeDropDown option[value!="0"]').remove() $.each(data, function (i, item) { $('#typeDropDown').append('&lt;option value="' + item.DescriptorID + '"&gt;' + item.pplType + '&lt;/option&gt;'); }); }, error: function(jqXHR, textStatus, errorThrown){ alert(errorThrown); } }); //Update Data Grid $.ajax({ url: '/Part/updateGrid', type: 'POST', datatype: 'json', data: { id: $("#Categories").val() }, success: function (data) { alert("Got it!"); }, error: function (jqXHR, textStatus, errorThrown) { alert(errorThrown); } }); }); }); &lt;/script&gt; Category: @Html.DropDownList("Categories", " ") Type: &lt;select id="typeDropDown"&gt;&lt;option value="0"&gt;&lt;/option&gt;&lt;/select&gt; Manufacturer: @Html.DropDownList("Manufacturers", " ") </code></pre> <p>What I'm trying to accomplish is when an item is selected from the Categories drop down list, I want to first update the second drop down list via AJAX (which is working) and next, I want to update the table with my data.</p> <p>Here's my Controller:</p> <pre><code>public class PartController : Controller { private PartContext db = new PartContext(); // // GET: /Part/ public ActionResult Index() { //Use LINQ to query DB &amp; Get all of the parts //Join PPLPart &amp; PPLDescriptor Tables var myParts = from p in db.Parts join d in db.Descriptors on p.DescriptorID equals d.DescriptorID select new { Category = d.DescriptorDesc, TypeCol = p.PPLType, PartNumber = p.PartNum, Status = p.PPLStatus, StatusColor = p.PPLStatusBGColor, REL = p.RELStatus, RELColor = p.RELStatusBGColor }; //Drop the parts into a List List&lt;GridPart&gt; pl = new List&lt;GridPart&gt;(); foreach (var m in myParts) { GridPart gp = new GridPart(); gp.Category = m.Category; gp.Type = m.TypeCol; gp.PartNum = m.PartNumber; gp.Status = m.Status; gp.StatusColor = m.StatusColor; gp.REL = m.REL; gp.RELColor = m.RELColor; pl.Add(gp); } var model = pl; //Pass info for Categories drop-down ViewBag.Categories = new SelectList(db.Descriptors, "DescriptorID", "DescriptorDesc"); //Pass info for Manufacturer drop-down ViewBag.Manufacturers = new SelectList(db.Manufacturers, "ManufacturerID", "ManufacturerName"); //Pass off to View return View(model); } [HttpPost] public ActionResult updateGrid(string id) { int intID = Convert.ToInt32(id); //Use LINQ to query DB &amp; Get all of the parts //Join PPLPart &amp; PPLDescriptor Tables var myParts = from p in db.Parts join d in db.Descriptors on p.DescriptorID equals d.DescriptorID where d.DescriptorID == intID select new { Category = d.DescriptorDesc, TypeCol = p.PPLType, PartNumber = p.PartNum, Status = p.PPLStatus, StatusColor = p.PPLStatusBGColor, REL = p.RELStatus, RELColor = p.RELStatusBGColor }; //Drop the parts into a List List&lt;GridPart&gt; pl = new List&lt;GridPart&gt;(); foreach (var m in myParts) { GridPart gp = new GridPart(); gp.Category = m.Category; gp.Type = m.TypeCol; gp.PartNum = m.PartNumber; gp.Status = m.Status; gp.StatusColor = m.StatusColor; gp.REL = m.REL; gp.RELColor = m.RELColor; pl.Add(gp); } var model = pl; return PartialView(model); } [HttpPost] public JsonResult Myajaxcall(string id) { int intID = Convert.ToInt32(id); var types = from c in db.Types where c.DescriptorID == intID select new { did = c.DescriptorID, pType = c.pplType }; List&lt;PPLType&gt; typesList = new List&lt;PPLType&gt;(); foreach (var t in types) { PPLType p = new PPLType(); p.DescriptorID = t.did; p.pplType = t.pType; typesList.Add(p); } //string command = "EXEC dbo.pr_PPLDescriptor_list"; //List&lt;int&gt; results = db.Database.SqlQuery(int, command, null); return Json(typesList, JsonRequestBehavior.AllowGet); } } </code></pre> <p>Any help would be greatly appreciated.</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. UStereško
    1. USDavidB
    plurals
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. COAre you filtering the grid on both category and type, or just category?
      singulars
      1. POUpdating Data in Table from AJAX Call
      1. USJAKEtheJAB
    2. COFor now, just category
      singulars
      1. POUpdating Data in Table from AJAX Call
      1. USDavidB
    3. COI'm pretty sure my problem is return PartialView(model); in the Contorller's updateGrid. It's not passing the model over to the partial view.
      singulars
      1. POUpdating Data in Table from AJAX Call
      1. USDavidB
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

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