Checkbox C1GridView 2025v2 399

Posted by: enrique.pv-ext on 28 May 2026, 6:25 am EST

  • Posted 28 May 2026, 6:25 am EST

    Hi,

    Migrate from 2010v1 to 2025v2 399 in ASP.NET WebForms NET Framework 4.8.1.

    Using C1GridView from C1.Web.Wijmo.Controls.48.dll

    Legacy code:

                        <C1GridView:C1GridView ID="PartialWithdrawGrid" runat="server"
                            AutogenerateColumns="False"
                            EmptyDataText="El operador elegido no ha hecho retiradas parciales"
                            DataKeyNames="ShiftNumber,PlaceId,DateTime,ManuallyAdded,BEGIN_DATE_TIME_SHIFT,OPERATOR_ID"
                            CellPadding="2"
                            OnGroupAggregate="PartialWithdrawGrid_GroupAggregate"
                            Width="100%">
                            <rowheader></rowheader>
                            <Columns>
                                <C1GridView:C1TemplateField Visible="False">
                                    <GroupInfo FooterText="Total:" Position="Footer">
                                        <footerstyle backcolor="#0050A6" forecolor="White" font-bold="True" />
                                        <headerstyle backcolor="#0050A6" />
                                    </GroupInfo>
                                    <ItemStyle Width="0px" />
                                </C1GridView:C1TemplateField>
                                <C1GridView:C1TemplateField HeaderText="" Visible="true">
                                    <HeaderTemplate>
                                        <asp:CheckBox type="CheckBox" ID="CheckBoxHeader" AutoPostBack="true" Checked="true" onclick="javascript:SelectedOrUnSelectedChecked(this);" runat="server" />
                                    </HeaderTemplate>
                                    <ItemTemplate>
                                        <asp:CheckBox ID="CheckBoxGrid" runat="server" Checked="true" AutoPostBack="true" CausesValidation="false" />
                                        <asp:HiddenField ID="HiddenValue" runat="server" Value='<%# Bind("AMOUNT") %>' />
                                    </ItemTemplate>
    
    ...
                                <C1GridView:C1TemplateField HeaderText="Peajista" Visible="true">
                                    <ItemTemplate>
                                        <div style="text-align: left;">
                                            <asp:Label ID="lblCashier" runat="server" Text='<%# Bind("Collector") %>'></asp:Label>
                                        </div>
                                    </ItemTemplate>
                                </C1GridView:C1TemplateField>
                                <C1GridView:C1BoundField DataField="AMOUNT"
                                    DataFormatString="c0" Aggregate="Custom"
                                    HeaderText="Cantidad" NullDisplayText="0,00">
                                    <ItemStyle HorizontalAlign="Right" />
                                </C1GridView:C1BoundField>
                            </Columns>
    

    CheckBoxHeader clicks SelectedOrUnSelectedChecked javascript:

                                            function SelectedOrUnSelectedChecked(objRef) {
    
                                                var checkHeader = document.getElementById("ContentPlaceHolder1_PartialWithdrawGrid_CheckBoxHeader");
                                                //debugger;
                                                var GridView = $find("<%= PartialWithdrawGrid.ClientID %>");
                                                var Rows = GridView.get_rows();
                                                var numRows = Rows.get_length();
    
                                                var count = 0;
                                                for (count = 0; count < numRows; count++) {
                                                    var check = document.getElementById("ContentPlaceHolder1_PartialWithdrawGrid_CheckBoxGrid_" + count);
    
                                                    if (check != null) {
                                                        check.checked = checkHeader.checked;
                                                    }
                                                }
                                            }
    

    any suggestions for legacy code:

       var Rows = GridView.get_rows();
       var numRows = Rows.get_length();

    thanks at all

  • Posted 1 June 2026, 4:51 am EST

    Hello Enrique,

    In the new version, you cannot directly retrieve the rows from the GridView. Instead, you can access the data bound to it and obtain the row count as follows:

    var numRows = $(grid).c1gridview('dataView').totalItemCount();

    docs: https://help.grapecity.com/wijmo/3/webframe.html#Wijmo~wijmo.grid.wijgrid.html

    Sample: GridView_RowsSample.zip

    Regards,

    Uttkarsh.

  • Posted 5 June 2026, 5:16 am EST

    Great!

    .c1gridview(‘dataView’).totalItemCount

     //var GridView = $find("<%= BagsGrid.ClientID %>");
    //var Rows = GridView.get_rows();
    //var numRows = Rows.get_length();
    						
    grid = "#<%=BagsGrid.ClientID%>";
    var numRows = $(grid).c1gridview('dataView').totalItemCount();

    More legacy code, using

    rows.get_item(i)[0];

    rows.get_item(i)[0].cells[1]

    row.id

    row.attributes.trip.nodeValue

    $get(obj).control.get_rows().get_item(index)[0].cells[1].setAttribute('style', 'cursor:pointer');
    $get(obj).control.get_rows().get_item(index)[0].cells[1].setAttribute('onclick', event);
        for (var i = 0; i < rows.get_length() ; i++) {
                var row = rows.get_item(i)[0];
    
                $get(row.firstElementChild.firstElementChild.firstChild.id).onkeydown = function () { try { if (event.keyCode == 13) { eval(Me).SelectNextRow(); return false; } } catch (e) { } };
    
                var trip = trips[row.id];
    
                if (trip == null) {
                    try {
                        trip = JSON.parse(row.attributes.trip.nodeValue);
                    } catch (e) {
                        ErrorManager.Log(e, 'Error parsing trip');
                        alert('Error parsing trip' + e);
                    }
                }
    
                //var trip = trips[row.id] || JSON.parse(row.attributes.trip.nodeValue);
                trip.row = row;
                trips[row.id] = trip;
                indexes.push(row.id);
                validateTrip(trip);

    Please, any suggestions ?

  • Posted 5 June 2026, 7:42 am EST

    Hello Enrique,

    We tested the migration patterns in our sample. Here are the confirmed equivalents:

    1. Iterating rows

    Legacy:

    var Rows = GridView.get_rows();
    var numRows = Rows.get_length();
    for (var i = 0; i < numRows; i++) {
        var row = rows.get_item(i)[0];
    }

    New:

    var grid = "#<%=BagsGrid.ClientID%>";
    var numRows = $(grid).c1gridview('dataView').totalItemCount();
    for (var i = 0; i < numRows; i++) {
        var rowEl = $(grid).find('tr.wijmo-wijgrid-row').eq(i)[0];
    }

    2. row.id → use dataItem[0]

    In the new version, ‘tr’ elements do not have an 'id attribute, so ‘rowEl.id’ returns empty. Instead, read the key field directly from the data:

    var dataItem = $(grid).c1gridview('dataView').item(i);
    var rowKey = dataItem[0]; // first field — equivalent to the legacy row.id

    For your trips dictionary, replace ‘trips[row.id]’ with ‘trips[rowKey]’.


    3. ‘row.attributes.trip.nodeValue’ → ‘getAttribute’

    var tripJson = rowEl.getAttribute('trip');
    var trip = JSON.parse(tripJson);

    Note: this requires the ‘trip’ attribute to be rendered onto the ‘’ element server-side (e.g. via ‘OnRowDataBound’). If the attribute is missing at runtime, that would be the cause — please confirm it is being set in your code-behind.


    4. rows.get_item(i)[0].cells[1] → jQuery cell selector

    Legacy:

    $get(obj).control.get_rows().get_item(index)[0].cells[1].setAttribute('style', 'cursor:pointer');

    New:

    var cell1 = $(rowEl).find('td.wijgridtd').eq(1)[0];
    cell1.setAttribute('style', 'cursor:pointer');
    cell1.setAttribute('onclick', yourHandler);

    Sample: GridView_RowsSample_Mod.zip

    Regards,

    Uttkarsh

  • Posted 12 June 2026, 5:58 am EST

    Thanks all!

    I’ll try:

        this.OnBeforeSubmit = function () {
            var array = [];
            const grid = controls.C1GridViewTrips;
            const numRows = grid.c1gridview('dataView').totalItemCount();
           
            for (let i = 0; i < numRows; i++) {
                const dataItem = grid.c1gridview('dataView').item(i);
                const rowKey = dataItem[0];
                const t = trips[rowKey];
                t.row = null;
                array.push(t);
            }
            controls.hiddenData.value = JSON.stringify(array);
        };

    and

            const numRows = controls.C1GridViewTrips.c1gridview('dataView').totalItemCount();
            if (currentRowIndex != null) {
                if (numRows > 0 && currentRowIndex > numRows) {
                    currentRowIndex = numRows;
                }
            } else {
                if (numRows > 0) {
                    currentRowIndex = 1;
                }
            }
    
            for (let i = 0; i < numRows; i++) {
                const rowEl = grid.find('tr.wijmo-wijgrid-row').eq(i)[0];
                const dataItem = grid.c1gridview('dataView').item(i);
                const rowKey = dataItem[0]; // equivalente al legacy row.id
    
                const checkboxEl = rowEl.firstElementChild.firstElementChild.firstChild;
                document.getElementById(checkboxEl.id).onkeydown = function (event) { try { if (event.keyCode == 13) { eval(Me).SelectNextRow(); return false; } } catch (e) { } };
    
                // TODO: NO USAR eval ***
    
                let trip = trips[rowKey]; // var trip = trips[row.id];
    
                if (trip == null) {
                    try {
                        //trip = JSON.parse(row.attributes.trip.nodeValue);
                        const tripJson = rowEl.getAttribute('trip');
                        trip = JSON.parse(tripJson);
                    } catch (e) {
                        ErrorManager.Log(e, 'Error parsing trip');
                        alert('Error parsing trip' + e);
                    }
                }
    
                trip.row = rowEl;
                trips[rowKey] = trip;
                indexes.push(rowKey);
                validateTrip(trip);
    
                if (i == currentRowIndex - 1) {
                    //this.RowSelected(row.id, row, false);
                    this.RowSelected(rowKey, rowEl, false);
                }
    

    row.firstElementChild.firstElementChild.firstChild.id legacy,

    Now, is it correct ?

    const checkboxEl = rowEl.firstElementChild.firstElementChild.firstChild;
    document.getElementById(checkboxEl.id).onkeydown ...

    any suggestions ?

  • Posted 12 June 2026, 8:07 am EST

    Hello Enrique,

    The ‘firstElementChild.firstElementChild.firstChild’ chain is fragile — it depends on the exact DOM nesting the new wijmo grid generates and could break silently if the rendered markup changes between versions.

    So targeting it by type directly within the row is both simpler and more resilient:

    const checkboxEl = $(rowEl).find('input[type="checkbox"]').first()[0];
    if (checkboxEl) {
        checkboxEl.onkeydown = function (event) {
            try {
                if (event.keyCode == 13) { eval(Me).SelectNextRow(); return false; }
            } catch (e) { }
        };
    }
    

    Also note: since you’re attaching ‘onkeydown’ inside a loop, make sure each handler captures its own rowKey’ by wrapping it in a closure, otherwise every handler will reference the last iteration’s value:

    checkboxEl.onkeydown = (function(key) {
        return function(event) {
            try {
                if (event.keyCode == 13) { eval(Me).SelectNextRow(); return false; }
            } catch (e) { }
        };
    })(rowKey);
    

    Please refer to the sample attached for the same: GridView_RowsSample_Mod2.zip

    Regards,

    Uttkarsh

  • Posted 17 June 2026, 4:57 am EST

    I get the Error: cannot call methods on c1gridview prior to initialization; attempted to call method ‘dataView’

    Fails in Postback, when I click a Search button.

    Code fragment:

        this.ReadRows = function () {
    
            console.log("READ ROWS");
            console.log("ReadRows " + controls.C1GridViewTrips);
            const grid = controls.C1GridViewTrips;
            if (!grid || grid.length === 0) {
                return;
            }
    
            //const numRows = controls.C1GridViewTrips.c1gridview('dataView').totalItemCount();
            let dataView = null;
            try {
                dataView = grid.c1gridview('dataView');
            } catch (e) {
                console.log("ReadRows dataView not ready " + e );
                return;
            }
    
            if (!dataView) {
                return;
            }
    
            const numRows = dataView.totalItemCount();

    any suggestions, please ?

    thanks at all

  • Posted 18 June 2026, 2:40 am EST

    Hello Enrique,

    Thank you for the update.

    Could you please share the implementation details of the Search button that triggers the postback, along with the relevant backend code and the ASPX markup for both the grid and the Search button?

    The error suggests that the GridView may not be fully initialized when

    c1gridview('dataView')
    is being accessed. Once we can reproduce the scenario on our end, we’ll be able to investigate further and provide more accurate guidance.

    Regards,

    Uttkarsh.

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels