Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
905
Infragistics IGGrid with checkbox
posted

Hi,

I am using Infragistics grid in MVC3. In the Infragistics grid i want a column to have a checkbox and this checkbox is checked based on the data from the database. Could you please guide me how to do with MVC3 razor.

thanks.

 

  • 23953
    Suggested Answer
    Offline posted

    Hello Suresh A,

    If you want to display checkboxes into the column then you can accomplish this through row template. Row template uses jQuery Templates (See http://api.jquery.com/category/plugins/templates/ ) and is enabled by setting "rowTemplate" and "jQueryTemplating" properties in igGrid.

    Here is the example:

    In Aspx:

    [code]

    @(Html.Infragistics().Grid(Model).ID("grid1").RowTemplate("<tr><td>${ProductID}</td><td>${Name}</td><td>${ProductNumber} </td><td><input type='checkbox' {{if IsAvailable}} checked='checked' {{/if}}></td><tr>")

    .JQueryTemplating(true).Height("400").DataSourceUrl(Url.Action("PagingGetData")).DataBind().Render()

    )

    [/code]

    In JS:

    [code]

    var exampleDataSource = [ {"ProductID": "1", "Name": "Product", "ProductNumber": "Art1", "IsAvailable": 1}];

     

    $(window).load(function () {

    $("#grid1").igGrid({

    autoGenerateColumns: false,

    rowTemplate: "<tr><td>${ProductID}</td><td>${Name}</td><td>${ProductNumber} </td><td><input type='checkbox' {{if IsAvailable}} checked='checked' {{/if}}></td><tr>",

    columns: [

    {headerText: "ProductID", key: "ProductID" },

    {headerText: "Name", key: "Name" },

    {headerText: "ProductNumber", key: "ProductNumber" },

    {headerText: "IsAvailable", key: "IsAvailable" }

    ],

    jQueryTemplating: true,

    dataSource: exampleDataSource

    });

     

    });

     [/code]

     

    You can see how to use row template in ASPX and Razor scenario in this sample:

    https://www.igniteui.com/grid/overview

     

    For igGridUpdating we don't have support for checkboxes right now. Available editors are listed in this help topic:

    http://help.infragistics.com/Help/Doc/jQuery/2011.2/CLR4.0/html/igGrid_Updating.html

     

    Hope this helps,

    Martin Pavlov

    Infragistics, Inc.