Cancelling grid data read ajax request

6 posts, 1 answers
  1. Shabtai
    Shabtai avatar
    38 posts
    Member since:
    Nov 2012

    Posted 23 Sep 2013 Link to this post

    Hi,

    I'm using Kendo grid within div and while reading data I'm blocking to prevent user activity on it. I need to put long process cancellation button in order to cancel ajax grid request.
    $('#div').block({
    message: '<h1 style="color:blue;">אנא המתן...</h1><br><input type="button" value="CANCEL" onclick="cancelSemHours()"/>'
    });

    On server side I'm supposed to implement following in data read action :
    if (!Response.IsClientConnected)
    {
        Response.End();
    }
    How do I implement the client-side cancellation with kendo grid? (cancelSemHours function) 

    Thank you in advance,
    Waiting for your kind and prompt reply
    Shabtai

  2.
  3. Alexander Popov
    Admin
    Alexander Popov avatar
    1441 posts

    Posted 25 Sep 2013 Link to this post

    Hello Shabtai,

    I would recommend making an Ajax request to the Action that sets the IsClientConnected to false, for example:
    <script>
    function cancelSemHours(){
       $.ajax("SemHours_DisconnectClient");
    }
    </script>

     
    Regards,
    Alexander Popov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  5. Shabtai
    Shabtai avatar
    38 posts
    Member since:
    Nov 2012

    Posted 26 Sep 2013 Link to this post

    Sorry, but Response.IsClientConnected is read-only.

    It should be done using ajax function req.abort() or $.ajaxPrefilter
    but how do I catch request object for my Kendo grid?
  7. Answer
    Alexander Popov
    Admin
    Alexander Popov avatar
    1441 posts

    Posted 30 Sep 2013 Link to this post

    Hello Shabtai,

    Getting the Grid's read request is currently not supported out of the box, however you could intercept the request by attaching a function to the jQuery's ajaxSend event. Here is an example:     
    <script type="text/javascript">
        $(document).ajaxSend(function (event, jqXHR, ajaxOptions) {
            if (ajaxOptions.url == "Path/To/GridReadAction") {
                window._gridXHR = jqXHR;
            }
        });
     
        $(document).ready(function () {
            $("#abort").click(function () {
                window._gridXHR.abort();
            });
        });
     
    </script>
     
    <button id="abort">Abort Ajax Request</button>
     
    @(Html.Kendo().Grid<SomeViewModel>()   
        .Name("grid")
         ...
        .DataSource(dataSource => dataSource
            .Ajax()
            .Read(read => read.Action("GridReadAction", "Grid"))
         )

     
    Regards,
    Alexander Popov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  9. Shabtai
    Shabtai avatar
    38 posts
    Member since:
    Nov 2012

    Posted 01 Oct 2013 Link to this post

    Thank you, your solution worked perfect, but only on client side...

    On server side, after grid read action is called, after cancellation on client side, the process is still working, continuing execution of  stored procedure in DB...
    When I'm trying to go on with other actions from UI, it is stuck (as soon as data read ActionResult is not completed)

    I suppose, there's a solution for cancelling server side action (kendo grid) as well...

    BTW, what am I supposed to return on grid read action on cancellation of action instead of: 
    return Json(dt.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
    ?

    Thanks

  11. Alexander Popov
    Admin
    Alexander Popov avatar
    1441 posts

    Posted 02 Oct 2013 Link to this post

    Hello again,

    This behavior is expected, unless the server-side is configured to process the requests asynchronously. How to do that is not directly related to Kendo UI and is described on various places over the Internet.
    Once the request's abort method is called the browser will disregard its response, so it does not matter what the Action will return.
     
    Regards,
    Alexander Popov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top