We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Column Template in MVC Grid

Thread ID:

Created:

Updated:

Platform:

Replies:

110851 Aug 28,2013 12:13 AM UTC Apr 30,2015 12:53 PM UTC ASP.NET MVC (Classic) 5
loading
Tags: Grid
Kevin Nichols
Asked On August 28, 2013 12:13 AM UTC

Hello,
 
Im having an issue with a grid which can contain two custom buttons in one column.  These are populated using a template and events are hooked via jquery.  These work fine until I page up.  Once paging is performed the buttons no longer work on any page.  Any help would be appreciated.
 
Index.cshtml
 

@(Html.Syncfusion().Grid<Itron.Oracle.Manufacturing.QCApproval.Models.

PalletState>("Grid")

.Datasource(Model.Pallets)

.Mappers(map => map.Action(

"Paging", new { Makeby = @Model.MakeBy }))

.AllowSelection(

false)

.Column(column =>

{

column.Add(

"Actions").TemplateColumn(true).TemplateName("ApproveTemplate").HeaderText("").Width(170);

column.Add(p => p.Number).HeaderText(

"Pallet").Width(50);

column.Add(p => p.QCApprovalStatus).HeaderText(

"QC Status");

column.Add(p => p.BackflushStatus).HeaderText(

"Backflush");

})

.PageSettings(page =>

{

page.AllowPaging(

true);

page.PageSize(6);

})

.AutoFormat(@ViewBag.CurrentTheme)

)

app.js

$(document).ready(

function () {

$(

".reject").click(function () {

alert(

"Reject Clicked");

var pallet = $(this).attr("value");

alert(

"Reject Pallet: " + pallet);

RejectPallet(pallet);

});

$(

".approve").click(function () {

alert(

"Approve Clicked");

var pallet = $(this).attr("value");

alert(

"Accept Pallet: " + pallet);

AcceptPallet(pallet);

});

});

 

 

ApproveTemplate:

@model Itron.Oracle.Manufacturing.QCApproval.Models.

PalletState

 

@

if(Model.QCApproved == true)

{

<button value="@Model.Number" class="reject sf-button Sandune background">Reject</button>

}

else

if (Model.QCApproved == false)

{

<button value="@Model.Number" class="approve sf-button Sandune background">Approve</button>

}

else

{

<button value="@Model.Number" class="reject sf-button Sandune background">Reject</button>

<button value="@Model.Number" class="approve sf-button Sandune background">Approve</button>

}


Kevin Nichols
Replied On August 28, 2013 12:42 AM UTC

Nevermind, figured it out.  Maybe it will help someone else though.  When attaching events you need to use the live so that you can select object now and future as in page 1 and further pages. 
 

$(

".approve").live("click", function () {

alert(

"Approve Clicked");

var pallet = $(this).attr("value");

alert(

"Accept Pallet: " + pallet);

AcceptPallet(pallet);

});


Eswari S [Syncfusion]
Replied On September 3, 2013 05:30 AM UTC

Hi Kevin,

 

Thank you for using Syncfusion products.

 

We are happy to hear that your issue has been resolved.

 

Please let us know if you need any further assistance.

 

Regards,

Eswari S

 

 


Miguel Gordon
Replied On April 29, 2015 02:19 PM UTC

Hey Kevin, came across your post and I'm hoping you can help me. 

Based on your post, it seems that you were using a cshtml as your template for the grid column. Is that the case?

Miguel Gordon
Replied On April 29, 2015 02:21 PM UTC

The better question to ask is, what is "ApproveTemplate"?

Kavitha Narayanan [Syncfusion]
Replied On April 30, 2015 12:53 PM UTC

Hi Miguel,

Thank you for using Syncfusion products.

Query # Based on your post, it seems that you were using a cshtml as your template for the grid column. Is that the case? & The better question to ask is, what is "ApproveTemplate"?

We have prepared the sample based on your requirement using TemplateColumn. Please refer to the following Sample and code snippets:

[Cshtml]

@{ Html.Syncfusion().Grid<Sample.Models.Order>("SampleGrid")

.Datasource(Model)

.Caption("Orders")

.Column(col =>

{

. .. .

col.Add("Button").TemplateColumn(true).TemplateName("TemplateColumn"); // here “TemplateColumn” is the partial view to load custom contents to columns

})

.PageSettings(page=>{

page.PageSize(8);

})

.EnablePaging()

.EnableSorting()

.EnableGrouping()

.EnableFiltering()

.Render();

}

[TemplateColumn.cshtml]

<input type="image" value="submit" src="" alt="Edit Button" style="width:30px;height:30px;background-color:Blue"/>

Also , we request you to check the following online sample and UG link:

Sample link:Sample.zip

Online Sample: http://mvc.syncfusion.com/demos/ui/grid/Templates/ServerMode

UG link: http://help.syncfusion.com/ug/asp.net%20mvc/index.html#!Documents/servermode14.htm

Please let us know if you need any further assistance.

Regards,

kavithan N.



CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;