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

DataGrid Command Buttons Not Working

Thread ID:

Created:

Updated:

Platform:

Replies:

107302 Feb 24,2013 04:45 PM UTC Apr 16,2013 04:00 AM UTC ASP.NET MVC (Classic) 5
loading
Tags: Grid
Eniola Benjamin
Asked On February 24, 2013 04:45 PM UTC

Good day,

I have the following bit of code in a cshtml file.  It renders nicely but I don't seem to have a clue how to the View and Execute buttons to work.

Similar functionality in Telerik looks like this (maybe I am being thrown off because the paradigm is different but I can't figure it out and don't seem to be able to pick anything out from the documentation - possibly looking in the wrong place).

            columns.Command(
                commands =>
                {
                    //commands.Custom("btnCreateTradeOrder")
                    //    .Action(ActionNames.TradeOrderCreate, ControllerNames.Orders)
                    //    .ButtonType(GridButtonType.ImageAndText)
                    //    .SendDataKeys(true)
                    //    .Text("Create");
                    commands.Custom("btnViewClass")
                        .Action(ActionNames.SyncClassView, ControllerNames.Sync)
                        .DataRouteValues(route => route.Add(o => o.Id).RouteKey("id"))
                        .ButtonType(GridButtonType.Text)
                        .Text("View");
                    commands.Custom("btnExecuteClass")
                        .Action(ActionNames.SyncClassExecute, ControllerNames.Sync)
                        .DataRouteValues(route => route.Add(o => o.Id).RouteKey("id"))
                        .ButtonType(GridButtonType.Text)
                        .Text("Execute");
                });

@(Html.Syncfusion().Grid<HydSyncClass>("syncOpsGrid")
	.Datasource(this.Model.Element2)
	.CaptionText("Sync Operations")
	.Caption("Sync Operations")  
	.ShowCaption(true)
	.ShowRowHeader(true)
	.ShowStackedHeader(false)
	.RowsSelectionMode(RowsSelectionMode.Toggle)
	.Filtering(
		settings => settings.AllowFiltering(true).FilterBarMode(FilterBarMode.Immediate)
			.FilterDropDownType(FilterDropDownType.SimpleList)
			.FilterMode(FilterMode.Default)
			.ShowFilterStatusMessage(true)
	)
	.PageSettings(
		settings => settings.AllowPaging(true).PagerPosition(Position.BottomLeft)
			.PagerStyle(PagerStyle.DefaultAndAdvanced).PageSize(25)
	)
	.AllowResizing(true)
	.EnableSorting()            
	.Column(
		col=>
		{
			col.Add(op => op.Id).Format("{0:#,##0}")
				.HeaderText("ClassId")
				.TextAlign(Syncfusion.Mvc.Grid.TextAlignment.Right);
			col.Add(h => h.ClassName)
				.HeaderText("ClassName")
				.TextAlign(Syncfusion.Mvc.Grid.TextAlignment.Center);
			col.Add(h => h.ScheduleLastRunDate).Format("{0:yyyy-MM-dd HH:mm:ss}")
				.HeaderText("ScheduleLastRunDate")
				.TextAlign(Syncfusion.Mvc.Grid.TextAlignment.Center);
			col.Add(h => h.ActualLastRunDate).Format("{0:yyyy-MM-dd HH:mm:ss}")
				.HeaderText("ActualLastRunDate")
				.TextAlign(Syncfusion.Mvc.Grid.TextAlignment.Center);
			
			col.Add(				
					"Commands",
					unboundColumn =>
					{
						unboundColumn.Commands(
							cmd => cmd.Command(CommandTypes.Custom)
									.ItemType(UnBoundItemTypes.Button)
									.ItemOption(UnboundItemOptions.TextOnly)
									.Text("View")
						);
					
						unboundColumn.Commands(
							cmd => cmd.Command(CommandTypes.Custom)
									.ItemType(UnBoundItemTypes.HyperLink)
									.ItemOption(UnboundItemOptions.TextOnly)
									.Text("Execute")
						);
					}
				)
				.AllowEditing(false)
				.AllowFilter(false)
				.AllowGrouping(false)
				.AllowSearching(false)
				.AllowSorting(false)
				.HeaderText("_");
		}
	)
)




Eswari S [Syncfusion]
Replied On February 28, 2013 03:48 AM UTC

Hi Eniola,

 

Thank you for using Syncfusion products.

 

We have provided response to your query in the incident #:104883.Could you please follow up with the above incident for further queries?

 

Please let us know if you have any queries.

 

Regards,

Eswari S


paul jilek
Replied On April 8, 2013 04:56 AM UTC

Hi Eswari
 
Would you please be able to send me the solution also?  I am struggling with the "Mapper" member of commands.  Does this have any relationship with regards to ".Mapper(mapper => mapper.Action".
 
What I am trying to do is have a Custom button in the last column of the grid where once I click onto it, the request will post back to the "CareUsers" controller to the "GetSubscriptions" method with the routing value of "UserId" for that row.
 
Here's my code thus far which is not working:
 

.Column(column =>

{

column.Add(item => item.UserId).HeaderText(

"UserId");

column.Add(item => item.AccountName).HeaderText(

"AccountName");

column.Add(item => item.Name).HeaderText(

"Name");

column.Add(item => item.FirstName).HeaderText(

"FirstName");

column.Add(item => item.Surname).HeaderText(

"Surname");

column.Add(item => item.MailAddress).HeaderText(

"MailAddress");

column.Add(item => item.Deprovisioned).HeaderText(

"Deprovisioned");

column.Add(item => item.Description).HeaderText(

"Description");

column.Add(item => item.Department).HeaderText(

"Department");

column.Add(item => item.Location).HeaderText(

"Location");

column.Add(

"Manage", col => col.Commands(cmd => cmd.Command(CommandTypes.Custom)

.Text(

"Subscriptions")

.ItemType(

UnBoundItemTypes.Button)

.ItemOption(

UnboundItemOptions.TextOnly)

.Mapper(

"GetSubscriptions")

)

)

.TextAlign(

TextAlignment.Center)

.AllowSearching(

false)

.AllowFilter(

false)

.AllowEditing(

false)

.UnBound(

true).Width(110);

}

)

.Mappers(mapper => mapper.Action(

"GetSubscriptions", new { id = "${UserId}" }))

.Editing(edit => edit.PrimaryKey(key => key.Add(p => p.UserId)))

Thanks

Paul

 


Eswari S [Syncfusion]
Replied On April 9, 2013 01:04 PM UTC

Hi Paul,

 

Thank you for using Syncfusion products.

 

# Grid Mapper actions are used as the mapper for Paging/Sorting/Editing operations. Please refer to the following code snippets:

 

@{

        Html.Syncfusion().Grid<Student>("Simple_Grid")

       . .. 

      .Mappers(map =>

      {

          map.Action(“Index”) //used as the mapper for Grid Post action for Paging/Sorting, etc.

              .InsertAction("AddOrder")   //used as the mapper for inserting records

              .SaveAction("OrderSave")//used as the mapper for saving edited records

              .DeleteAction("DeleteOrder");//used as the mapper for deleting records

      })}

 

# Unbound column mappers are used to map some specific actions other than default editing actions. Please refer to the following code snippets:

@(Html.Syncfusion().Grid<EditableOrder>("JSONCRUD")

.ActionMode(ActionMode.JSON)

.Column(column => {

column.Add("Commands",

unboundColumn =>{unboundColumn.Commands(cmd => cmd.Command(CommandTypes.Custom)

.Mapper("ViewDetails?Orderid=${OrderID}"));});});

For example to retrieve the value of a selected record and view it by custom you can send a ajax post to action method defined in mapper by using $.ajax and in its success action you can retrieve the JSON data returned from action method. You can now process this data according to your need and display it. In order to retrieve the JSON data from action method call args.eventArgs.preventDefault() method at the end of OnCustomUnboundCellClickHandler event. Please refer below code snippet for further details.

[ cshtml ]

@(Html.Syncfusion().Grid<EditableOrder>("JSONCRUD")

.ActionMode(ActionMode.JSON)

.Column(column => {

column.Add("Commands",

unboundColumn =>{unboundColumn.Commands(cmd => cmd.Command(CommandTypes.Custom)

.ItemType(UnBoundItemTypes.Button)

.ItemOption(UnboundItemOptions.TextOnly)

.Mapper("ViewDetails?Orderid=${OrderID}")

.Text("View")

);

});

});

.ClientSideEvents(eve => eve.OnCustomUnboundCellClickHandler("CustomHandler"))

<script type="text/javascript">

function CustomHandler(sender, args) {

$.ajax({

type: 'POST',

url: args.eventArgs.target.rel='nofollow' href,

success: function (data) {

alert(data.OrderDetails.OrderID);

}

});

args.eventArgs.preventDefault();

}

</script>

[ Controller ]

[AcceptVerbs(HttpVerbs.Post)]

public ActionResult ViewDetails(int? Orderid)

{

var data = OrderRepository.GetAllRecords().Where(ord => ord.OrderID == Orderid).FirstOrDefault();

return Json(new { OrderDetails = data });

}

For your convenience we have prepared a sample for the above scenario and it is attached below. Please refer to it.

http://www.syncfusion.com/downloads/Support/DirectTrac/104883/Cusom%20command-2004641397.zip

 

Please try this and let us know if you have any queries.

 

Regards,

Eswari S


paul jilek
Replied On April 16, 2013 03:33 AM UTC

Hi Eswari
 
Thank you for the example.  I have now go it all working.
 
Cheers
 
Paul

Eswari S [Syncfusion]
Replied On April 16, 2013 04:00 AM UTC

Hi Paul,

 

Thanks for the update.

 

Happy to hear that you have everything working . Do not hesitate to update if you have any questions.

 

Regards,

Eswari.S


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

;