Ajax data source binding in a partial view

4 posts, 0 answers
  1. Uday
    Uday avatar
    17 posts
    Member since:
    Jun 2014

    Posted 08 Jul 2014 Link to this post

    Hello,

    I am trying to achieve the following scenario. 

    1.) Use enters the search term
    2) Click search button
    3) Loads the Partial View of Results Grid, (Asynchronously loading the results)

    I am able to load data in the using server binding. (Passed all results in the model). I am hard time to achieve the same using Ajax data source binding. The results would load (Ajax Read operation is not invoked on the Grid)

    Below is my partial view 'QueryProspects.cshtml'
    @model string
     
    @(Html.Kendo().Grid<SampleDataSummaryDto>()
                  .Name("Grid")
                  .Columns(columns =>
                  {
                      columns.Bound(l => l.Id).Title("Name");
                      columns.Bound(p => p.CompanyName).Title("Company Name");
                      columns.Bound(p => p.PhoneNumber).Title("Phone");
                      columns.Bound(p => p.EmailAddress).Title("Email");
           
                  })
                  .HtmlAttributes(new { style = "height:450px" })
                  .Scrollable()
                  .DataSource(dataSource => dataSource
                      .Ajax()
                      .Read(read => read.Action("SearchResults_Read", "Prospect", new { SearchText = Model }))
                  )
            )
              public PartialViewResult loadSampleData(string SearchText)
            {
                return PartialView("EditorTemplates/loadSampleData", SearchText);
            }

    public ActionResult SearchResults_Read(string SearchText)
           {
               var results= myService.GetByIdentifiers(SearchText, 20);
               var dsResult = results.ToDataSourceResult(new DataSourceRequest());
               return Json(dsResult);
           }

    I am passing the searchText to partial view and thinking that my Grid view use that search text asynchronously would call 'SearchResults_Read' and passing the SearchText as action param.

    I appreciate any suggestions on why this is not working?

    Thank You,
    Uday

     



  2. Uday
    Uday avatar
    17 posts
    Member since:
    Jun 2014

    Posted 08 Jul 2014 in reply to Uday Link to this post

    I figured it out. I just have to render the Grid on the partial view. Call render method at the end

    For eg:
    @{
           KendoGrid code//
           .Render()
      }


    Thank You,
  3. Eric
    Eric avatar
    2 posts
    Member since:
    Jan 2014

    Posted 09 Mar 2017 in reply to Uday Link to this post

    Uday,

    Can you share sample code? When I add ".Render()", I get the error "Cannot implicitly convert type 'void' to 'object'.

  4. Viktor Tachev
    Admin
    Viktor Tachev avatar
    2497 posts

    Posted 13 Mar 2017 Link to this post

    Hello,

    Note that when you are using Ajax binding the Grid and need to send additional data to an Action you should use the Data() method. Please examine the article below that describes the feature in more detail.


    Please modify your code as suggested in the article and let me know how the behavior changes.


    Regards,
    Viktor Tachev
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top