populate grid dynamically?

6 posts, 0 answers
  1. Joel
    Joel avatar
    9 posts
    Member since:
    Sep 2011

    Posted 23 Jul 2012 Link to this post

    Hi Guys!  I am new Asp.net MVC and KendoUI.... can you help me on how populate the grid dynamically? or for example if have to pick in a combobox, it will display the data according to the selected item???

    Thank you very much! God bless

  2. Mohammed
    Mohammed avatar
    1 posts
    Member since:
    Apr 2012

    Posted 24 Jul 2012 Link to this post


    1) in the read declaration
    Read("action","controller").data("getid")

    2)function getid(){
    return {id:ddlselect.value()};
    }

    3)client side bind a select event to ddlselect(combobox or drop down list)

    4)in the select event
    grid.dataSource.read();

  3. Joel
    Joel avatar
    9 posts
    Member since:
    Sep 2011

    Posted 24 Jul 2012 Link to this post

    Hi Mohammed!

    Thank you very much for the help.  But I still don't know how to apply the method... here is my code



    @(Html.Kendo().ComboBox()
            .Name("combobox")
            .DataTextField("Text")
            .DataValueField("Value")
            .BindTo(new List<SelectListItem>()
            {
                new SelectListItem() {
                    Text = "THEREAL 2010", Value = "THEREAL2010"  
                },
                new SelectListItem() {
                    Text = "THEREAL 2011", Value = "THEREAL2011"  
                }
               
            })
            .SelectedIndex(0)
            .Events(e => e.Select("select")
           ))
          
          
     
        
        @(Html.Kendo().Grid(Model)    
        .Name("Grid")
        .Columns(columns =>
        {
            columns.Bound(p => p.BLLHDBILLNO);
            columns.Bound(p => p.BLLHDSUBCODE);
        })
        .Groupable()
        .Pageable()
        .Sortable()
        .Scrollable()
        .Filterable()
        .DataSource(dataSource => dataSource
            .Ajax()
            .Read(read => read.Action("Bills_Read", "Home")
             .Data("getid")
            
           
            )
            
        )
    )
      

    <script>

        function getid() {
            return {
                bllhdsubcode: $.get("#combobox.value")
            };
        }

    </script>
             
    <script>
       
        function select(e) {

            var dataItem = this.dataItem(e.item.index());
            return dataItem.Value;
           
            }
        
    </script>
     

  4. Joel
    Joel avatar
    9 posts
    Member since:
    Sep 2011

    Posted 24 Jul 2012 Link to this post

    I got it work Mohammed... Thanks a lot!

  5. Gopi
    Gopi avatar
    3 posts
    Member since:
    Sep 2012

    Posted 15 Oct 2012 Link to this post

    Hi Mohammaed , I am trying to work on the same functionality if you have example could you please send me , we also bought the kendo ui , my name is registed with controls , please help me quickly

  6. Gopi
    Gopi avatar
    3 posts
    Member since:
    Sep 2012

    Posted 15 Oct 2012 Link to this post

    i followed your suggestion

    1. controller side :

      Added read method :   read( ([DataSourceRequest] DataSourceRequest reuestt , string  BusinessTypeID)

     
    2. trying to pass this variable from grid to read method on selection change even of the dropdownlist

    .DataSource(dataSource => dataSource
            .Ajax()
            .Read(read => read.Action("Read", "Company")
                .Data("additionalData")
            )
           

    3.  function additionalData() {       
            return { BusinessTypeID: $.get("#BusinessTypes.value") };


    4.  function select(e) {
            var dataItem = this.dataItem(e.item.index());
            return dataItem.Value;
        };

    Please update me where i am missing , it erroring at javasript leavel.

Back to Top