Disable a Column in JavaScript

Infragistics4.Web.v11.1, Version=11.1.20111.1006

Microsoft .NET Framework Verion 4.0.30319 SP1Rel

I need to disable a column in the WebDataGrid based on a value in a DDL.  If the user selects CarbonCopy in the DDL, I check the BoundCheckBoxField for all the rows in the grid.  Then I need to disable the column because the user cannot uncheck these fields.  I have not been able to figure out how to get at the ReadOnly property for the column.  FYI – I cannot use the CellValueChanging event to cancel the eventArgs because I am setting the value in the same function.  Here is my code…can you help?   

 

 

 

 

 

 

 

 

if

 

 

((ddlSigningMethod.options(ddlSigningMethod.selectedIndex).value == 'CarbonCopy') ) {

 

 

var wdgDocuments = $find('<%= wdgDocuments.ClientID %>');

 

 

// Spin though the Document Grid, checking all the Selected checkboxes

 

 

for (var i = 0; i < wdgDocuments.get_rows().get_length(); i++) {

selectedDocument = wdgDocuments.get_rows().get_row(i).get_cellByColumnKey(

 

"HasSignerAssociatedWithDocument");

selectedDocument.set_value(

 

true);

}

 

 

// These do not work to help me disable the row

wdgDocuments.get_behaviors().get_editingCore().get_behaviors().get_cellEditing().get_columnSettingFromKey(

 

"HasSignerAssociatedWithDocument")

wdgDocuments.get_behaviors().get_editingCore().get_behaviors().get_cellEditing().get_columnSettings()

}

I got a bit more…once I added my column to Behaviors/EditingCode/Behaviors/CellEditing I can get at the ReadOnly property in JavaScript, but I cannot change the ReadOnly property to True.

HTML:

 

 

 

<ig:EditingColumnSetting ColumnKey="HasSignerAssociatedWithDocument" ReadOnly ="false" />

BLOCKED SCRIPT

wdgDocuments.get_behaviors().get_editingCore().get_behaviors().get_cellEditing().get_columnSettingFromKey(

 

"HasSignerAssociatedWithDocument").get_readOnly() == true;

Hi IntegraSys76,

Technically it is not possible to set the read only property of a column setting for cell editing.  It would require going back to the server to accomplish this.  However, with checkbox columns, we scan for the column setting in the initialization and set _editableCheckbox on the column.  When it is set to false, clicking on the checkboxes will not switch the value.  This is what I would suggest doing in your case.

regards,
David Young 

Thanks for the quick reply.  I do not know what you mean by …

we scan for the column setting in the initialization and set _editableCheckbox on the column

I know that I cannot disable an individual cell but there is no way to disable the entire column in JS?  I am also trying to do this on the server side without luck.  This example is an UnboundCheckBoxField.

Dim 

 

 

gridColumnEditSetting As ColumnEditSetting

 

gridColumnEditSetting = whdgOrganize.Behaviors.EditingCore.Behaviors.CellEditing.ColumnSettings(

 

 

"RemoveDocument")

gridColumnEditSetting.ReadOnly =

 

True

Hi,

_editableCheckbox  is an internal property we set on a column when scanning for column settings when the grid is created.  As I said, you cannot change read only values on the client.  But if you changed this property to false on the column of interest, I believe it should become read only.

As to your server code, setting a column setting on the server should work.  Do you have matching key values?

-Dave

Dave,

That worked for me on the client-side.  Here is my code, in case it can help someone else:

wdgDocuments.get_columns().get_columnFromKey(

 

 

"HasSignerAssociatedWithDocument")._editableCheckbox = false;

For the server side problem, I do have a matching key, "RemoveDocument".  Here is a piece of my grid HTML.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

<Columns>

 

 

 

<ig:UnboundCheckBoxField Key="RemoveDocument" Header-Text="Rem" Width="30px"> </ig:UnboundCheckBoxField>

 

 

 

<ig:BoundDataField DataFieldName="DocumentDescription" Key="DocumentDescription" Header-Text="Document Description" Width="403px" ></ig:BoundDataField>

 

 

 

<ig:BoundDataField DataFieldName="LoanAppEnvelopeDocumentRecID" Key="LoanAppEnvelopeDocumentRecID" Hidden ="true"></ig:BoundDataField>

 

 

 

</Columns>

 

 

 

<Behaviors>

 

 

 

<ig:EditingCore>

 

 

 

<EditingClientEvents CellValueChanged="Grid_CellValueChanged" />

 

 

 

<Behaviors>

 

 

 

<ig:CellEditing>

 

 

 

<ColumnSettings>

 

 

 

<ig:EditingColumnSetting ColumnKey="RemoveDocument" ReadOnly="false" />

 

 

 

<ig:EditingColumnSetting ColumnKey="DocumentDescription" ReadOnly="true" />

 

 

 

</ColumnSettings>

 

 

 

</ig:CellEditing>

 

 

 

</Behaviors>

 

 

 

</ig:EditingCore>

 

 

 

<ig:Selection Enabled ="true"></ig:Selection>

 

 

 

<ig:Activation Enabled="true"></ig:Activation>

 

 

 

</Behaviors>

Hello Autumn,

Please let me know if the solution with the javascript you have found resolves your issue.

The JavaScript works great, which was my original post.  Thank you.  I am still having trouble disabling the column on the server side but I have not gotten back to trying it again.

Hi,

I want to hide a  column of web data grid. I am making hidden property of the column to true but I am getting a following error.

The control collection cannot be modified because the controls contain code block(i.e <%…%>)

i have tried making its width to 0 stil is visible..

How can I make it hidden?

Thanks

Swetha

Hello,

Please visit our sample browser. There are two samples regarding column hiding in our WDG.

http://samples.infragistics.com/aspnet/Samples/WebDataGrid/Organization/Column-Hiding/Default.aspx?cn=data-grid&sid=e427d357-bf29-49ca-b286-55f91f6cc2a9

http://samples.infragistics.com/aspnet/Samples/WebDataGrid/Organization/Column-Hiding-Client-Side/Default.aspx?cn=data-grid&sid=c9ae8b2f-a309-4c2c-b3b0-81c6910b90c9

@Autumn – is it possible to attach in *.zip a small sample in which you are trying to hide a column from the server side and it is not working.

The last post was not written by me and it is not on my subject of disabling a column in JavaScript.

Hello Autumn,

Please take a look at the attackhed from me sample tested with IE 9 and Chrome. It changes the available for edit column Date/Item on the server depending on which item has been selected in WDD.

I have this post in the wrong forum.  I am working with a WHDG.  I will post it there also.  Here is my code behind for a column in the parent row (RemoveDocument) and the child row (SignatureTypeEnumValue).

 

 

whdgOrganize.Behaviors.EditingCore.Behaviors.CellEditing.ColumnSettings(

 

"RemoveDocument").ReadOnly = True

whdgOrganize.Bands0).Behaviors.EditingCore.Behaviors.CellEditing.ColumnSettings(

 

"SignatureTypeEnumValue").ReadOnly = True

                            <ig:WebHierarchicalDataGrid ID="whdgOrganize" runat="server"
                             AutoGenerateColumns="False" AutoGenerateBands="False" DataKeyFields="LoanAppEnvelopeDocumentRecID"
                                EnableAjax="false" EnableDataViewState="true" Height="400px" InitialDataBindDepth="1" Style="Z-INDEX: 100; LEFT: 20px; POSITION: absolute; TOP: 43px"
                                Width="1070px">

                                <Columns>
                                    <ig:UnboundCheckBoxField Key="RemoveDocument" Header-Text="Rem" Width="30px"></ig:UnboundCheckBoxField>
                                    <ig:BoundDataField DataFieldName="DocumentDescription" Key="DocumentDescription" Header-Text="Document Description" Width="403px" ></ig:BoundDataField>
                                    <ig:BoundDataField DataFieldName="LoanAppEnvelopeDocumentRecID" Key="LoanAppEnvelopeDocumentRecID" Hidden ="true"></ig:BoundDataField>
                                </Columns>

                                <Behaviors>
                                    <ig:EditingCore>
                                        <Behaviors>
                                            <ig:CellEditing>
                                                <ColumnSettings>
                                                    <ig:EditingColumnSetting ColumnKey="RemoveDocument" ReadOnly="false"/>
                                                    <ig:EditingColumnSetting ColumnKey="DocumentDescription" ReadOnly="true" />
                                                </ColumnSettings>
                                            </ig:CellEditing>
                                        </Behaviors>
                                    </ig:EditingCore>
                                    <ig:Selection Enabled ="true"></ig:Selection>
                                    <ig:Activation Enabled="true"></ig:Activation>
                                </Behaviors>

                                <Bands>
                                    <ig:Band  Key="LoanAppEnvelopeDocumentSignerSignatureRecID"
                                        DataMember="Signature"
                                        DataKeyFields="LoanAppEnvelopeDocumentSignerSignatureRecID"
                                        AutoGenerateColumns="false">
                                        <Columns >
                                            <ig:BoundDataField DataFieldName="SignatureTypeEnumValue" Key="SignatureTypeEnumValue" Header-Text="Signature Type" Width="130px"></ig:BoundDataField>
                                            <ig:BoundDataField DataFieldName="SignerRole" Key="SignerRole" Header-Text="Role" Width="25px" ></ig:BoundDataField>
                                            <ig:BoundDataField DataFieldName="SignerName" Key="SignerName" Header-Text="Name" Width="260px" ></ig:BoundDataField>
                                            <ig:BoundDataField DataFieldName="SignatureFieldName" Key="SignatureFieldName" Header-Text="Reference" Width="445px" ></ig:BoundDataField>
                                            <ig:BoundDataField DataFieldName="LoanAppEnvelopeDocumentRecID" Key="LoanAppEnvelopeDocumentRecID" Hidden ="true"></ig:BoundDataField>
                                            <ig:BoundDataField DataFieldName="LoanAppEnvelopeSignerRecID" Key="LoanAppEnvelopeSignerRecID" Hidden ="true"   ></ig:BoundDataField>
                                            <ig:BoundDataField DataFieldName="LoanAppEnvelopeDocumentSignerSignatureRecID" Key="LoanAppEnvelopeDocumentSignerSignatureRecID" Hidden ="true"   ></ig:BoundDataField>
                                        </Columns>
                              
                                        <Behaviors>
                                            <ig:EditingCore>
                                                <Behaviors>
                                                    <ig:CellEditing>
                                                        <EditModeActions EnableOnActive="true" EnableOnKeyPress ="true" MouseClick="Single"/>
                                                        <ColumnSettings>
                                                            <ig:EditingColumnSetting ColumnKey="SignatureTypeEnumValue" EditorID="ddpSignatureType" ReadOnly ="false"/>
                                                            <ig:EditingColumnSetting ColumnKey="SignerRole" ReadOnly="true" />
                                                            <ig:EditingColumnSetting ColumnKey="SignerName" ReadOnly="true" />
                                                            <ig:EditingColumnSetting ColumnKey="SignatureFieldName" ReadOnly="true" />
                                                        </ColumnSettings>
                                                    </ig:CellEditing>
                                                </Behaviors>
                                            </ig:EditingCore>
                                        </Behaviors>
                                    </ig:Band>
                                </Bands>

                                <EditorProviders>
                                    <ig:DropDownProvider ID="ddpSignatureType">
                                        <EditorControl ID="ecSignatureType" runat="server" StyleSetName="Office2007Blue" EnableRenderingAnchors="false"
                                            DisplayMode="DropDownList" DataKeyFields="Value" TextField="Description" ValueField="Value"/>
                                    </ig:DropDownProvider>
                                </EditorProviders>

                            </ig:WebHierarchicalDataGrid>           
                        </Template>
                    </ig:ContentTabItem>

Hello Autumn,

I noticed that you have already posted your question in WebHierarchicalDataGrid forum and you have received answers. I will post a link to this forum thread and I suggest you to move the discussion on this issue in this forum thread in order to avoid duplicated posts.

http://community.infragistics.com/forums/p/64909/329253.aspx#329253