custom command in kendo grid will not redirect to view

[Paul]

In MVC3 using VS 2010 I used this all the time no problem. You have an order. You want to be able to view the line items. So you click View in the Custom command of the data grid and it redirects you to a view with the line items for that order. I did this all the time with no issues

Problem: MVC4, VS 2012 and IE10.  Same type of thing. Click the button, it calls the Ajax which  calls the proper method in the controller and passes the parameter in but does not return the View.

I assume its a JQueary issue now. I have been pounding my head against the wall for a good day now and getting nowhere.


The View

@(Html.Kendo().Grid(Model).HtmlAttributes(gridAttributes)
    .Name("grid")
    .Columns(columns =>
    {
        columns.Command(command => { command.Edit().CancelText("Cancel"); command.Custom("Select").Click("showFields");}).Width(150);


        columns.Bound(c => c.TableName).Width(200);
        columns.Bound(c => c.FriendlyName).Width(200);
        columns.Bound(c => c.SecurityLevel).Width(125);
        columns.Bound(c => c.CanReportOn).Width(125).ClientTemplate("<input type='checkbox' #= CanReportOn ? checked='checked' : '' # value='#=AdminTableId#' class=\"check_row\"/>");


    })

The Ajax call
BTW, the preventDefault makes no difference. Same result

function showFields(e) {
       // e.preventDefault();
        var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
        var tableName = dataItem.TableName;


        $.ajax({
            url: '@Url.Action("ShowFields", "ProgramManager")',
             type: 'POST',
              data: { tableName: tableName }
          });

    }

The Controller method

public ActionResult ShowFields(string tableName)
{
          var list = appDb.AdminFields.Where(p => p.AdminTableName == tableName);
          var model = new AdminFieldModel
          {
               Fields = list,
               TableName = tableName
           };
          return View(model);
}

[Jayesh Goyani]

Hello,

Not sure this will help or not, but can you please try with below code snippet.

cache: false

http://api.jquery.com/jQuery.ajax/

Thanks,
Jayesh Goyani

[Paul]

Yes I had that in there and it did nothing.

I originally had this and tried every iteration I could think of and it WILL not redirect to the page

$.ajax({
           url: '@Url.Action("ShowFields", "ProgramManager")',
            type: 'POST',
            traditional: true,
            data: { tableName: tableName },
            cache: false

        });

[Paul]

A clue may be that in the browser when I click on the link to see this page I see

http://localhost:10052/ProgramManager/ManageTables

When I click the Select button I would expect to see

http://localhost:10052/ProgramManager/ShowFields#tablename

in the browser window. Instead I see
http://localhost:10052/ProgramManager/ManageTables#

[Paul]

UPDATE
using the custom command on the kendo Grid I used to be able to have something like this.

window.location.href = "/ProgramManager/ShowFields/" + tableName;

and it would pass the value to the controller and redirect. That no longer works. It will redirect the page but will not pass in the value.


This is an Ajax call and will not redirect because it is expecting something back but  it passes in the value to the controller just fine.

var url = "/ProgramManager/ShowFields/" + tableName;

        $.ajax({
            url: url,
            type: 'POST',
            data: {},
            dataType: "html",
            cache: false
        });

So I had to do the following to get the thing to work how I wanted it to.

$.ajax({
       url: '@Url.Action("GetFields", "ProgramManager")',
       type: 'POST',
       traditional: true,
       data: { tableName: tableName },
       success: function (result) {
       if (result.Success) {
             var link = '@Url.Action("ShowFields", "ProgramManager")';
              window.location.href = link;
       }
     }
 });

Back in the controller I have the following.

public ActionResult GetFields(string tableName)
  {
      SessionVariable.TableName = tableName;
      return Json(new
      {
          Message = tableName,
          Success = true
     });
  }

 public ActionResult ShowFields()
 {
    var list = appDb.AdminFields.Where(p => p.AdminTableName == SessionVariable.TableName);
   var table = appDb.AdminTables.First(p => p.TableName == SessionVariable.TableName);

     var model = new AdminFieldModel
     {
         Fields = list,
         TableName = table.TableName,
         FreindlyName = friendlyName
     };

  return View(model);

}

As you can see, in the controller I had to store the value passed in to a session variable which I try to avoid at all costs but unless there is a better way that I am missing I don't see how to do it.

I put a ticket in to kendo and their suggestion was to do the latter option which would not pass in the value. It was always null.

I hope this helps someone, or if I am missing something please enlighten me.

Cheers

[Daniel]

Hello Paul,

What is your route configuration? If you are using the default one then the tableName parameter in the following statement:

window.location.href = "/ProgramManager/ShowFields/" + tableName;

will be bound to a parameter with name id and not tableName:

public ActionResult ShowFields(string id)

Regards,
Daniel
Telerik

[Paul]

Daniel,

Thank you much, that did the trick. It wasn't like that in MVC3 because we didn't touch the default and it worked fine. Anyway, thanks again and I will remember that from now on...what a headache.

Paul