Home / Community & Support / Developer Productivity Tools Forums / ASP.NET AJAX > Grid > PopupControlExtender in GridTemplateColumn

• Jagat

  Posted on Feb 1, 2012 (permalink)

  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
  

  Reply

• Jagat

  Posted on Feb 2, 2012 (permalink)

  Any suggestions????
  

  Reply


• Abhishek

  Posted on Feb 3, 2012 (permalink)

  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

  Reply

• Jagat

  Posted on Feb 3, 2012 (permalink)

  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
  

  Reply

• Jagat

  Posted on Feb 6, 2012 (permalink)

  Any Help..
  
  Thanks
  

  Reply

• Andrey Andrey

  Posted on Feb 7, 2012 (permalink)

  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 >>

  Attached files

  • PopUpExtender.zip

  Reply

• Jagat

  Posted on Feb 7, 2012 (permalink)

  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
  

  Reply

• Answer Andrey Andrey

  Posted on Feb 9, 2012 (permalink)

  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 >>

  Reply

• Jagat

  Posted on Feb 9, 2012 (permalink)

  Hello Andrey,
  
    Thank you. It worked.
  
  Appreciate the help
  

  Reply

Back to Top

Home / Community & Support / Developer Productivity Tools Forums / ASP.NET AJAX > Grid > PopupControlExtender in GridTemplateColumn