2 grids based on 1st grid selected checkboxes ask stored procedure to populate 2nd grid

4 posts, 0 answers
  1. Gaurav
    Gaurav avatar
    14 posts
    Member since:
    Nov 2014

    Posted 21 Jun Link to this post

     I understand how to pass additional data as a parameter example I am doing this
    .Read(read => read.Action("GetOpenInvoices", "Maint", new { cust = Request.QueryString["cust"] }))
    Is it possible to have Parent/child  or grid/details grid to do without entity framework meaning asking custom stored procedures for the data?
    I have a grid with Invoices. I want user to select multiple checkboxes  and then click the button and based on that 2nd grid gets populated.
    or have a parent grid loaded and based on checkboxes (invoice# which is a string) I click ask stored procedure to get me corresponding comments.
    Initially 2nd grid is empty.
    If you have any example that will be great.
    I want an example without entity framework.
    Please reply if there is any easy solution.

    Thank you,
    Gaurav

  2. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    1746 posts

    Posted 23 Jun Link to this post

    Hello Gaurav,

    There is no need to use the entity framework on the server. In our examples it used with sample purposes since the entity framework is widespread in the .NET community. 

    The Kendo UI Grid for ASP.NET MVC expects a JSON response from the server containing the data and it expects the response to have a specific structure. This is why we suggest using the ToDataSourceResult extension method. 

    Please refer to the Ajax Binding article for a reference. 

    Also 

    Regards,
    Boyan Dimitrov
    Telerik
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. Gaurav
    Gaurav avatar
    14 posts
    Member since:
    Nov 2014

    Posted 23 Jun in reply to Boyan Dimitrov Link to this post

    How to fail the mvc controller on purpose and do nothing

    Controller Method:

            public ActionResult GetCustomerComments([DataSourceRequest] DataSourceRequest request, string invoices)
            {
                if (invoices != "fail")
                {

                List<JNI.Enterprise.Contracts.CustomerComments> customer = InvoiceService.GetCustomerComments(invoices);

                return Json(customer.ToDataSourceResult(request));
                }
                else
                {
                    //do nothing
                }
            }

    I am trying to upgrade the grid using ajax
            $.ajax({
                url: webManager.resolveUrl("~/maint/GetCustomerComments"),
                method: "POST",
                data: { invoices: invoicesList },
                success: function () {
                    var grid = $('#CustomerCommentsGrid').data('kendoGrid');
                    grid.dataSource.read();
                    grid.refresh();
                },
                error: function () {
                    alert('an error occurred');
                }

            });

    But the problem is Grid is called again and I want to stop that.

         @(Html.Kendo().Grid<CustomerComments>()
          .Name("CustomerCommentsGrid")
          .Columns(columns =>
          {
              columns.Bound(i => i.INVOICE).Title("Invoice").Width(15);
              columns.Bound(i => i.Comment).Title("Comment").Width(40);

          }).Pageable(pageable => pageable
              .Refresh(true)
          )
          .Scrollable()
          .Sortable()
          .Filterable()
          .DataSource(dataSource => dataSource
              .Ajax().UseJniErrorHandler()
              .PageSize(10)
                  .Read(read => read.Action("GetCustomerComments", "Maint", new { invoices = "fail" }))
          )
    )

  5. Gaurav
    Gaurav avatar
    14 posts
    Member since:
    Nov 2014

    Posted 23 Jun in reply to Gaurav Link to this post

    I was able to solve my issue using following AJAX
    $.ajax({ url: webManager.resolveUrl("~/maint/GetCustomerComments"), method: "POST", data: { invoices: invoicesList }, success: function (result) {var grid = $("#CustomerCommentsGrid").data("kendoGrid");var dataSource = new kendo.data.DataSource({ data: result.Data}); grid.setDataSource(dataSource); grid.dataSource.read();}, error: function () { alert('an error occurred');}});


    Needed to know how to set datasource for the grid.
Back to Top
UI for ASP.NET MVC is VS 2017 Ready