Rad Grid is hiding, when double click on the Grid Row for editing option.

3 posts, 0 answers
  1. Alexis
    Alexis avatar
    23 posts
    Member since:
    Aug 2010

    Posted 03 Jan 2012 Link to this post

    Hi Team,
                      I'm using Telerik Rad Grid in my application, in which i'm facing an issue. I'm having an editing option in the grid in Double click event, here is the code. While I'm double click, it suppose to come to "RadGrid1_ItemDataBound" event, but its not firing the above event, instead off the grid is hiding

    Find the Attached screenshots:
    Page1.jpg ---> It is displaying the Grid with data.
    Page2.jpg ---> When i double click on the row, then the grid is hiding and the "RadGrid1_ItemDataBound" Event is not firing.

    Below is the Code for your reference
    ########################################################################################################
    <telerik:RadGrid ID="RadGrid1" runat="server" GridLines="None" EnableEmbeddedSkins="True"
                                                AllowSorting="True" OnDeleteCommand="RadGrid1_DeleteCommand" AutoGenerateColumns="False"
                                                Width="340px" OnItemDataBound="RadGrid1_ItemDataBound" AllowAutomaticUpdates="false"
                                                AllowAutomaticInserts="false" AllowFilteringByColumn="false">
                                                <MasterTableView DataKeyNames="RowNum,Option" EditMode="InPlace" GridLines="None" Width="100%" 
                                                        NoMasterRecordsText="No data fields to display.."
                                                    HeaderStyle-HorizontalAlign="Center">
                                                    <Columns>
                                                        <telerik:GridBoundColumn ReadOnly="true" DataField="RowNum" Visible="false" HeaderText="RowNum"
                                                            UniqueName="RowNum">
                                                        </telerik:GridBoundColumn>
                                                        <telerik:GridBoundColumn ReadOnly="true" DataField="Option" HeaderText="Option" UniqueName="Option">
                                                        </telerik:GridBoundColumn>
                                                        <telerik:GridBoundColumn ReadOnly="true" Visible="true" DataField="Values" HeaderText="Values"
                                                            UniqueName="Values">
                                                        </telerik:GridBoundColumn>
                                                        <telerik:GridBoundColumn ReadOnly="true" HeaderText="ValuesWithCap" DataField="ValuesWithCap" UniqueName="ValuesWithCap" Visible="false">
                                                        </telerik:GridBoundColumn>
                                                        <telerik:GridBoundColumn ReadOnly="true" HeaderText="Range Name" DataField ="RangeName" UniqueName="RangeName" Visible="true">
                                                        </telerik:GridBoundColumn>
                                                        <telerik:GridButtonColumn CommandName="Delete" HeaderText="Delete" ButtonType="ImageButton"
                                                            ImageUrl="~/Images/btn/btn_delete.gif" UniqueName="Delete">
                                                        </telerik:GridButtonColumn>
                                                    </Columns>
                                                </MasterTableView>
                                                <ClientSettings>
                                                    <ClientEvents OnRowClick="RowClick" OnRowDblClick="RowDblClick" OnGridCreated="GridCreated"
                                                        OnCommand="GridCommand" />
                                                </ClientSettings>
                                            </telerik:RadGrid>





     <script type="text/javascript">
            
                Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
                
                function EndRequestHandler(sender, args) {
                    if (args.get_error() != undefined) {
                            args.set_errorHandled(true);
                            location.reload(true);
                       
                    }
                } 


                var hasChanges = false, inputs, dropdowns, editedRow;


                function TrackChanges(e) {
                    hasChanges = true;
                }


                
                function RowClick(sender, eventArgs) {


                    if (editedRow != null) {
                        hasChanges = false;
                        $find("<%= RadGrid1.MasterTableView.ClientID %>").updateItem(editedRow);
                    }
                }
                function RowDblClick(sender, eventArgs) {
                    editedRow = eventArgs.get_itemIndexHierarchical();
                        $find("<%= RadGrid1.MasterTableView.ClientID %>").editItem(editedRow);
                }
                function GridCommand(sender, args) {
                    if (args.get_commandName() != "Edit") {
                        editedRow = null;
                    }
                }
                function GridCreated(sender, eventArgs) {


                    var gridElement = sender.get_element();
                    var elementsToUse = [];
                    inputs = gridElement.getElementsByTagName("input");
                    for (var i = 0; i < inputs.length; i++) {
                        var lowerType = inputs[i].type.toLowerCase();
                        if (lowerType == "hidden" || lowerType == "button") {
                            continue;
                        }


                        Array.add(elementsToUse, inputs[i]);
                        inputs[i].onchange = TrackChanges;
                    }


                    dropdowns = gridElement.getElementsByTagName("select");
                    for (var i = 0; i < dropdowns.length; i++) {
                        dropdowns[i].onchange = TrackChanges;
                    }


                    setTimeout(function() { if (elementsToUse[0]) elementsToUse[0].focus(); }, 100);
                }


            </script>


    protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
        {
            DataRowView rowView = (DataRowView)e.Item.DataItem;
            if (e.Item is GridDataItem && e.Item.IsInEditMode)
            {
                int index = e.Item.ItemIndex;
                DataTable dt;
                string uniqueValues = string.Empty;
                ArrayList arrValues = new ArrayList();
                if (Session["RangeList"] != null)
                {
                    dt = (DataTable)Session["RangeList"];
                    DataRow dr = dt.Rows[index];
                    this.txtRangeName.Text = dr["RangeName"].ToString();
                    this.RCBOptions.SelectedValue = dr["OptionIndex"].ToString();
                    uniqueValues = dr["ValuesWithCap"].ToString();
                    this.hdnTempRangeId.Value = index.ToString();
                    ViewState["hdnTempRangeId"] = index.ToString();
                    arrValues.Add(uniqueValues.Split('^'));
                    for (int i = 0; i < ((string[])(arrValues[0])).Count(); i++)
                    {
                        RadListBoxItem lst = new RadListBoxItem();
                        lst.Text = ((string[])(arrValues[0]))[i].ToString();
                        lst.Value = ((string[])(arrValues[0]))[i].ToString();
                        UsrSelectedValueListBox.Items.Add(lst);
                    }
                    RadGrid1.DataSource = dt;
                    RadGrid1.DataBind();
                }
            }
        }


    Please give us a good solution for this issue ASAP. We need it urgently...

    Thanks
    Alexis
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 03 Jan 2012 Link to this post

    Hello,

    You can use Advanced Data-Binding as explained in the following documentation.
    Advanced Data-binding (using NeedDataSource event)

    Thanks,
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Alexis
    Alexis avatar
    23 posts
    Member since:
    Aug 2010

    Posted 03 Jan 2012 Link to this post

    Hello Princy,

                        I need to fire an ItemDataBound Event for that Grid in which i Double Click for Editing.... Please give me the possible error occurrence and the way to fix.

    The Data for The Grid will be a dynamic one, So i cant assign any data source in statically...

    The Grid is completely hidden after the "OnRowDblClick" (javascript) event fires. After firing this Javascript i want to fire the RadGrid Item Data Bound Code...

    What could be the reason for my issue???? So that i can fix that in my application....
     Please reply back as soon as possible....
    Hereby i attached the Full page code for ur reference.... Please help us regarding this....


    <%@ Page Language="C#" MasterPageFile="~/master/AnswerGenMaster.Master" AutoEventWireup="true"
        CodeBehind="myGrouping.aspx.cs" Inherits="myGrouping" Title="answergen :: My Grouping" %>


    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceholderHead" runat="server">
        <style type="text/css">
            .topMenuHegiht
            {
                margin-bottom: 0px !important;
            }
            .margin_05
            {
                margin: 5px;
            }
            .roundCorner
            {
                -moz-border-radius: 5px;
                -webkit-border-radius: 5px;
                -o-border-radius: 5px;
                border-radius: 5px;
                border: solid 1px #069;
            }
            .headTxt
            {
                background: #72ACCE;
                padding: 10px;
                font-weight: bold;
                margin: 0px;
                width: 160px;
            }
            .squarCorner
            {
                border: solid 1px #069;
                border-right: 0px;
                border-top: 0px;
            }
            .strightLine
            {
                border-bottom: solid 1px #069;
            }
            .headBgLinr
            {
                background-image: url(../../images/bg/bg_list_top_C.png);
                background-repeat: repeat-x;
                background-position: 0 -2px;
                margin: 5px 10px;
            }
            .RadListBox_blueNew .rlbButtonAreaTop a.rlbButton, .RadListBox .rlbButtonAreaTop a.rlbButton
            {
                margin-left: -10px !important;
            }
        </style>
    </asp:Content>
    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceholderBody" runat="server">
        <telerik:RadCodeBlock ID="CodeBlock1" runat="server">


            <script type="text/javascript">
            
                Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
                
                function EndRequestHandler(sender, args) {
                    if (args.get_error() != undefined) {
                            args.set_errorHandled(true);
                            location.reload(true);
                       
                    }
                } 


                var hasChanges = false, inputs, dropdowns, editedRow;


                function TrackChanges(e) {
                    hasChanges = true;
                }


                
                function RowClick(sender, eventArgs) {


                    if (editedRow != null) {
                        hasChanges = false;
                        $find("<%= RadGrid1.MasterTableView.ClientID %>").updateItem(editedRow);
                    }
                }
                function RowDblClick(sender, eventArgs) {
                    editedRow = eventArgs.get_itemIndexHierarchical();
                    document.getElementById ("<%= hdnTempRangeId.ClientID%>").value ="a";
                        $find("<%= RadGrid1.MasterTableView.ClientID %>").editItem(editedRow);
                }
                function GridCommand(sender, args) {
                    if (args.get_commandName() != "Edit") {
                        editedRow = null;
                    }
                }
                function GridCreated(sender, eventArgs) {


                    var gridElement = sender.get_element();
                    var elementsToUse = [];
                    inputs = gridElement.getElementsByTagName("input");
                    for (var i = 0; i < inputs.length; i++) {
                        var lowerType = inputs[i].type.toLowerCase();
                        if (lowerType == "hidden" || lowerType == "button") {
                            continue;
                        }


                        Array.add(elementsToUse, inputs[i]);
                        inputs[i].onchange = TrackChanges;
                    }


                    dropdowns = gridElement.getElementsByTagName("select");
                    for (var i = 0; i < dropdowns.length; i++) {
                        dropdowns[i].onchange = TrackChanges;
                    }


                    setTimeout(function() { if (elementsToUse[0]) elementsToUse[0].focus(); }, 100);
                }


            </script>


        </telerik:RadCodeBlock>
        <telerik:RadAjaxManager ID="AjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadGrid1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                        <telerik:AjaxUpdatedControl ControlID="UniqueValuesListBox" />
                        <telerik:AjaxUpdatedControl ControlID="UsrSelectedValueListBox" />
                        <telerik:AjaxUpdatedControl ControlID="labelSucess" />
                        <telerik:AjaxUpdatedControl ControlID="labelError" />
                        <telerik:AjaxUpdatedControl ControlID="RCBOptions" />
                        <telerik:AjaxUpdatedControl ControlID="TxtRangeName" />
                        <telerik:AjaxUpdatedControl ControlID="txtGroupName" />
                        <telerik:AjaxUpdatedControl ControlID="txtDescription" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
        <div class="subPage">
            <table class="bgSub" border="0" cellpadding="0" cellspacing="0">
                <tr>
                    <td class="bgSub_top">
                </tr>
                <tr>
                    <td valign="top" align="center" class="bgSub_mid">
                        <div class="roundCorner headBgLinr" style="text-align: left;">
                            <div class="margin_05">
                                <strong>Data Fileds</strong></div>
                            <div class="strightLine">
                                <telerik:RadTabStrip ID="AnswerGenMyGrouping" runat="server" AutoPostBack="True"
                                    EnableEmbeddedSkins="false" Skin="blueNew" ScrollChildren="True" Width="500px"
                                    ScrollButtonsPosition="Middle" SelectedIndex="0">
                                    <Tabs>
                                        <telerik:RadTab Text="Text">
                                        </telerik:RadTab>
                                        <telerik:RadTab Text="Num">
                                        </telerik:RadTab>
                                    </Tabs>
                                </telerik:RadTabStrip>
                            </div>
                            <div>
                                <table border="0" cellpadding="5" cellspacing="0">
                                    <tr>
                                        <td valign="top" align="left" rowspan="6">
                                            <div class="headTxt">
                                                Data Fields</div>
                                            <div>
                                                <telerik:RadListBox runat="server" ID="ListBox_SSM" SelectionMode="Single" Height="400px"
                                                    Width="250px">
                                                </telerik:RadListBox>
                                            </div>
                                            <asp:Button ID="btnGetData" Text="GetData" runat="server" OnClick="btnGetData_Click" />
                                        </td>
                                        <td valign="top" align="left" rowspan="6">
                                            <div class="headTxt">
                                                Data Fields</div>
                                            <div>
                                                <telerik:RadListBox runat="server" ID="UniqueValuesListBox" AllowReorder="false"
                                                    EnableDragAndDrop="true" AllowTransferOnDoubleClick="true" AllowTransferDuplicates="false"
                                                    SelectionMode="Multiple" EnableEmbeddedSkins="false" Skin="Windows7New" Height="400px"
                                                    Width="250px" AllowTransfer="true" TransferMode="Copy" Localization-ToLeft="Remove"
                                                    Localization-ToRight="Add" TransferToID="UsrSelectedValueListBox">
                                                    <ButtonSettings HorizontalAlign="Right" VerticalAlign="Middle" Position="Right" RenderButtonText="true"
                                                        AreaWidth="105px" ShowTransferAll="false" />
                                                </telerik:RadListBox>
                                            </div>
                                        </td>
                                        <td valign="top" align="left" rowspan="6">
                                            <div class="headTxt">
                                                Data Fields</div>
                                            <div>
                                                <telerik:RadListBox runat="server" ID="UsrSelectedValueListBox" AllowReorder="false"
                                                    EnableDragAndDrop="true" AllowTransferDuplicates="false" SelectionMode="Multiple"
                                                    EnableEmbeddedSkins="false" Skin="Windows7New" Height="400px" Width="250px">
                                                    <%--<ButtonSettings HorizontalAlign="Right" VerticalAlign="Middle"
                                                    Position="Right" RenderButtonText="true" AreaWidth="105px" ShowTransferAll="false" />--%>
                                                </telerik:RadListBox>
                                            </div>
                                        </td>
                                        <td valign="top" align="left">
                                            <span>Select Option</span>
                                        </td>
                                        <td valign="top" align="left">
                                            <telerik:RadComboBox ID="RCBOptions" runat="server" Width="125px" />
                                            <%--                                        <asp:DropDownList ID="ddlOptions" runat="server"  Width="75px"/>--%>
                                        </td>
                                        <td valign="middle" align="left" rowspan="2">
                                            <asp:Button ID="btnAddRange" runat="server" Text="Add Range" OnClick="BtnClick_AddRange" />
                                        </td>
                                    </tr>
                                    <tr>
                                        <td valign="top" align="left">
                                            <span>Range Name</span>
                                        </td>
                                        <td valign="top" align="left">
                                            <telerik:RadTextBox ID="txtRangeName" runat="server" />
                                        </td>
                                    </tr>
                                    <tr>
                                        <td valign="top" align="left" colspan="3">
                                            <telerik:RadGrid ID="RadGrid1" runat="server" GridLines="None" EnableEmbeddedSkins="True"
                                                AllowSorting="True" OnDeleteCommand="RadGrid1_DeleteCommand" AutoGenerateColumns="False"
                                                Width="340px" OnItemDataBound="RadGrid1_ItemDataBound" AllowAutomaticUpdates="false"
                                                AllowAutomaticInserts="false" AllowFilteringByColumn="false">
                                                <MasterTableView DataKeyNames="RowNum,Option" EditMode="InPlace" GridLines="None"
                                                    Width="100%" NoMasterRecordsText="No data fields to display.." HeaderStyle-HorizontalAlign="Center">
                                                    <Columns>
                                                        <telerik:GridBoundColumn ReadOnly="true" DataField="RowNum" Visible="false" HeaderText="RowNum"
                                                            UniqueName="Measure_ID">
                                                        </telerik:GridBoundColumn>
                                                        <telerik:GridBoundColumn ReadOnly="true" DataField="Option" HeaderText="Option"
                                                            UniqueName="Option">
                                                        </telerik:GridBoundColumn>
                                                        <telerik:GridTemplateColumn HeaderText="Values" UniqueName="Values">
                                                            <ItemTemplate>
                                                                <%#Eval("Values")%>
                                                            </ItemTemplate>
                                                        </telerik:GridTemplateColumn>
                                                        <telerik:GridTemplateColumn ReadOnly="true" HeaderText="ValuesWithCap" UniqueName="ValuesWithCap">
                                                            <ItemTemplate>
                                                                <%#Eval("ValuesWithCap")%>
                                                            </ItemTemplate>
                                                        </telerik:GridTemplateColumn>
                                                        
                                                        <telerik:GridTemplateColumn HeaderText="Range Name" UniqueName="RangeName">
                                                            <ItemTemplate>
                                                                <%#Eval("RangeName")%>
                                                            </ItemTemplate>
                                                        </telerik:GridTemplateColumn>
                                                        <telerik:GridButtonColumn CommandName="Delete" HeaderText="Delete" ButtonType="ImageButton"
                                                            ImageUrl="~/Images/btn/btn_delete.gif" UniqueName="Delete">
                                                        </telerik:GridButtonColumn>
                                                    </Columns>
                                                </MasterTableView>
                                                <ClientSettings>
                                                    <ClientEvents OnRowClick="RowClick" OnRowDblClick="RowDblClick" OnGridCreated="GridCreated"
                                                        OnCommand="GridCommand" />
                                                </ClientSettings>
                                            </telerik:RadGrid>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td valign="top" align="left">
                                            <span>Group Name</span>
                                        </td>
                                        <td valign="top" align="left" colspan="2">
                                            <telerik:RadTextBox runat="server" ID="txtGroupName" />
                                            <%-- <asp:TextBox ID="txtGroupName" runat="server" />--%>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td valign="top" align="left">
                                            <span>Description</span>
                                        </td>
                                        <td valign="top" align="left" colspan="2">
                                            <telerik:RadTextBox runat="server" ID="txtDescription" TextMode="MultiLine" />
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                        </td>
                                        <td valign="top" align="left" colspan="2">
                                            <asp:Button ID="btnGenerate" runat="server" Text="Generate" OnClick="CmdGenerate_Click" />
                                            <asp:Button ID="btnReset" runat="server" Text="Reset" />
                                            <asp:HiddenField ID="hdnGroup_Detail_List" runat="server" />
                                            <asp:HiddenField ID="hdnGroupId" runat="server" />
                                            <asp:HiddenField ID="hdnMetaDataColumnName" runat="server" />
                                            <asp:HiddenField ID="hdnTempRangeId" runat="server" />
                                        </td>
                                    </tr>
                                </table>
                            </div>
                            <div>
                                <div class="">
                                    <%--<telerik:RadGrid ID="AdvancedGrid_ssm" runat="server" GridLines="None" EnableEmbeddedSkins="True"
                                        AllowPaging="True" PageSize="10" AllowSorting="True" AutoGenerateColumns="False"
                                        Width="1140px" AllowAutomaticUpdates="false" AllowAutomaticInserts="false" AllowFilteringByColumn="false"
                                        OnDeleteCommand="AdvancedGrid_DeleteCommand" OnItemDataBound="AdvancedGrid_ssm_ItemDataBound"
                                        >
                                        <PagerStyle Mode="NextPrevAndNumeric" AlwaysVisible="true"></PagerStyle>
                                        <HeaderStyle VerticalAlign="Top" Wrap="false" />
                                        <MasterTableView DataKeyNames="Measure_ID,Measure_Name" EditMode="InPlace" GridLines="None"
                                            Width="100%" ClientDataKeyNames="Measure_ID" NoMasterRecordsText="No data fields to display.."
                                            HeaderStyle-HorizontalAlign="Center">
                                            <Columns>
                                                <telerik:GridBoundColumn ReadOnly="true" DataField="Measure_ID" Visible="false" HeaderText="Measure ID"
                                                    UniqueName="Measure_ID">
                                                </telerik:GridBoundColumn>
                                                <telerik:GridBoundColumn ReadOnly="true" DataField="Measure_Name" HeaderText="Measure Name"
                                                    UniqueName="Measure_Name">
                                                </telerik:GridBoundColumn>
                                                <telerik:GridTemplateColumn HeaderText="Measure" UniqueName="GeneratedMeasure">
                                                    <ItemTemplate>
                                                        <%#Eval("GeneratedMeasure")%>
                                                    </ItemTemplate>
                                                </telerik:GridTemplateColumn>
                                                <telerik:GridTemplateColumn HeaderText="Format String" UniqueName="FormatString">
                                                    <ItemTemplate>
                                                        <%#Eval("FormatString")%>
                                                    </ItemTemplate>
                                                </telerik:GridTemplateColumn>
                                                <telerik:GridTemplateColumn ItemStyle-Width="30%" HeaderText="Width" UniqueName="Width"
                                                    SortExpression="Width" DataField="Width">
                                                    <ItemTemplate>
                                                        <%#Eval("Width")%>
                                                    </ItemTemplate>
                                                </telerik:GridTemplateColumn>
                                                <telerik:GridTemplateColumn HeaderText="Created By" UniqueName="CreatedBy">
                                                    <ItemTemplate>
                                                        <%#Eval("CreatedBy")%>
                                                    </ItemTemplate>
                                                </telerik:GridTemplateColumn>
                                                <telerik:GridButtonColumn CommandName="Delete" HeaderText="Delete" ButtonType="ImageButton"
                                                    ImageUrl="~/Images/btn/btn_delete.gif" UniqueName="Delete">
                                                </telerik:GridButtonColumn>
                                            </Columns>
                                        </MasterTableView>
                                        <ClientSettings>
                                            <Resizing AllowRowResize="True" EnableRealTimeResize="True" ResizeGridOnColumnResize="false"
                                                AllowColumnResize="True"></Resizing>
                                            <ClientEvents OnRowDblClick="RowDblClickAdvanced" OnGridCreated="GridCreatedAdvanced"
                                                OnCommand="GridCommandAdvanced" />
                                        </ClientSettings>
                                    </telerik:RadGrid>--%>
                                </div>
                            </div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td class="bgSub_btm">
                </tr>
            </table>
        </div>
    </asp:Content>


    Thanks
    Alexis 
Back to Top