views:

476

answers:

1

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"&gt;

<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<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>
+2  A: 

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.

ybo
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'.
Maen
@Maen, see my edit
ybo
Sorry to take so much of your time, but excuse my newbieness :P What should I do now and in simple word? should the code be exactly:....panelInstance('<%= txt.ClientID %>')If so, I did it, no errors, but still the script is not working, the text area "txt" is not getting any formatting panels..!!?
Maen
The only thing you should have to do is to take your original code you posted here and replace panelInstance('txt') with panelInstance('<%= txt.ClientID %>'). If this doesn't work, please look at the rendered page on your browser and compare the id of the text area and the one in javascript.
ybo
Now I understand, I rendered it and in the page code I found out that the result was:...panelInstance('panelInstance('TabContainer1_first_txt')'); While the result for the text area was:<textarea name="TabContainer1$first$txt"......etc...I guess thats the problem, right?
Maen
Please (1) check your source code, it is not normal to have "panelInstance" twice and (2) make sure that you compare the id in the script with the *id* of the textarea, *not its name*.
ybo
You are great man, I agree, its not normal to have panelInstance twice, I also compared the id from the script in page source, and id of text area and -instead of name- they were both TabContainer1_first_txt, but still the problem of the two panelInstance...what might be wrong??!!
Maen
I suspect your source code to be wrong, are you sure you didn't write "panelInstance('panelInstance('<%= txt.ClientID %>')');" instead of "panelInstance('<%= txt.ClientID %>');" ? Please check.
ybo
Man allow me to bow to you :) you are a genius, its working, all is fine now, I swear to God you are lucky you are not around, otherwise I would have hugged you -in a 100% heterosexual way- ... thanks a lot mate...deeply appreciated..
Maen
You're welcome, but I do not allow anyone to bow to me :)
ybo