i am trying to manipulate an ajaxcontroltoolkit tab container in clientside javascript. i found the following sample code :

<script type="text/javascript">
    var i = 3;
    function createnew() {


        CreateNewTabPanel('TabContainer1', 'TabPanel' + i, 'TabPanel' + i, 'TabPanel' + i);
        i++;




    }


    function CreateNewTabPanel(tabContainerID, tabPanelID, headerText, bodyText) {
        //create header
        var header = document.createElement('span');
        header.id = "__tab_" + tabContainerID + tabPanelID;
        header.innerHTML = headerText;
        $get(tabContainerID + "_header").appendChild(header);


        //create content
        var body = document.createElement('div');
        body.id = tabContainerID + "_" + tabPanelID;
        body.style.display = "none";
        body.style.visibility = "hidden";
        body.innerHTML = bodyText;
        body.cssClass = "ajax__tab_panel";
        $get(tabContainerID + "_body").appendChild(body);




        $create(AjaxControlToolkit.TabPanel, { "headerTab": $get(header.id) }, null, { "owner": tabContainerID }, $get(body.id));




    }




</script>
<body>
    <form id="form1" runat="server">
    <ajaxToolkit:ToolkitScriptManager runat="Server" EnablePartialRendering="true" ID="ScriptManager1" />
<span id="mes"></span><br />
<span id="mes1"></span>
    <ajaxToolkit:TabContainer runat="server" ID="TabContainer1"   >
            <ajaxToolkit:TabPanel runat="server" ID="TabPanel1" HeaderText="TabPanel1">
                <HeaderTemplate>
                    TabPanel1
                </HeaderTemplate>
            <ContentTemplate>
                TabPanel1
            </ContentTemplate>
        </ajaxToolkit:TabPanel>
                    <ajaxToolkit:TabPanel runat="server" ID="TabPanel2" HeaderText="TabPanel2">
            <ContentTemplate>
                TabPanel2
            </ContentTemplate>
        </ajaxToolkit:TabPanel>
    </ajaxToolkit:TabContainer>


    <input type="button" onclick="createnew()" value="create a new pane" />


    </form>
</body>

when i use this in a webform i get the following error

Microsoft JScript runtime error: 'AjaxControlToolkit' is undefined

the error happens at this line :

$create(AjaxControlToolkit.TabPanel, { "headerTab": $get(header.id) }, null, { "owner": tabContainerID }, $get(body.id)); 

I have the control toolkit installed, but i cant figure out what i need to do to be able to access the js runtime library. Do i need to download the source code and reference the js files, or do i need any other pre requisites? Any help is greatly appreciated

Thanks

Paul

share|improve this question
You most likely need to add some script include to your page. – jbabey Jan 22 at 15:21
feedback

Know someone who can answer? Share a link to this question via email, Google+, Twitter, or Facebook.

Your Answer

 
or
required, but never shown
discard

By posting your answer, you agree to the privacy policy and terms of service.

Browse other questions tagged or ask your own question.