I have a webdatagrid two template fields... textboxes.. when the user enters a value in the first one and then goes to the second one, I need to make sure the second value is not greater then the first value...
Can someone help with some client side script to do this?
Hello Daryl,
The code sample works fine on my configuration. Here are several suggestions to help you run the sample: In order to maintain a low zip file size, I have deleted the ig_res folder. It is common practice. The CSS files, responsible for the stilling of the Infragistics Controls could be found in the ig_res folder, that is created when the Design button in Visual Studio is clicked OR an Infragistics Control is initially added in DesignView.The DataSource of the code sample is located in its CodeBehind file and it is a DataTable. I suggest you bind the controls to your own data source, that is required for the application you develop.
About the function: .getElementsByTagName("input") returns the rendered HTML Tag by its name. This is the element the TextBox is rendered as, when the HTML is generated. It is OK not to modify it. Since the TextBox is in a Template the generated TextBox for every row of the TemplatedColumn has a ClientID, that is unique and different from the TextBox ID property. In your case “txtShelfPrice”. Additionally I have updated the function, to ensure correct behavior by wrapping the input elements values in parseInt(string) function.
I will be waiting for your feedback on it. Please keep me updated on how this works for you and if you need more information.
here is your sample without the server side data load..
here is the aspx code.. IT DOESN'T WORK???
<%@ Page Title="Home Page" Language="vb" MasterPageFile="~/Site.Master" AutoEventWireup="false" CodeBehind="Default.aspx.vb" Inherits="WebApplication2._Default" %><%@ Register Assembly="Infragistics4.Web.v12.2, Version=12.2.20122.2166, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb" Namespace="Infragistics.Web.UI.GridControls" TagPrefix="ig" %><asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent"> </asp:Content><asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent"> <script type="text/javascript" id="igClientScript"> function textboxTextChanged(sender, eventArgs) { if (sender.parentNode._object.get_row().get_cellByColumnKey("TemplateField_0").get_element().getElementsByTagName("TextBox1")[0].value < sender.value) { sender.value = ""; } } </script> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <ig:WebDataGrid ID="WebDataGrid1" runat="server" Height="350px" Width="737px"> <Columns> <ig:TemplateDataField Key="TemplateField_0"> <ItemTemplate> <asp:TextBox ID="TextBox1" runat="server" Width="50px"></asp:TextBox> </ItemTemplate> <Header Text="FirstTextBoxTemplateField"></Header> </ig:TemplateDataField> <ig:TemplateDataField Key="TemplateField_1"> <ItemTemplate> <asp:TextBox ID="TextBox2" runat="server" onchange="textboxTextChanged(this, event)"> </asp:TextBox> </ItemTemplate> <Header Text="SeccondTextBoxTemplateField"></Header> </ig:TemplateDataField> </Columns> <Behaviors> <ig:Selection> </ig:Selection> </Behaviors> </ig:WebDataGrid></asp:Content>
Also, i tried your sample project..
It doesn't work.. did you try it???
Hi,
I have had to change me code a bit, so your example doesn't work..
first template field..
<ig:TemplateDataField Key="ShelfPrice" Width="12%" CssClass="deInput"> <Header Text="* Shelf Price"></Header> <ItemTemplate> <asp:Label runat="server" ID="money1" Text="$" Width="5px"/> <asp:TextBox runat="server" ID="txtShelfPrice" MaxLength="10" Width="50px" CausesValidation="True" /> <asp:RequiredFieldValidator ID="rfv_txtShelfPrice" runat="server" ErrorMessage="* Required" SetFocusOnError="True" Display="Dynamic" ControlToValidate="txtShelfPrice" Font-Bold="True" ForeColor="#CC0000"></asp:RequiredFieldValidator> </ItemTemplate> </ig:TemplateDataField>
second template field..
<ig:TemplateDataField Key="BidPrice" Width="12%" > <Header Text="* Bid Price"></Header> <ItemTemplate> <asp:Label runat="server" ID="money2" Text="$" Width="5px" /> <asp:TextBox runat="server" ID="txtBidPrice" MaxLength="10" CssClass="deinput" Width="50px" CausesValidation="True" onchange="textboxTextChanged(this, event)" /> <asp:RequiredFieldValidator ID="rfv_txtBidPrice" runat="server" ErrorMessage="* Required" SetFocusOnError="True" Display="Dynamic" ControlToValidate="txtBidPrice" Font-Bold="True" ForeColor="#CC0000"></asp:RequiredFieldValidator> </ItemTemplate> </ig:TemplateDataField>
so this function..
function textboxTextChanged(sender, eventArgs) { if (sender.parentNode._object.get_row().get_cellByColumnKey("ShelfPrice").get_element().getElementsByTagName("txtShelfPrice")[0].value > sender.value) { alert('Bid Price cannot be greater than Shelf Price') eventArgs.set_cancel(true); } }
Doesn't return anything on "[0].value" even thought the textbox has a value (both have values)
Daryl,
That should be the textbox in the first column, i.e. the first cell in the row.
Do you need any additional assistance with the sample?
Please let us know if you have any questions or concerns, we will be glad to assist you.