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
245
WebHierarchicalDataGrid UnboundCheckBoxField
posted

I have a WebHierarchicalDataGrid with 2 UnboundCheckBoxField; one if for email and the other is for print. The user can select either the email or print, not both. In the javascript it ends up in a loop even though I using eventArgs.set_cancel. 

Here's the grid:

<ig:WebHierarchicalDataGrid ID="WebHierarchicalDataGrid1" runat="server" Height="250px" Width="100%" DataKeyFields="ID" DataMember="t_Band1" AutoGenerateColumns="False" InitialDataBindDepth="-1" Key="Band1">
<Columns>
<ig:BoundDataField DataFieldName="ID" Key="ID" Hidden="true">
<Header Text="VendID" />
</ig:BoundDataField>
<ig:BoundDataField DataFieldName="Name" Key="Name">
<Header Text="Name" />
</ig:BoundDataField>
<ig:UnboundCheckBoxField Key="EmailYSN" Width="50px" HeaderCheckBoxMode="Off">
<Header Text="Email"></Header>
</ig:UnboundCheckBoxField>
<ig:UnboundCheckBoxField Key="PrintYSN" Width="50px" HeaderCheckBoxMode="Off">
<Header Text="Print"></Header>
</ig:UnboundCheckBoxField>
</Columns>
<Bands>
<ig:Band AutoGenerateColumns="False" DataKeyFields="ID" DataMember="t_Band2" Key="Band2">
<Columns>....</Columns>
</ig:Band>
</Bands>
<Behaviors>
<ig:EditingCore AutoCRUD="False">
<EditingClientEvents CellValueChanged="WHDG_Editing_CellValueChanged" />
<Behaviors>
<ig:CellEditing>
<ColumnSettings>
<ig:EditingColumnSetting ColumnKey="Name" ReadOnly="true" />
</ColumnSettings>
</ig:CellEditing>
</Behaviors>
</ig:EditingCore>
<ig:RowSelectors>
</ig:RowSelectors>
<ig:Selection RowSelectType="Single" CellClickAction="Cell">
</ig:Selection>
</Behaviors>
</ig:WebHierarchicalDataGrid>

Here is the javascript:

function WHDG_Editing_CellValueChanged(sender, eventArgs) {
var grid = $find('<%= WebHierarchicalDataGrid1.ClientID %>');
var parentGrid = grid.get_gridView().get_rows();


if (eventArgs.get_cell(1).get_column().get_key() == "EmailYSN") {
parentGrid.get_row(0).get_cell(3).set_value("false");
eventArgs.set_cancel(true);
}


if (eventArgs.get_cell().get_column().get_key() == "PrintYSN") {
parentGrid.get_row(0).get_cell(2).set_value("false");
eventArgs.set_cancel(true);
}
}

Parents
No Data
Reply
  • 1660
    Offline posted

    Hello Pat,

    Instead of cancelling the event I recommend you including another expression inside your if statement to check whether the new value that is being changed is equal to true. In this case the CellValueChanged event handler would not loop since only one of the fields would be able to hold the true value. 

    Below I am pasting a JavaScript snippet that demonstrates the change I have described above: 

     

     function WHG_CellValueChanged(sender, eventArgs) {
               
                var currentCell = eventArgs.get_cell();
    
                if (currentCell.get_column().get_key() == "EmailYSN" && currentCell.get_value() == true) {
                    currentCell.get_row().get_cell(3).set_value(false);                
                }
    
                else if (currentCell.get_column().get_key() == "PrintYSN" && currentCell.get_value() == true) {
                    currentCell.get_row().get_cell(2).set_value(false);
                }
            }    

     

    Please test the snippet on your side and let me know if you have any questions. 

    Regards,
    Ivan Kitanov

Children
No Data