This is a migrated thread and some comments may be shown as answers.

Ajax connected grid - Posting without postback

2 Answers 109 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Emil
Top achievements
Rank 1
Emil asked on 25 May 2016, 02:54 PM

I have an ajax connected grid, and I have a button thats a submit button, when I click it it posts the page and the searchstring I have in a textbox.

This is fine and works, I was just wondering if and how I can with jquery get the button to get ajax to fetch the data for the grid? I would like that to happen without a postback if possible, and it should since its an ajax grid.

any ideas ?

 

Regards,

Emil

 

2 Answers, 1 is accepted

Sort by
0
Accepted
Stephen
Top achievements
Rank 2
answered on 25 May 2016, 05:36 PM

Something along the lines of this should get you going(not a complete code sample):

@(Html.Kendo().Button()
    .Name("button")
    .Content("Refresh grid")
    .HtmlAttributes( new {type = "button"} )
    .Events(ev => ev.Click("onClick")))
 
@(Html.Kendo().TextBox()
    .Name("searchString")
 )
 
@(Html.Kendo().Grid...
    .Name("grid")

 

    .DataSource(ds => ...
        .Read(read => read.Action("Grid_Read", "Controller").Data("gridData"))
        ...
    )
)
 
<script>
function onClick() {
    $("#grid").getKendoGrid().dataSource.read();
}
 
function gridData() {
    return {
        searchString: $("#searchString").val()
    };
}
</script>

The key is the Data() method of the Read() Action().

Everytime the grid performs a read, the JS function gridData() is called where you simply return an object that contains the extra data you want to the send to the read action in addition to the request data that the grid always sends.

If your grid read action has a string parameter named searchString, it will contain the value from gridData() which you can use however you need to filter the results before passing them back to the grid.

 

 

0
Emil
Top achievements
Rank 1
answered on 26 May 2016, 08:52 AM

I just needed : $("#grid").getKendoGrid().dataSource.read();

in the onclick event on my button.

thank you

 

Tags
Grid
Asked by
Emil
Top achievements
Rank 1
Answers by
Stephen
Top achievements
Rank 2
Emil
Top achievements
Rank 1
Share this question
or