AsyncFileUpload Inside Listview Insert、Edit Itemtemplate 和 EmptyData Template 将不起作用

Question

AsyncFileUpload 在 Listview Insert、Edit Itemtemplate 和 EmptyData Template 中不起作用。

以上是我的客户端函数

function AttachmentUploadSuccessful() {
    debugger;
    var textError = $(".AttachmentError").text();
    if (textError.length > 0) {
        var text = $(".AttachmentError");
        text.innerText = text.textContent = textError;
        sender._onError(textError); // it will raise the OnClientUploadError event
        return;
    } else {

        //alert(" File attachment is uploaded successfully.");
        //CODE TO  REMOVE FILE AND BACKGROUND COLOR OF FILE UPLOADER
        $('.ModelBackgroundforCreateItem').hide();
        $('.PopupPanel').hide();
        var UploadControls = $('#<%= FileUpload.ClientID %> :input');
        UploadControls.each(function () {

            //$(this).val("");
            $(this).css('background-color', '#fff');
        });

        //Updating Update panel by clicking button
        $(".RefreshList").click();
    }
}

 function AttachmentUploadFailed() {

    alert("An error occured while uploading  File Attachment. ");
}

.aspx 文件中的标记

<asp:ListView ID="ListView2" runat="server">
    <EmptyDataTemplate>
    <table class="fileUpload" runat="server" id="FileUploadID">
                <tr>
                    <td>
                        <div style="width: 350px; overflow-x: hidden;">
                            <asp:AsyncFileUpload runat="server" ID="FileUpload" ThrobberID="Throbber" OnClientUploadError="AttachmentUploadFailed"
                                OnClientUploadComplete="AttachmentUploadSuccessful" UploaderStyle="Traditional" UploadingBackColor="" Style="display: inline-block; margin-top: 5px;"
                                OnUploadedComplete="FileUpload_UploadedComplete">
                            </asp:AsyncFileUpload>
                        </div>
                    </td>
                    <td style="width: 30px">
                        <asp:Image ID="Throbber" ImageUrl="~/Image/AttachmentLoading.gif" Style="display: None; width: 20px;" runat="server" />
                        <br />
                    </td>
                </tr>
        </table>
        </EmptyDataTemplate>
</asp:ListView>

正在尝试上传文件正在调用客户端事件 OnClientUploadError 无法理解为什么会出错。在简单页面和更新面板内上传相同的文件工作但在列表视图内它给客户端错误。经历了以上 link 问题没有得到准确的答案，请帮助我。

How to find Ajaxfileupload control inside Listview When in Editmode

AsyncFileUpload within EditItemTemplate of ListView

Answer 1

我在您分享的代码中发现了两个问题：

那行代码：var UploadControls = $('#<%= FileUpload.ClientID %> :input')
而且您的标记中没有 ClientIDMode 属性，所以它是 Inherit

这两个问题同源：您在 ListView 中使用 AsyncFileUploader，因此您的页面中将有多个具有 FileUpload id 的元素.

因此，首先您必须将函数声明更改为：

function AttachmentUploadSuccessful(sender, e) { // then you can get the sender

然后，要获得 input，您将使用：

var UploadControls = $(sender._inputFile);

最后，要解决第二个问题，您需要将 ClientIDMode 属性更改为 AutoID，以便 AsyncFileUploader 能够正确找到其引用的客户成员。

AsyncFileUpload Inside Listview Insert、Edit Itemtemplate 和 EmptyData Template 将不起作用

AsyncFileUpload Inside Listview Insert, Edit Itemtemplate and EmptyData Template won't work

javascript

asp.net

listview

asp.net-ajax