Question

如何在Web窗体母版页上使用JQuery来访问HTML文本输入控件的值，该控件位于Ajax Control Toolkit手风琴窗格中，该窗格位于Web窗体内容页面上？

我有一个名为Site.Master的母版页，内容页面进入名为MainContent的占位符。一些视觉效果：

的Site.Master ：

<body>
  <form runat="server">
    <asp:ScriptManager runat="server">
      <scripts>...</scripts>
    </asp:ScriptManager>

    <div class="container body-content">
      <asp:ContentPlaceHolder ID="MainContent" runat="server">
    </asp:ContentPlaceHolder>
...

这是我的手风琴（它位于内容页面（Default.aspx）中;内容页面位于上面的MainContent占位符中）：

<ajaxToolkit:Accordion 
    ID="Accordion1" 
    runat="server"
    HeaderCssClass="accordionHeader"
    HeaderSelectedCssClass="accordionHeaderSelected"
    max-height="300px"
    ContentCssClass="accordionContent"
    AutoSize="None"
    FadeTransitions="true"
    TransitionDuration="250"
    FramesPerSecond="40"
    EnableViewState="true"
    RequireOpenedPane="false"
    SuppressHeaderPostbacks="true">
    <Panes>
...
        <ajaxToolkit:AccordionPane 
            ID="AccordionPane1" 
            runat="server">
            <Header>
                Use a list
            </Header>
            <Content>
                <asp:UpdatePanel ID="UpdatePanel3" runat="server">
                    <ContentTemplate>
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="file-upload-container">
                                    <div class="input-group">
                                        ...
                                        <input 
                                            class="form-control"
                                            id="Text03" 
                                            placeholder="Browse or enter a file"
                                            runat="server"
                                            style="border: none"
                                            type="text" />
                                    </div>
                                    ...
                                </div>
                            </div>
                        </div>
                    </ContentTemplate>
                </asp:UpdatePanel>
            </Content>
        </ajaxToolkit:AccordionPane>
    </Panes>
</ajaxToolkit:Accordion>

这是我的JQuery，它接收HTML文件输入的文本结果并将其复制到相应的HTML文本输入中（Text03，上面）：

<script type="text/javascript">
    $(document).ready(function () {
        $("#file-upload-button").change(function () {
            var fileName = $(this).val().split("\\").pop();
            var txtBoxID= <%# MainContent.FindControl("Text2").ClientID %>;
            $(txtBoxID).val(fileName);
        });
        $("#file-upload-button2").change(function () {
            var fileName = $(this).val().split("\\").pop();
            var txtBoxID= <%# MainContent.FindControl("Text03").ClientID %>;
            $(txtBoxID).val(fileName);
        });
        ...
    });
</script>

它只适用于＆＃34; Text2＆＃34;功能。但是当我尝试添加＆＃34; Text03＆＃34;函数，它给了我这个错误，第30行突出显示：

Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.

Exception Details: System.NullReferenceException: Object reference not set to an instance of an object.

Source Error:


Line 28:             $("#file-upload-button2").change(function () {
Line 29:                 var fileName = $(this).val().split("\\").pop();
Line 30:                 var txtBoxID= <%# MainContent.FindControl("Text03").ClientID %>;
Line 31:                 $(txtBoxID).val(fileName);
Line 32:             });

我的控制方式不存在吗？有某种约束问题吗？我很感激任何建议，我已经在这里扔了一整天了。谢谢！

Answer 1

您无法直接在代码中引用它，因为它位于ContentTemplate内。请尝试将其添加为指标类，例如class="form-control text03"，然后通过$(".text03").val(fileName);引用它。

使用JQuery访问控件时遇到问题

1 个答案: