Telerik MVC Grid Refresh with jQuery Function

Question

Hi I have a two MVC Telerik Grids Showing up in one View.

Each Grid has a Custom Column with Edit Link

When User Clicks Edit Link a dialog-model will popup with a form and after user hits save button. Below Script will run

 function OpenStopForm() {

    $("#dialog:ui-dialog").dialog("destroy");
    $("#dialog-model").dialog({
        height: 220,
        width: 340,
        modal: true,
        buttons: {
            "Save": function () {
                var note = $('textarea[name=StopNote]').val();
                $.ajax({
                    type: "POST",
                    url: "/Medication/StopMedication",
                    data: { ID: pid, StopNote: note },
                    dataType: "json",
                    success: refreshGrid()
                });
                $(this).dialog("close");
            },
            Cancel: function () {
                $(this).dialog("close");
            }
        }
    });

}

after above function successfully runs,
I want the Two telerik Grids to refresh with some sort of ajax call.
i though of calling a function like this
success: refreshGrid

function refreshGrid() {
     $('#CurrentMedication').data('t-grid').ajaxRequest();
}

But refreshGrid function is being called before my Controller action is performed.
I want this function to be called after my controller action is complete.

I am not sure if my syntax is correct!.

I tried to do something from here

Can any one help me how to call the refreshgrid function upon success on ajax Post. Also please correct me with my function to refresh the grid.

HaBo · Accepted Answer · 2011-10-25 19:25:35Z

10

I have modified my ajax call as below

  $.ajax({
                type: "POST",
                url: "/Medication/StopMedication",
                data: { ID: pid, StopNote: note },
                dataType: "text",
                success: function (data) {
                refreshGrid();
                }
          })

My refresh Grid goes like this

function refreshGrid() {
$(".t-grid .t-refresh").trigger('click');
}

answered Oct 25, 2011 at 19:25

HaBo

14.4k39 gold badges120 silver badges217 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Robb Sadler Over a year ago

the telerik grid has the option to let you put a refresh button at the top and bottom. If you have both enabled, then you will get two refresh calls per grid. I have only one grid, but needed this functionality and solved it by using the first object found: $(".t-grid .t-refresh").first().trigger('click'); This way the grid will get refreshed once instead of twice. However, if you have two grids (as OP does) then you would have to further qualify the selector. This answer was a key to getting my page running though. Thanks!

Maerlyn · Accepted Answer · 2014-10-02 14:33:10Z

0

If some one looking for this, there is a small change refresh should be called like

$(".k-grid .k-pager-refresh").trigger('click');

edited Oct 2, 2014 at 14:33

Maerlyn

34.2k18 gold badges99 silver badges89 bronze badges

answered Oct 2, 2014 at 14:11

premson baby

1

Collectives™ on Stack Overflow

Telerik MVC Grid Refresh with jQuery Function

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related