CODEWITHSUNDEEP
vb.netasp.net-ajaxformatting
Maen
Maen

Reputation: 1030

How to refer to a control that exists within an Ajax Tab?

I have a problem with using a script that adds a NiceEdit toolbar to a text area when that text area is within an Ajax tab.

I want to know if I should refer to it in a different way than just the ID.

I mean the ID of that text area, I tried to take the text area outside the Tab Container, it works, but when I return it, it simply doesn't.

<%@ Page Language="VB"  ValidateRequest ="false" AutoEventWireup="false" CodeFile="tabbedNiceEditt.aspx.vb" Inherits="Client_tabbedNiceEditt" %>
<script src="../nicEdit/nicEdit.js" type="text/javascript"></script>

<script type="text/javascript">
bkLib.onDomLoaded(function() {
new nicEditor({buttonList : ['fontSize','fontFamily','fontFormat','bold','italic','underline','strikethrough','forecolor','bgcolor','removeformat'], iconsPath : '../nicEdit/nicEditorIcons.gif'}).panelInstance('txt');
});
</script>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
    <script type="text/javascript">

      function pageLoad() {
      }

    </script>
</head>
<body>
    <form id="form1" runat="server">

    <div>


        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <cc1:TabContainer ID="TabContainer1" runat="server">
        <cc1:TabPanel ID= "first" runat ="server" >
        <ContentTemplate>
        <b>Stuff Goes HERE</b>
        <br />
        <asp:TextBox ID = "txt" name = "txt" runat ="server" TextMode ="MultiLine" Height = "256" Width = "256">
        </asp:TextBox>
        <br />
        <br />
        <asp:Button id  = "btn" runat ="server" Text = "click" />
        </ContentTemplate>
        </cc1:TabPanel>
        <cc1:TabPanel ID = "second" runat ="server" >
        <ContentTemplate>
        <b>More Stuff for second tab</b>
        </ContentTemplate>
        </cc1:TabPanel>
        </cc1:TabContainer>
    </div>
    </form>
</body>
</html>

Upvotes: 1

Views: 919

Answers (1)

ybo
ybo

Reputation: 17152

txt is the server ID of your control, you have to use the client ID :

....panelInstance('<%= txt.ClientID %>');

Basically, the client ID is derived from the server ID and the naming container where your control is, to avoid any naming conflict. When your text area is not in the Ajax Tab, the client ID is the same as the server ID. When you put the text area in the Ajax Tab, it's client ID is different (you can check that by looking at the page source in your browser).

EDIT:

From Maen

I viewed the page in browser, checked the ID in the page source, it was "TabContainer1$first$txt", used it instead of "txt" and the script was like: panelInstance('<%= txt.TabContainer1$first$txt %> I got an error: BC30456: 'TabContainer1' is not a member of 'System.Web.UI.WebControls.TextBox'.

That's not what I meant : you have to put panelInstance('<%= txt.ClientID %>') in your source code, and asp.net will convert that to panelInstance('TabContainer1$first$txt').

I told you to check the page source in the web browser just to see that the client Id was no longer "txt", but that it was constructed from the server ID and the naming container.

Upvotes: 2

Related Questions