Friday, 15 March 2013

Asp.net MVC WebGrid in partial view not updating through Ajax -



Asp.net MVC WebGrid in partial view not updating through Ajax -

i have 2 webgrids each in different partial view, displaying on view page. working fine when sorting or pagination on webgrid, it's not updating through ajax. doing wrong?

partialview1:

<%@ command language="c#" inherits="system.web.mvc.viewusercontrol<ienumerable<crmevent.models.crm.databaseentities.crm_request>>" %> <% var grid1var = new webgrid(source: model, defaultsort: "id", fieldnameprefix: "grid1", cansort: true, ajaxupdatecontainerid: "div1", canpage: true, rowsperpage: 5);%> <div id="div1"> <%=grid1var.gethtml(htmlattributes: new { id = "grid1" }, tablestyle: "gridtable", headerstyle: "gridheader", footerstyle: "gridfooter", columns: grid1var.columns( grid1var.column(columnname: "id", header: "id", cansort: true), grid1var.column(columnname: "request_for_id", header: "request for", cansort: true), grid1var.column(columnname: "date_created", header: "date", cansort: true, format: item => item.date_created.tostring("dd-mm-yyyy")) ))%> </div>

partialview2

<%@ command language="c#" inherits="system.web.mvc.viewusercontrol<ienumerable<crmevent.models.crm.databaseentities.crm_request>>" %> <% var grid2var = new webgrid(source: model, defaultsort: "id", fieldnameprefix: "grid2", cansort: true, ajaxupdatecontainerid: "div2", canpage: true, rowsperpage: 5);%> <div id="div2"> <%=grid2var.gethtml(htmlattributes: new { id = "grid2" }, tablestyle: "gridtable", headerstyle: "gridheader", footerstyle: "gridfooter", columns: grid2var.columns( grid2var.column(columnname: "id", header: "id", cansort: true), grid2var.column(columnname: "request_for_id", header: "request for", cansort: true), grid2var.column(columnname: "date_created", header: "date", cansort: true, format: item => item.date_created.tostring("dd-mm-yyyy")) ))%> </div>

mainpage:

<%@ page title="" language="c#" masterpagefile="~/views/shared/site.master" inherits="system.web.mvc.viewpage<crmevent.models.crm.databaseentities.crm_request>" %> <asp:content id="head" contentplaceholderid="headcontent" runat="server"> <link href="../../content/styles/dashboard.css" rel="stylesheet" type="text/css" /> <script src="../../scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script> </asp:content> <asp:content id="main" contentplaceholderid="maincontent" runat="server"> <%using (html.beginform("action", "dashboard", formmethod.post)){ %> <div id="maindashboarddiv"> <div class="livetile"> <div id="prioritydiv1"> <%html.renderaction("recentrequests", model); %> </div> <!--end of prioritydiv1 --> <div id="prioritydiv2"> <%html.renderaction("priorityrequests", model); %> </div> <!--end of prioritydiv2 --> </div> <!--end of livetile --> </div><!--end of maindashboarddiv --> <%} %> </asp:content>

master page head tag content:

<head id="head" runat="server"> <title><asp:contentplaceholder id="titlecontent" runat="server" /></title> <link href="../../content/site.css" rel="stylesheet" type="text/css" /> <script src="<%: url.content("~/scripts/jquery-1.9.1.min.js") %>" type="text/javascript"></script> <script src="<%: url.content("~/scripts/modernizr-1.7.min.js") %>" type="text/javascript"></script> <asp:contentplaceholder id="headcontent" runat="server"> </asp:contentplaceholder> <link href="../../content/menu.css" rel="stylesheet" type="text/css" /> <script src="../../scripts/jquery.js" type="text/javascript"></script> <script src="../../scripts/menu.js" type="text/javascript"></script> </head>

also when check console through firebug, saw error while sorting , pagination: error is:

typeerror: $(...).parent(...).delegate not function

on code:

$(containerid).parent().delegate(containerid + ' a[data-swhglnk="true"]', 'click', function()

above code generated webgrid dynamically. not writing it.

if webgrid it's including jquery , referencing jquery jquery defined twice. explain error:

$(containerid).parent().delegate(containerid + ' a[data-swhglnk="true"]', 'click', function()

disable link in webpage , should work. if need work jquery 1.9+ , webgrid using older version of jquery replace newer one.

possible error if webgrid not compatible jquery 1.9+, leave comment more help.

hint: check generated html multiple jquery includes.

ajax asp.net-mvc-3 jquery webgrid

No comments:

Post a Comment