Forums Ignite UI for jQuery
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
Close
Larry LaForge
370
Unable to select one row with igGridSelection and MultipleSelection = false
posted

I am trying to select one row from a igGrid where MultipleSelection = false. iqGridSelection("selectRows") returns a row length of 0. It returns the correct row length when MultipleSelection = true. I need to know how to return the row data (row index and column values) from the grid for a single selection case.

@using Infragistics.Web.Mvc
@model IQueryable<SenarcSystems.VisualDispatch.BusinessObjects.Vendor>

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <!-- Ignite UI Required Combined CSS Files -->
    <link href="~/Content/IgniteUI/css/themes/infragistics/infragistics.theme.css" rel="stylesheet" />
    <link href="~/Content/IgniteUI/css/structure/infragistics.css" rel="stylesheet" />

    <script src="~/Scripts/jquery-1.11.0.js"></script>
    <script src="~/Scripts/jquery-ui-1.10.4.js"></script>
    <script src="~/Scripts/modernizr.min.js"></script>

    <!-- Ignite UI Required Combined JavaScript Files -->
    <script src="~/Scripts/IgniteUI/infragistics.core.js"></script>
    <script src="~/Scripts/IgniteUI/infragistics.lob.js"></script>
    <script src="~/Scripts/IgniteUI/infragistics.dv.js"></script>

    <meta name="viewport" content="width=device-width" />
    <title>VendorIndex</title>

</head>
<body>
    <div>
    @(Html.Infragistics()
        .Grid(Model)
        .ID("grid")
        .Width("100%")
        .Height("500px")
        .PrimaryKey("ID")
        .AutoGenerateColumns(false)
        .AutoGenerateLayouts(true)
        .RenderCheckboxes(true)
        .Columns(column =>
        {
            column.For(x => x.VendName).HeaderText("Vendor Name").Width("30%");
            column.For(x => x.VendStreet1).HeaderText("Street1").Width("30%");
            column.For(x => x.VendStreet2).HeaderText("Street2").Width("20%");
            column.For(x => x.VendPhone).HeaderText("Phone").Width("20%");
        })
        .Features(features =>
            {
             features.Sorting().Type(OpType.Remote);
             features.Paging().Type(OpType.Remote);
             features.Filtering().Type(OpType.Remote);
             features.Selection().Mode(SelectionMode.Row).MultipleSelection(false).Activation(false);
        })
       
        .DataSourceUrl(Url.Action("LoadVendors"))
        .Render()
    )
        </div>
        <div>
            <fieldset id="selectionOptions" class="explorer">
                <legend>Selection</legend>
                <input type="button" id="buttonAddVendor" value="Add" />
                <input type="button" id="buttonEditVendor" value="Edit" />
                <input type="button" id="buttonDeleteVendor" value="Delete" />
           </fieldset>
        </div>

    <script type="text/javascript">
        $("#buttonAddVendor").igButton({
            labelText: $("#buttonAddVendor").val(),
            click: function (event) {
                var rows = $("#grid").igGridSelection("selectedRows");
                $.each(rows, function (i, val) {
                   alert("Row with index " + val.index + " is selected");
                });
            }
        });
    </script>

</body>
</html>

Thanks,

Larry