не может найти html-элементы внутри вкладок ajaxtoolkit tabcontainer при использовании js

Я использую Asp.net 4 С# 2010. У меня есть две вкладки, использующие ajaxtoolkit tabcontainer, и я хочу обратиться к элементам внутри с помощью javascript.

<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

<ajaxToolkit:TabContainer runat="server" ScrollBars="Auto" ActiveTabIndex="0"        
    OnDemand="true" AutoPostBack="false" TabStripPlacement="Top"
    CssClass="ajax__tab_xp" VerticalStripWidth="120px" ID="TabContainer">

        <ajaxToolkit:TabPanel ID="canvas1Tab" runat="server" Enabled="true"
    ScrollBars="Auto" OnDemandMode="Once">
     <ContentTemplate>

   <canvas id="canvas1" width="300" height="300" />
    Your browser doesn't support html 5 or Canvas. Please upgrade to the lasted 
             </canvas>

    </ContentTemplate>
</ajaxToolkit:TabPanel>

        <ajaxToolkit:TabPanel ID="canvas2Tab" runat="server" Enabled="true"
    ScrollBars="Auto" OnDemandMode="Once">
     <ContentTemplate>

   <canvas id="canvas2" width="300" height="300" />
    Your browser doesn't support html 5 or Canvas. Please upgrade to the lasted 
             </canvas>

    </ContentTemplate>
</ajaxToolkit:TabPanel>
</ajaxToolkit:TabContainer>

Теперь я хочу нарисовать кое-что на холстах внутри вкладок, используя javaScript. Когда страница загружается, первая вкладка является выбранной.

Я пытаюсь обратиться к двум холстам на $(document).ready.

Всякий раз, когда используется команда JavaScript document.getElementById, обнаруживается первый холст (тот, на котором выбрана вкладка), но другой (canvas2) выдает ошибку.

Просто для протокола, я проверил это с помощью asp-control (хотя это не то, что мне нужно). Я попытался добавить asp:TextBox на вторую вкладку, а затем использовать document.getElementById("<%=TextBox1.ClientID%>"), но это дает мне

Uncaught ReferenceError: MainContent_TabContainer_canvas2Tab_TextBox1 не определен

Надеюсь, я ясно выразился.

Что я могу сделать, чтобы это сработало?


person Programer    schedule 17.10.2012    source источник
comment
Какой результат вы получите, если вы выберете вторую вкладку вручную до запуска вашего document.getElementById() ? Я предполагаю, что вторая вкладка загружается только после того, как она выбрана и еще не существует.   -  person eX0du5    schedule 17.10.2012
comment
хм... наверное... это дает мне представление, где искать...   -  person Programer    schedule 17.10.2012


Ответы (1)


Кажется, я нашел способ загрузить все вкладки сразу. ajaxToolkit: TabContainer имеет свойство OnDemand.

OnDemand - Whether to render/load tabs onDemand or all at page load

Если вы установите для OnDemand значение true, вы можете добавить на каждую вкладку свойство OnDemandMode

OnDemandMode - When container's onDemand is true then whether to load tab - Always, Once, None

Ключ в том, чтобы установить

OnDemand=false Это заставляет все вкладки загружаться сразу, а не при нажатии на них.

person Programer    schedule 17.10.2012