Question

在我的表单中，我有AJAX选项卡控件，里面有jQuery DateTime Picker。

DateTimePicker在AJAX选项卡控件之外工作正常，但在其内部无法正常工作。以下是我的设计来源。任何人都可以帮我解决这个问题吗？

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.8.21/jquery-ui.min.js"></script>
<link rel="stylesheet" media="all" type="text/css" href="http://code.jquery.com/ui/1.8.21/themes/ui-lightness/jquery-ui.css"
/>
<link rel="stylesheet" media="all" type="text/css" href="css/jquery-ui-timepicker-addon.css"
/>
<script type="text/javascript" src="js/jquery-ui-timepicker-addon.js"></script>
<script type="text/javascript" src="js/jquery-ui-sliderAccess.js"></script>
<script type="text/javascript">
    $(function () {

        $('#txtTimeStarts').datetimepicker({
            ampm: true
        });
    });
</script>
<script type="text/javascript">
    $(function () {

        $('#txtDefTimeStarts').datetimepicker({
            ampm: true
        });
    });
</script>

身体部位：

      <asp:UpdatePanel ID ="OfferDeal" runat ="server">
            <ContentTemplate>
             <cc1:Tabcontainer CssClass="Tab" id="TabContainer1" runat="server"  
                  activetabindex="0" AutoPostBack="True" >

 <cc1:TabPanel runat="server" HeaderText="Define Loyalty Offer" ID="TabPanel1"  >


            <ContentTemplate>
            <div class="createoffer">
              <div class="setup-offer"  style="display:block;">
                <div class="sec-main"><span class="sec-title">Define your offer</span> <span class="note">For example: "Buy 7 coffee drinks and get the next one free" or "Make 10 purchases over $25 and receive 10% off your next purchase"</span>
                  <div class="textareafld">
                    <div class="field">
                      <%--<label for="txtareOffer1" class="infield">Lorem ipsum dolor sit amet, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat.</label>--%>
                     <%-- <textarea class="textfield" id="txtF9" ></textarea>--%>

                        <asp:TextBox ID="txtareaOfferDesc" runat="server" CssClass="textfield" 
                            TextMode="MultiLine" ></asp:TextBox>
                    </div>
                  </div>
                </div>
                <div class="sec-main"><span class="sec-title">Define Offer Validity:</span>
                  <div class="datefld">
                    <label class="name">Offer start date</label>
                    <div class="field">
                      <asp:TextBox ID="txtTimeStarts" runat="server" CssClass="textfield"></asp:TextBox>
                         <span class="date"></span>            
                    </div>
                    <span class="error">Error message</span></div>
     </ContentTemplate>

    </cc1:TabPanel>
<cc1:TabPanel runat="server" HeaderText="Define Deals" ID="TabPanel2" class="pannel_outer">
 <ContentTemplate>
              <div class="setup-offer" style="display:block; border:1px solid #ddd; margin:0px 0 0 3px;">
                <div class="sec-main"><span class="sec-title">Define your Deal</span> <span class="note">For example: "Buy 7 coffee drinks and get the next one free" or "Make 10 purchases over $25 and receive 10% off your next purchase"</span>
                  <div class="textareafld">
                      <asp:TextBox ID="txtDefineDeal" runat="server" CssClass="textfield" 
                          TextMode="MultiLine"></asp:TextBox>
                    </div>
                </div>
                <div class="sec-main"><span class="sec-title">Define Offer Validity:</span>
                  <div class="datefld">
                    <label class="name">Offer start date</label>
                    <div class="field">
                      <asp:TextBox ID="txtDefTimeStarts" runat="server" CssClass="textfield"></asp:TextBox>
                        <span class="date"></span>
                    </div>
                    <span class="error">Error message</span></div>
 </ContentTemplate>
            </cc1:TabPanel>
        </cc1:Tabcontainer>
        </ContentTemplate></asp:UpdatePanel>

Answer 1

感谢所有

它的工作方式是更换ID，如下所示：

txtTimeStarts to #Tabcontainer_TabPanel1_txtTimeStarts 
txtTimeEnds to #Tabcontainer_TabPanel2_txtTimeEnds

因为默认情况下它将ajax标签控件ID设为parentID

jQuery DateTime Picker在AJAX Tab Control中不起作用

1 个答案: