This is a migrated thread and some comments may be shown as answers.

Radgrid clientside validation

1 Answer 97 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Sreedath Kuttan
Top achievements
Rank 1
Sreedath Kuttan asked on 17 Sep 2008, 10:02 AM
Hi,
     I am using the RADGRID in the editmode with lot of template columns.My grid code is below.

On click of a button 'Save all'(outside grid) ,I want to check all the rows in the grid for valid data;Like there is a dropdown with '--Select--' value,but the user must enter some value ,can some body tell me how this can be achieved.

The goal is to iterate through the grid rows and check for individual values in the cells.

<

telerik:radgrid

runat="server"

ID="rdTripWaypoints"

AutoGenerateColumns=False

Skin="RadControls"

GridLines="None"

EnableEmbeddedSkins="False"

CellPadding="0"

AllowSorting="True"

onitemdatabound="rdTripWaypoints_ItemDataBound"

onitemcommand="rdTripWaypoints_ItemCommand"

onprerender="rdTripWaypoints_PreRender"

onneeddatasource="rdTripWaypoints_NeedDataSource"

onitemcreated="rdTripWaypoints_ItemCreated">

<

PagerStyle PrevPageImageUrl="PagingPrev.gif" NextPageImageUrl="PagingNext.gif" FirstPageImageUrl="PagingFirst.gif" LastPageImageUrl="PagingLast.gif"></PagerStyle>

<MasterTableView EditMode =InPlace>

<

CommandItemSettings AddNewRecordImageUrl="AddRecord.gif" RefreshImageUrl="Refresh.gif"></CommandItemSettings>

<

RowIndicatorColumn FilterImageUrl="Filter.gif" SortAscImageUrl="SortAsc.gif" SortDescImageUrl="SortDesc.gif" Visible="False">

<

HeaderStyle Width="20px"></HeaderStyle>

</

RowIndicatorColumn>

<

ExpandCollapseColumn ExpandImageUrl="SinglePlus.gif" CollapseImageUrl="SingleMinus.gif" FilterImageUrl="Filter.gif" SortAscImageUrl="SortAsc.gif" SortDescImageUrl="SortDesc.gif" Visible="False" Resizable="False">

<

HeaderStyle Width="20px"></HeaderStyle>

</

ExpandCollapseColumn>

<Columns>

<telerik:GridTemplateColumn HeaderText ="Stop" UniqueName="Stop" >

<ItemTemplate>

<asp:Label ID="lblStop" runat =server CssClass="TxtVer11blackpadding" Width= "25px" >

</asp:Label>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn HeaderText ="Location Name" uniqueName = "ddlLocationName" Visible =true >

<ItemTemplate>

<asp:DropDownList Width="140px" runat =server ID ="ddlLocationName" CssClass="TxtVer11blackpadding" AutoPostBack=true ></asp:DropDownList>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn HeaderText ="ETA" UniqueName="ETA" >

<ItemTemplate>

<asp:Label ID="lblETA" runat =server CssClass="TxtVer11blackpadding" Width= "40px" >

</asp:Label>

</ItemTemplate>

<ItemStyle Wrap="False" />

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn HeaderText ="Appx Offload Time" UniqueName="AppxOffLoadTime" >

<ItemTemplate>

<asp:TextBox ID="txtAppxOffLoadTime" runat =server CssClass="TxtVer11blackpadding" Width="40px">

</asp:TextBox>

<asp:Label ID="lblOffLoadTime" runat =server CssClass="TxtVer11blackpadding" Visible="false" Width="40px">

</asp:Label>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn HeaderText ="Appx Departure Date" uniqueName = "AppxDepartureTime" Visible =true>

<ItemTemplate>

<telerik:RadDateTimePicker style=" top:10px; " id="dtpDepDate" tabIndex=11 runat="server" Width="150px" Skin="RadControls" EnableTyping="False" EnableEmbeddedSkins="False" BackColor="Transparent" BorderColor="Transparent" Calendar-ClientEvents-OnDateSelecting="OnDateSelecting">

<TimePopupButton HoverImageUrl="~/RadControls/Calendar/time.gif" ImageUrl="~/RadControls/Calendar/time.gif" CssClass="radPopupImage_RadControls" TabIndex="12" />

<TimeView EnableEmbeddedSkins="False" Skin="RadControls" TimeFormat="HH:mm:ss" TabIndex="14">

</TimeView>

<DateInput DateFormat="MM/dd/yyyy HH:mm" Font-Names="verdana" Font-Size="11px" InvalidStyleDuration="100" EnableEmbeddedSkins="False" LabelCssClass="radLabelCss_RadControls" Skin="RadControls" ReadOnly="True" TabIndex="11">

<ClientEvents OnError="HandleError" />

</DateInput>

<Calendar EnableEmbeddedSkins="False" Skin="RadControls" FastNavigationNextImage="~/RadControls/Calendar/fastNavRight.gif" FastNavigationPrevImage="~/RadControls/Calendar/fastNavLeft.gif" NavigationNextImage="~/RadControls/Calendar/arrowRight.gif" NavigationPrevImage="~/RadControls/Calendar/arrowLeft.gif">

</Calendar>

<DatePopupButton HoverImageUrl="~/RadControls/Calendar/calendar.gif" ImageUrl="~/RadControls/Calendar/calendar.gif" CssClass="radPopupImage_RadControls" TabIndex="11" />

</telerik:RadDateTimePicker>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn HeaderText ="Distance" UniqueName="Distance" >

<ItemTemplate>

<asp:Label ID="lblDistance" runat =server CssClass="TxtVer11blackpadding" Width= "40px" >

</asp:Label>

</ItemTemplate>

<ItemStyle Wrap="False" />

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn HeaderText ="Latitude" UniqueName="Latitude" >

<ItemTemplate>

<asp:Label ID="lblLatitude" runat =server CssClass="TxtVer11blackpadding" Width= "40px" >

</asp:Label>

</ItemTemplate>

<ItemStyle Wrap="False" />

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn HeaderText ="Longitude" UniqueName="Longitude" >

<ItemTemplate>

<asp:Label ID="lblLongitude" runat =server CssClass="TxtVer11blackpadding" Width= "40px" >

</asp:Label>

</ItemTemplate>

<ItemStyle Wrap="False" />

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn HeaderText ="Charge Code" uniqueName = "ddlChargeCode" Visible =true>

<ItemTemplate>

<asp:DropDownList Width="140px" runat =server ID ="ddlChargeCode" CssClass="TxtVer11blackpadding" ></asp:DropDownList>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn UniqueName ="btn" >

<ItemTemplate >

<asp:ImageButton runat = server ID="ibtnAdd" Text = "Add" ToolTip="Add a row below" CommandName ="Add" ImageUrl="../images/Add.GIF" />

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn UniqueName ="btn" Visible =true >

<ItemTemplate >

<asp:ImageButton runat = server ID="ibtndelete" Text = "Delete" ToolTip="Delete row" CommandName ="Del" ImageUrl="../images/Delete.GIF" />

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

<

EditFormSettings>

<

EditColumn InsertImageUrl="Insert.gif" UpdateImageUrl="Update.gif" EditImageUrl="Edit.gif" CancelImageUrl="Cancel.gif" FilterImageUrl="Filter.gif" SortAscImageUrl="SortAsc.gif" SortDescImageUrl="SortDesc.gif"></EditColumn>

<

PopUpSettings ScrollBars="None"></PopUpSettings>

</

EditFormSettings>

<

PagerStyle PrevPageImageUrl="PagingPrev.gif" NextPageImageUrl="PagingNext.gif" FirstPageImageUrl="PagingFirst.gif" LastPageImageUrl="PagingLast.gif"></PagerStyle>

</MasterTableView>

</telerik:radgrid>


 

1 Answer, 1 is accepted

Sort by
0
Sebastian
Telerik team
answered on 22 Sep 2008, 08:23 AM
Hello Sreedath,

In order to extract the data from the controls inside the item templates of the template columns, consider traversing the Items collection of the MasterTableView from within the [Save all] button OnClick handler. How to get reference to controls inside grid cells you can see from these online resources:

http://demos.telerik.com/ASPNET/Prometheus/Grid/Examples/Programming/AccessingCellsAndRows/DefaultCS.aspx
http://www.telerik.com/help/aspnet-ajax/grdaccessingcellsandrows.html
http://www.telerik.com/help/aspnet-ajax/gridreferencecontrolsinroweditform.html

Thus you can perform your custom type of validation for the user input as well.

Best regards,
Stephen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Tags
Grid
Asked by
Sreedath Kuttan
Top achievements
Rank 1
Answers by
Sebastian
Telerik team
Share this question
or