PopupControlExtender in GridTemplateColumn

9 posts, 1 answers
  1. Jagat
    Jagat avatar
    135 posts
    Member since:
    Jan 2011

    Posted 01 Feb 2012 Link to this post

    Hello,

       In one of the gridtemplate columns, i have a textbox with popupcontrolextender in which it will have a bigger textbox, so that the user can type in the comments easily. 
    My Scenario is, if i click on the textbox, a popup will be opened with big textbox in it. If i type something in, the content will be copied to the original textbox in the template column. I handled it through code behind.
     If i click on the textbox in the template column again, then the text i entered is displaying in that popup.But the problem is, if i do a postback on the page, and then if i click on that textbox again,the text is not showing up on the popup even though it is displaying in the original textbox.

    My Code:

    <telerik:GridTemplateColumn HeaderText="First IncSrc." UniqueName="MemFirstIncomeSource">
                           <ItemTemplate>
                               <asp:TextBox ID="txtMemFirstIncSrc" runat="server"  ToolTip="First Income Source"  
                                    Width="80px">
                               </asp:TextBox>
                               <asp:PopupControlExtender ID="FirstIncSrcPopEx" runat="server" TargetControlID="txtMemFirstIncSrc"  CacheDynamicResults="true"  
                                   PopupControlID="FirstIncSrcPnl" Position="Left" />
                              <asp:Panel ID="FirstIncSrcPnl" runat="server" CssClass="PopupModalWindow" Style="display: none">
                              
                                           <table>
                                               <tr>
                                                   <td>
                                                       <telerik:RadTextBox ID="txtFirstIncSrc" runat="server"  TextMode="MultiLine" AutoPostBack="true" OnTextChanged="txtFirstIncSrc_TextChanged"
                                                          Width="280px" EmptyMessage="Click Here">
                                                       </telerik:RadTextBox>
                                                   </td>
                                               </tr>
                                           </table>
                                   
                               </asp:Panel>
                           </ItemTemplate>
                       </telerik:GridTemplateColumn>
    protected void txtFirstIncSrc_TextChanged(object sender, EventArgs e)
           {
               RadTextBox txtFirstIncSrc = (RadTextBox)sender;
               PopupControlExtender PopupControlExtender1 = (PopupControlExtender)txtFirstIncSrc.Parent.FindControl("FirstIncSrcPopEx");
               PopupControlExtender1.Commit(txtFirstIncSrc.Text);
     
           }

    So, how do i display the template column textbox text in the popup which will be fired when the textbox is clicked. 

    I don't see any onclick event for the textbox if i want to handle it  through code behind or javascript.

    I have this grid inside a update panel like this...
    <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional"  >
                                        <Triggers>
                                            <asp:AsyncPostBackTrigger ControlID="ButtonAdd" />
                                            <asp:AsyncPostBackTrigger ControlID="btnShow" />                                          
                                            <asp:AsyncPostBackTrigger ControlID="btnHide" />                                        
                                        </Triggers>
                                        <ContentTemplate>
                                            <telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False"
                                                Height="250px"  AllowAutomaticDeletes ="true" 
                                                CellSpacing="0" GridLines="None" ShowFooter="True" Skin="Vista"
                                                Width="1610px" onitemdatabound="RadGrid1_ItemDataBound" >
                                                <HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Default">
                                                    <WebServiceSettings>
                                                        <ODataSettings InitialContainerName="">
                                                        </ODataSettings>
                                                    </WebServiceSettings>
                                                </HeaderContextMenu>
                                                <MasterTableView AllowAutomaticDeletes="True"  DataKeyNames="Number" >
                                                    <CommandItemSettings ExportToPdfText="Export to PDF" />
                                                    <RowIndicatorColumn FilterControlAltText="Filter RowIndicator column" Visible="True">
                                                    </RowIndicatorColumn>
                                                    <ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column" Visible="True">
                                                    </ExpandCollapseColumn>
                                                    <Columns>


    Please see my other post here, which has the complete code:
    http://www.telerik.com/community/forums/aspnet-ajax/grid/problem-in-row-delete-clientside.aspx 


    Thanks
  2. Jagat
    Jagat avatar
    135 posts
    Member since:
    Jan 2011

    Posted 02 Feb 2012 Link to this post

    Any suggestions????
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Abhishek
    Abhishek avatar
    45 posts
    Member since:
    Jul 2012

    Posted 03 Feb 2012 Link to this post

    Hello Jagat,

    Please go through the below link you can get solution to your problem.
    http://www.telerik.com/community/forums/aspnet-ajax/grid/textbox-with-popupcontrolextender.aspx let me know if any issue.

    Thanks,
    Abhishek K
  5. Jagat
    Jagat avatar
    135 posts
    Member since:
    Jan 2011

    Posted 03 Feb 2012 Link to this post

    Hello Abhishek,

      My problem is a bit different to that. I am able to save the value entered in the popup to the grid textbox. But the problem is, if i enter some thing in the popup, i am able to save that text in to the grid textbox and after that if there is a postback, the value entered is not showing up in the popup again if i click the textbox. 

    Thanks
  6. Jagat
    Jagat avatar
    135 posts
    Member since:
    Jan 2011

    Posted 06 Feb 2012 Link to this post

    Any Help..

    Thanks
  7. Andrey
    Admin
    Andrey avatar
    836 posts

    Posted 07 Feb 2012 Link to this post

    Hi,

    I created a sample project to test your case, but on my side everything is working as expected. Give the project a try and check whether it is working on your end.

    Kind regards,
    Andrey
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  8. Jagat
    Jagat avatar
    135 posts
    Member since:
    Jan 2011

    Posted 07 Feb 2012 Link to this post

    Hello Andrey,

     Thanks for the reply. I tried your solution but i couldn't make it work.
     
    The difference i saw was, you are using radajaxmanager where i used the update panel. I replaced my update panel with radajaxmanager and even then it is same.

    In the code behind event, we are putting the value in the popup textbox to the grid column textbox.
     But my question is, we are not copying the grid textbox text to the popup textbox. 

      Do i have to handle it in some event  or would it show up automatically by setting a property? Since the targetcontrolid of the popup is the grid textbox itself.

    If there is no postback, it is showing up. But once if there is any postback on the page, the popup textbox is not displaying the grid textbox text even though there is some text in it.

    Thanks
  9. Answer
    Andrey
    Admin
    Andrey avatar
    836 posts

    Posted 09 Feb 2012 Link to this post

    Hi,

    In order to set the text in the TextBox control which is located in the PopUpExtender you could use DataBinding expressions. Thus you will bind the PopUpExtender text with the same value that is in the Grid's TextBox control.

    As far as the other question, if you want to persist the extender open between postbacks you should preserve somehow its state and for example on PreRender event of RadGrid to recreate its settings, but I am not sure that there is a way to show the extender programmatically.

    This is the code to bind the Text properties for both the Grid's TextBox and for Extender TextBox:

    <telerik:GridTableView DataKeyNames="OrderID" Name="Orders" Width="100%">
                           <Columns>
                               <telerik:GridTemplateColumn HeaderText="First IncSrc." UniqueName="MemFirstIncomeSource"
                                   DataField="OrderID">
                                   <ItemTemplate>
                                       <asp:TextBox ID="txtMemFirstIncSrc" runat="server" ToolTip="First Income Source"
                                           Text='<%#Bind("OrderID") %>' Width="80px">
                                       </asp:TextBox>
                                       <toolkit:PopupControlExtender ID="FirstIncSrcPopEx" runat="server" TargetControlID="txtMemFirstIncSrc"
                                           CacheDynamicResults="true" PopupControlID="FirstIncSrcPnl" Position="Left" />
                                       <asp:Panel ID="FirstIncSrcPnl" runat="server" CssClass="PopupModalWindow" Style="display: none">
                                           <table>
                                               <tr>
                                                   <td>
                                                       <telerik:RadTextBox ID="txtFirstIncSrc" runat="server" TextMode="MultiLine" AutoPostBack="true"
                                                           Text='<%#Bind("OrderID") %>' OnTextChanged="txtFirstIncSrc_TextChanged" Width="280px"
                                                           EmptyMessage="Click Here">
                                                       </telerik:RadTextBox>
                                                   </td>
                                               </tr>
                                           </table>
                                       </asp:Panel>
                                   </ItemTemplate>
                               </telerik:GridTemplateColumn>

    Give this suggestion a try and check whether this is the desired behavior.

    Kind regards,
    Andrey
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  10. Jagat
    Jagat avatar
    135 posts
    Member since:
    Jan 2011

    Posted 09 Feb 2012 Link to this post

    Hello Andrey,

      Thank you. It worked.

    Appreciate the help
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017