Radgrid Get changed value in cell @ cleint side using java script

4 posts, 0 answers
  1. Surjit Singh
    Surjit Singh avatar
    5 posts
    Member since:
    Jan 2007

    Posted 17 Nov 2010 Link to this post

    Hi Team-

    I do have radgrid  in my application.I want Javascript Validations on Submit button of row.(Client side validations)
    Below code in Java script gives me orignal values loaded in MasterTableView  but not changed values.
    I am geting orignal values loaded in Textbox not changed by user.
    ***************************************************************************************************************************************************
    JavaScript Code is below
     

    //Check Validations for grid like Mandatory and
    function Validations(sender, args)
    {
                  var itemIndex = args.get_commandArgument();                                 
                  var row = sender.get_masterTableView().get_dataItems()[itemIndex]; //to access the row   
                  var cellvalue = row._element.cells[2].innerHTML; // to access the cell value    
                  alert(cellvalue);



    I also Tried ,

     

     

     

     

    var masterTable = $find("<%= RadGrid1.ClientID %>").get_masterTableView();

     

     

     

     

    var oldValues = masterTable.extractOldValuesFromItem(0);

     

    alert(oldValues);

     

     

     

    But it gives me error.

    GRID Code is below
    **<radG:RadGrid ID="RadGrid1" runat="server" OnDeleteCommand="RadGrid1_DeleteCommand"
    AllowFilteringByColumn="true" AllowSorting="true" OnItemDataBound="RadGrid1_ItemDataBound"
    DataSourceID="SqlDataSource1" GridLines="None" Skin="Outlook" Width="93%" OnItemInserted="RadGrid1_ItemInserted"
    OnItemUpdated="RadGrid1_ItemUpdated">
    <MasterTableView CommandItemDisplay="Bottom" AllowAutomaticUpdates="True" DataSourceID="SqlDataSource1"
    AllowAutomaticDeletes="True" AutoGenerateColumns="False" AllowAutomaticInserts="True"
    DataKeyNames="id" ClientDataKeyNames="id" >
    <FilterItemStyle HorizontalAlign="left" />
    <HeaderStyle ForeColor="Navy" />
    <ItemStyle BackColor="White" Height="20px" />
    <AlternatingItemStyle BackColor="#E5E5E5" Height="20px" />
    <Columns>
    <radG:GridTemplateColumn AllowFiltering="False" UniqueName="TemplateColumn">
    <ItemTemplate>
    <asp:Image ID="Image1" ImageUrl="../frames/images/ADMIN/Grid-settings.png" runat="Server" />
    </ItemTemplate>
    <ItemStyle Width="10px" />
    </radG:GridTemplateColumn>
    <radG:GridBoundColumn Display="false" ReadOnly="True" DataField="id" DataType="System.Int32"
    UniqueName="id" Visible="true" SortExpression="id" HeaderText="Id">
    <ItemStyle Width="100px" />
    </radG:GridBoundColumn>
    <radG:GridBoundColumn EditFormColumnIndex="0" DataField="Agent_Name" UniqueName="Agent_Name"
    HeaderText="Agent Name" SortExpression="Agent_Name" AllowFiltering="true" AutoPostBackOnFilter="true"
    CurrentFilterFunction="Contains">
    <ItemStyle Width="500px" HorizontalAlign="Left" />
    </radG:GridBoundColumn>
    <radG:GridBoundColumn EditFormColumnIndex="1" DataField="Phone1" UniqueName="Phone1"
    HeaderText="Phone-1" SortExpression="Phone1" AllowFiltering="true" AutoPostBackOnFilter="true"
    CurrentFilterFunction="Contains" >
    <ItemStyle Width="500px" HorizontalAlign="Left" />
    </radG:GridBoundColumn>
    <radG:GridBoundColumn EditFormColumnIndex="0" DataField="Phone2" UniqueName="Phone2"
    HeaderText="Phone-2" SortExpression="Phone2" AllowFiltering="true" AutoPostBackOnFilter="true"
    CurrentFilterFunction="Contains">
    <ItemStyle Width="500px" HorizontalAlign="Left" />
    </radG:GridBoundColumn>
    <radG:GridBoundColumn EditFormColumnIndex="1" DataField="Address" UniqueName="Address"
    HeaderText="Address" SortExpression="Address" AllowFiltering="true" AutoPostBackOnFilter="true"
    CurrentFilterFunction="Contains">
    <ItemStyle Width="500px" HorizontalAlign="Left" />
    </radG:GridBoundColumn>
    <radG:GridEditCommandColumn ButtonType="ImageButton" UniqueName="EditColumn">
    <ItemStyle Width="50px" />
    </radG:GridEditCommandColumn>
    <radG:GridButtonColumn ConfirmText="Delete this record?" ConfirmDialogType="RadWindow"
    ConfirmTitle="Delete" ButtonType="ImageButton" CommandName="Delete" Text="Delete"
    UniqueName="DeleteColumn">
    <ItemStyle HorizontalAlign="Center" CssClass="MyImageButton" />
    </radG:GridButtonColumn>
    </Columns>
    <EditFormSettings ColumnNumber="2">
    <FormTableItemStyle HorizontalAlign="left" Wrap="False"></FormTableItemStyle>
    <FormCaptionStyle HorizontalAlign="left" CssClass="EditFormHeader"></FormCaptionStyle>
    <FormMainTableStyle HorizontalAlign="left" BorderColor="black" BorderWidth="0" CellSpacing="0"
    CellPadding="3" BackColor="White" Width="100%" />
    <FormTableStyle HorizontalAlign="left" BorderColor="black" BorderWidth="0" CellSpacing="0"
    CellPadding="2" BackColor="White" />
    <FormTableAlternatingItemStyle HorizontalAlign="left" BorderColor="blue" BorderWidth="0"
    Wrap="False"></FormTableAlternatingItemStyle>
    <EditColumn ButtonType="ImageButton" InsertText="Add New Agent" UpdateText="Update"
    UniqueName="EditCommandColumn1" CancelText="Cancel Edit">
    </EditColumn>
    <FormTableButtonRowStyle HorizontalAlign="Right" CssClass="EditFormButtonRow"></FormTableButtonRowStyle>
    </EditFormSettings>
    <ExpandCollapseColumn Visible="False">
    <HeaderStyle Width="19px"></HeaderStyle>
    </ExpandCollapseColumn>
    <RowIndicatorColumn Visible="False">
    <HeaderStyle Width="20px"></HeaderStyle>
    </RowIndicatorColumn>
    <CommandItemSettings AddNewRecordText="Add New Agent" />
    </MasterTableView>
    <ClientSettings EnableRowHoverStyle="true" AllowColumnsReorder="true" ReorderColumnsOnClient="true">
    <Resizing AllowRowResize="False" EnableRealTimeResize="True" ResizeGridOnColumnResize="True"
    AllowColumnResize="True" ClipCellContentOnResize="False"></Resizing>
    <ClientEvents OnRowDblClick="RowDblClick" OnCommand="Validations" />
    </ClientSettings>
    </radG:RadGrid>*

    ************************************************************************************************************************************************

     

    ***************************************************************************************************************************************************

    Please suggest its very urgent.

    Many Thanks
    Shashank


  2. Veli
    Admin
    Veli avatar
    2002 posts

    Posted 22 Nov 2010 Link to this post

    Hello Surjit,

    In the Validations() javascript function, you are accessing the original values in the data item, not the edited values in the edit form. sender.get_masterTableView().get_dataItems() will only return you the grid data items, not the edit forms that are shown for editing the data. To get the edited values, you need to find each input in the edit form and get its value.

    To show an example approach you can take, I have attached a test page with some javascript to demonstrate the scenario. Clicking on the "
    Extract edited item values" will extract all the values from the first edited item.

    Veli
    the Telerik team
    Browse the vast support resources we have to jumpstart your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Miguel
    Miguel avatar
    25 posts
    Member since:
    Dec 2010

    Posted 13 Dec 2010 Link to this post

    Hi Veli,

    I follow your example but I could not figure out how to get the Column Unique Name  in the edit form with JS code.

    Could you please help me out?
    What I am doing is placing an On-Blur event on the Column Editor Text box and if the unique column is the one I am looking for, I need to add two values from the previous two cell in the edit form and place the result in other cell in the edit form.

    Thanks a lot!
    Miguel.
  5. Veli
    Admin
    Veli avatar
    2002 posts

    Posted 14 Dec 2010 Link to this post

    Hello Miguel,

    You can modify the first provided code example to return a tripled: the column name, value and input control for each field. Attaching a modified project.

    Veli
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
Back to Top