Microsoft JScript运行时错误：“ clientUploadComplete”未定义

Question

My user control code throws javascript error.

If I don't include uplNewRequestCreation in the main page, everything works as expected. All the server and client side file upload functions are triggered. The reason for including the update panel in main page is to avoid full page postback.

I have tried several solutions from online sources but none helped.

1. added scriptmanagerproxy to user control page
2. defined the javascript in code behind page_load - this solution worked, but it did not trigger OnUploadedComplete="uplFile1_UploadedComplete"
3. added file upload user control as trigger to the main update panel and changed updatemode to conditional

Error message: After the FileUpload.ascx.cs is initialized, following error message is shown. Microsoft JScript runtime error: 'clientUploadComplete' is undefined

I appreciate your help very much!

Thanks!!!!

Here's my code structure.

User control

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="FileUpload.ascx.cs"
    Inherits="QTrack2.UserControls.FileUpload" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>

<script type="text/javascript">
    function clientUploadComplete(sender, args) {

        document.getElementById('<%= btnTrigger.ClientID %>').click();
    }
</script>

<div style="float: left; margin-left: 0px;">
    <asp:GridView ID="grdUploadControls" runat="server" AutoGenerateColumns="False" OnRowDataBound="grdUploadControls_RowDataBound"
        CssClass="uploadTable" Caption="CIQ Files Required To Be Uploaded">
        <Columns>
            <asp:TemplateField>
                <ItemTemplate>
                    <asp:Label ID="lblCIQType" CssClass="Label" runat="server" Text='<%#Eval("Key")%>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField Visible="false">
                <ItemTemplate>
                    <asp:Label ID="isReqlblCIQType" CssClass="Label" runat="server" Text='<%#Eval("Value")%>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField ControlStyle-CssClass=" ">
                <ItemTemplate>
                    <asp:AsyncFileUpload ID="uplFile1" runat="server" OnUploadedComplete="uplFile1_UploadedComplete"
                        CompleteBackColor="#E5FFE5" ErrorBackColor="#F4ADAE" Width="300" UploaderStyle="Modern"
                        ClientIDMode="AutoID" OnClientUploadComplete="clientUploadComplete"/>
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
    </asp:GridView>
    <asp:HiddenField ID="hdnFileSavePath" runat="server" Value="" />
    <br />
</div>
<div style="float: left; margin-left: 20px; height: 40%; width: 650px; overflow: auto;
    padding-right: 20px;">
  <%--  <asp:UpdatePanel ID="upnlFileDisplayHolder" runat="server">
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="btnTrigger" />
        </Triggers>
        <ContentTemplate>--%>
            <asp:GridView ID="grdFileDisplay" runat="server" AutoGenerateColumns="false" CssClass="uploadTable"
                OnRowDataBound="grdFileDisplay_RowDataBound" Caption="CPM Files Currently Uploaded">
                <Columns>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:Label ID="lblFileType" CssClass="Label" runat="server" Text='<%#Eval("Value")%>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:Label ID="lblFileName" CssClass="Label" runat="server" Text='<%#Eval("Key")%>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:Button ID="btnDeleteFile" CssClass="button" runat="server" Text="Remove" OnClick="btnDeleteFile_Click" />
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
            </asp:GridView>
            <div>
                <asp:Button ID="btnTrigger" runat="server" Text="fdkl" Style="display: none;" OnClick="btnTrigger_Click" />
            </div>
       <%-- </ContentTemplate>
    </asp:UpdatePanel>--%>
</div>
<div style="clear: both">
</div>

Main page calling user control

<%@ Page Title="New Request" Language="C#" MasterPageFile="~/Site.IM.master" AutoEventWireup="true"
    CodeBehind="GenericNewRequest.aspx.cs" Inherits="QTrack2.CreatorPages.NewRequest.Scripts.Generic.GenericNewRequest" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<%@ Register TagPrefix="uc1" TagName="fileUploadUserControl" Src="~/UserControls/FileUpload.ascx" %>
<%@ Register TagPrefix="uc2" TagName="ciqValidationUserControl" Src="~/UserControls/ciqValUserControl.ascx" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
    <script type="text/javascript">
        // This function is called whenever the user selects expected completion date from view # 3.
        // This function checks if the selected date is less than currentDate and sets to the currentDate if true.

        function checkSelectedDate(sender, args) {
            if (sender._selectedDate < new Date()) {
                var previouslySelectedDate = sender._textbox.value;
                sender._selectedDate = new Date();
                // set the date back to the current date
                sender._textbox.set_Value(sender._selectedDate.format(sender._format))
            }
        }

    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <asp:UpdatePanel ID="uplNewRequestCreation" runat="server">
    <ContentTemplate>
    <asp:MultiView ID="mviewNewRequestCreation" runat="server" ActiveViewIndex="0">
       <View #1>
        .....
       </View #1>

       <View # 2>
           <uc1:fileUploadUserControl ID="multUplUserCntrol1" runat="server" />
          .....
       </View # 2>

       <View # 3>
       ....
       </View #3>
   </asp:MultiView>
   </ContentTemplate>
</asp:UpdatePanel>

Answer 1

It is clear your Javascript function is not being registered within the update panel, you can do this:

• Declare this function clientUploadComplete outside the User Control and outside the Update Panel.

Or also you can:

• Call the document.getElementById('<%= btnTrigger.ClientID %>').click(); function not using a javascript function, something like this...

  OnClientUploadComplete="document.getElementById('btnTrigger_clientName').click()"