[Solved] OnCommand event - passing additional data

[Phil]

Hi,

Problem: additional data not being sent to my delete action when added to data collection of OnCommand event argument.

Scenario: I have a grid displaying a List<Project>. My Project class's properties include ID (type guid) and State (type integer). When I click Delete on a row the ID is correctly being sent to my _Delete ajax action.
I also want to send my State integer. It is not being sent to the action despite seemingly following the Telerik method published here: http://www.telerik.com/help/aspnet-mvc/telerik-ui-components-grid-client-api-and-events.html#OnCommand

Here's the relevant snippets from my grid:

.DataBinding(dataBinding => dataBinding

                        .Ajax()

                        .Delete("_Delete", "Project"))

 

…columns.Command(commands =>

                        {

                            commands.Delete()

                                .ButtonType(GridButtonType.Image);

                                                  

                        });

…

.ClientEvents(events => events                      

                        .OnCommand("onCommand")

                                            )

And here's how I'm handling the OnCommand event:

function onCommand(e)

{

    if (e.name == "delete")

    {

        // pass entity state so server action can toggle between Archive / Restore

        e.data = $.extend(e.data, {

        state: e.dataItem.State

        });

    }

}

When i debug I can see the OnCommand event fires and e.Data gets the state correctly added.
However State never reaches the server. Using Fiddler2 to watch the traffic I can see that the id is being sent but my State integer is not.
Am I missing a step. Is Telerik sure that the e.data collection is being included in the ajax call?

Regards

Phil

 

 

 

 

 

[Dadv]

try this :

.DataBinding(dataBinding => dataBinding

                        .Ajax()

                        .Delete("_Delete", "Project", new {State = '<#=State#>'}))

remove 

.ClientEvents(events => events                      

                        .OnCommand("onCommand")

                                            )

I don't thing it is necessary


PS: not sure about the ' ' around the <#= #>, try with and with out

[Phil]

The problem I need to understand is how to add additional data using oncommand event argument.

That might be a fudge for that scenario but i have other scenarios too.

[Dadv]

onCommand is a local event, no call to a controller at this part.

if you want to call a controller when you click a "command" think to use Custom Command

Personally  i use this :
Html.Telerik().Grid<MyModel>().DataKeys(d => { d.Add(a => a.Id).RouteKey("Id"); d.Add(a => a.OrderId).RouteKey("OrderId"); })
...
columns.Command(c => c.Custom("Edit").ButtonType(GridButtonType.BareImage).SendDataKeys(true).SendState(false)
            .Ajax(new AjaxOptions
                    {
                        InsertionMode = InsertionMode.Replace,
                        HttpMethod = "Get",
                        UpdateTargetId = "UpdatePanel",
                        OnBegin = "ShowWaitingBox",
                        OnSuccess = "HideWaitingBox",
                        OnFailure = "ShowErrorBox"
                    })       
 .Action("Action", "Controller").ImageHtmlAttributes(new { @class = "t-icon t-edit" })).IncludeInContextMenu(false).Width(40); 
                    


the extender :



        public static GridCustomActionCommandBuilder<TItem> Ajax<TItem>(this GridCustomActionCommandBuilder<TItem> builder, AjaxOptions options)
            where TItem : class
        {
            return builder.HtmlAttributes(options.ToUnobtrusiveHtmlAttributes());
        }



With that i can send any data to an action and do something with the return values/view/partialview
i don't need the built in update binding (because i want to replace all the grid by the detail view)

otherwise if you want to send something in edit/delete/save you should better use the iodine events :

OnDelete (cancellable) - raised when the user deletes a row
OnEdit - raised when the user edits or inserts a row
OnSave (cancellable) - raised when user saves a row

[Brett]

Phil's question is well written.  I have exactly the same problem - the data is not passed to the server action method.  Note that this only seems to be a problem with the OnCommand() event.  Passing additional data appears to work fine for the OnDataBinding() event.

[Phil]

Hi Brett,

I gave up in the end. I think their documentation is wrong or there is a bug in this area.

I got round it by using a custom command and javascript/jquery:

 

Grid snippets:

…

columns.Command(commands =>

                    {

                        commands.Custom("CustomEdit")

                            .Ajax(true)

                            .ButtonType(GridButtonType.Image);

                        commands.Custom("CustomDelete")

                            .Ajax(true)

                            .ButtonType(GridButtonType.Image);

…

.ClientEvents(events => events

                    …

                    .OnCommand("Grid_OnCommand"))

 

And my event handler:

 

  function Grid_OnCommand(e)

 { 

       if (e.name == "CustomDelete")

        {

            e.preventDefault(); // suppress normal event behaviour

            var dataItem = e.dataItem;

            var guid = dataItem.ProjectGuid;

            var state = dataItem.State;

       

              // call jquery function to do post.

…

…       

}

 

I’ve omitted all the jquery stuff because my code uses quite a few reusable functions in my project’s javascript library (I next pop up confirmation window and then on confirmation do a jquery post to the correct controller action). However it shows the mechanism I’ve used to get around the problem.

Hope this helps. I would not spend any more time trying to get the Telerik method to work. It simply doesn’t. Wasted a lot of time discovering that.

 

Phil

[Brett]

Many thanks.  After seeing your post, I reverted to a server-side workaround, but I certainly appreciate your posting your client-side work-around.