CODEWITHSUNDEEP
javascriptasp.net-mvcinfragisticsignite-uiiggrid
Sox
Sox

Reputation: 61

Obtaining the cell value of a hidden igGrid column

I have an Infragistics grid with the following columns:-

        @(Html.Infragistics().Grid(Model.Rows.AsQueryable())
        .ID("vmClientBankAccounts")
        .Width("100%")
        .Caption("Bank Account List")
        .PrimaryKey("AccountNo")
        .AutoGenerateColumns(false)
        .RowTemplate("<td>${Id}</td><td><a class='accountKey'>${AccountNo}</a></td><td>${Name}</td><td>${AccountType}</td><td>${Status}</td><td>${BranchName}</td><td>${BranchIBT}</td>")
        .Columns(columns =>
            {
                columns.For(x => x.Id).DataType("string").Hidden(true);
                columns.For(x => x.AccountNo).DataType("int").Width("140px");
                columns.For(x => x.Name).DataType("string");
                columns.For(x => x.AccountType).DataType("string").Width("100px");
                columns.For(x => x.Status).DataType("string").Width("110px");
                columns.For(x => x.BranchName).DataType("string").Width("260px");
                columns.For(x => x.BranchIBT).DataType("string").Width("110px");
            })
        .Features(features =>
            {
                features.Paging().PageSize(10).PrevPageLabelText("Previous").NextPageLabelText("Next");
                features.Selection().Mode(SelectionMode.Row).MultipleSelection(false);
            })
        .DataBind()
        .Render()
    )

I have javascript that runs on click of the selected row in the grid as follows:-

<script type="text/javascript">
$(document).ready(function () {

    $('#vmClientBankAccounts td .accountKey').click(function (e) {

        $.ajax({
            type: 'GET',
            url: '/Client/ClientBankAccount',
            data: { bankAccountNo: $(e.target).text() },
            success: function (result) { $('#clientContainer').html(result); }
        });
    });

 });

I need to obtain the cell value of my first column named 'Id' which is a hidden column.

Using the following igGrid methods I am able to get any of the displayed values, but have no idea how to obtain the hidden columns value.

        var rowIndex = $("#vmClientBankAccounts").igGrid("selectedRow").IdCellValue;
        var IdCellValue = $($("#vmClientBankAccounts").igGrid("cellAt", 0, rowIndex)).text();

I would appreciate any assistance in this regard and thank you in advance.

Upvotes: 2

Views: 3655

Answers (2)

Sox
Sox

Reputation: 61

As Petar responded above, this achieves exactly what is required. I made one change to his suggestion by referencing .Records in the last line as follows, as it was returning a null reference without it.

var rowIndex = $("#vmClientBankAccounts").igGrid("selectedRow").index;
var dataSource = $("#vmClientBankAccounts").igGrid("option", "dataSource");
var hiddenIdValue = dataSource.Records[rowIndex].Id;

Upvotes: 2

Petar Ivanov
Petar Ivanov

Reputation: 136

In the igGrid no html is rendered for hidden columns therefore accessing the value can be done through the datasource directly - either by the row index or row Id if available.

For instance, to find the Id value of the selected row in this case, something like the following may be used:

var rowIndex = $("#vmClientBankAccounts").igGrid("selectedRows")[0].index;
var dataSource = $("#vmClientBankAccounts").igGrid("option", "dataSource");
var hiddenIdValue = dataSource[rowIndex].Id;

Upvotes: 2

Related Questions