Thursday, November 17, 2011

Validate Edit Form Template Container

Use Validation Group for custom added controls.. and validate using javascript.

 

<script type="text/javascript">
function OnUpdateClick(editor) {
if(ASPxClientEdit.ValidateGroup("EditForm"))
treeList.UpdateEdit();
}
</script>
<dxwtl:ASPxTreeList ID="ASPxTreeList2" runat="server" AutoGenerateColumns="False"
DataSourceID="AccessDataSource1" KeyFieldName="ID"
ParentFieldName="ParentID" ClientInstanceName="treeList">
<Templates>
<EditForm>
<table style="width: 100%">
<tr>
<td>Department:</td>
<td><dxe:ASPxTextBox ID="ASPxTextBox1" runat="server"
Value='<%# Bind("Department") %>'
Width="170px">
<ValidationSettings ValidationGroup="EditForm">
</ValidationSettings>
</dxe:ASPxTextBox></td>
</tr>
<tr>
<td>Location:</td>
<td><dxe:ASPxTextBox ID="ASPxTextBox2" runat="server"
Value='<%# Bind("Location") %>'
Width="170px">
<ValidationSettings ValidationGroup="EditForm">
</ValidationSettings>
</dxe:ASPxTextBox></td>
</tr>
<tr>
<td>Budget:</td>
<td><dxe:ASPxSpinEdit ID="ASPxSpinEdit1" runat="server" Height="21px" Number="0"
Value='<%# Bind("Budget") %>'>
<ValidationSettings ValidationGroup="EditForm">
</ValidationSettings>
</dxe:ASPxSpinEdit></td>
</tr>
<tr>
<td>Phone:</td>
<td><dxe:ASPxTextBox ID="ASPxTextBox3" runat="server"
Value='<%# Bind("Phone") %>' Width="170px">
<ValidationSettings ValidationGroup="EditForm">
<RegularExpression ErrorText="Wrong phone number"
ValidationExpression="((\(\d{3}\) ?)|(\d{3}-))?\d{3}-\d{4}" />
</ValidationSettings>
</dxe:ASPxTextBox></td>
</tr>
<tr>
<td colspan="2">
<a href="javascript:void(0);" onclick="OnUpdateClick(this)">Update</a>
<dxwtl:ASPxTreeListEditFormTemplateReplacement runat="server"
Type="CancelButton"/>
</td>
</tr>
</table>
</EditForm>
</Templates>
<Columns>
<dxwtl:TreeListTextColumn FieldName="Department" VisibleIndex="0">
</dxwtl:TreeListTextColumn>
<dxwtl:TreeListTextColumn FieldName="Budget" VisibleIndex="1">
</dxwtl:TreeListTextColumn>
<dxwtl:TreeListTextColumn FieldName="Location" VisibleIndex="2">
</dxwtl:TreeListTextColumn>
<dxwtl:TreeListTextColumn FieldName="Phone" VisibleIndex="3">
</dxwtl:TreeListTextColumn>
<dxwtl:TreeListCommandColumn VisibleIndex="4">
<EditButton Visible="True">
</EditButton>
</dxwtl:TreeListCommandColumn>
</Columns>
<SettingsEditing Mode="EditForm" />
</dxwtl:ASPxTreeList>


To invoke client-side validation for custom editors placed within the Edit Form's template, make use of a template container's ValidationGroup property.You can assign this property value to the ValidationSettings.ValidationGroup property of custom editors to be validated. The code below demonstrates how this can be done when defining an Edit Form's template.




<dx:ASPxGridView ... >
...
<Templates>
<EditForm>
...
<dx:ASPxTextBox ID="ASPxTextBox2" runat="server" Width="170px" ValidationSettings-ValidationGroup="<%# Container.ValidationGroup %>">
<ValidationSettings>
<RequiredField IsRequired="true" />
</ValidationSettings>
</dx:ASPxTextBox>

<dx:ASPxGridViewTemplateReplacement ReplacementType="EditFormUpdateButton" runat="server" />
...
</EditForm>
</Templates>
...
</dx:ASPxGridView>


in Dynamic Templates that inherits ITemplate interface..  use the following way to specify these.



ASPxTextBox tb = new ASPxTextBox();
tb.ID = "txtName";
tb.Width = 200;
tb.ValidationSettings.CausesValidation = true;
tb.ValidationSettings.RequiredField.IsRequired = true;
tb.ValidationSettings.ErrorDisplayMode = ErrorDisplayMode.ImageWithTooltip;
tb.ValidationSettings.ValidationGroup = editContainer.ValidationGroup;
//tb.CssFilePath = @"~/App_Themes/Soft Orange/{0}/styles.css";
//tb.CssPostfix = "Soft_Orange";
tb.Value = DataBinder.Eval(editContainer.DataItem, "Name");
table.Rows[0].Cells[1].Controls.Add(tb);

No comments :

Post a Comment