Question

我有多行包含文件上传控件，在特定行的onchange事件上fileupload控件我选择第一列文本并通过ajax请求发送它的值。

$(document).on('change','#uploadSupportingDoc',function(){
   console.log("on change called!");
   var questionId = $(this).parent().siblings(":first").text(); // 1st column

   console.log("fileUpload called with Id =>"+questionId);
   uploadFile(questionId,this);

});

但是有一列（使用css类.fileuploadSuccess）我想更改图标以显示上传成功或失败。

function uploadFile(questionId,row){
console.log("fileUpload called with Id =>"+questionId);

var isUploaded = false;
$('#uploadSupportingDoc').fileupload({
    url: 'uploadSupportingDoc.html',
    formData: {questionId: questionId },
    acceptFileTypes: /(\.|\/)(jpe?g)$/i,
    maxFileSize: 100,
    dropZone: null,
    pasteZone: null,
    fileInput: $(this),
    dataType: 'json',
    add: function(e, data){

        $(row).closest('tr').children('td.fileuploadSuccess').html('<img src="./img/ajax-loader.gif" alt="Uploading..." />');
        data.submit();
    },
    done: function (e, data){
        var response = data.result.files[0];

        if(!response.isRequestValid)
        {
            window.location = "requestDenied.html";
        }
        else
        {
            if(response.status)
            {
                $(row).closest('tr').children('td.fileuploadSuccess').html("<span class=\"glyphicon glyphicon-ok\" aria-hidden=\"true\"></span>")
            }
            else
            {
                $(row).closest('tr').children('td.fileuploadSuccess').html("<span class=\"glyphicon glyphicon-remove\" aria-hidden=\"true\"></span>")               
            }
        }
    },
    fail: function(e, data){
        console.log("failed");
        console.log(data.jqXHR.responseText);
        console.log(data.jqXHR+"\m");
    },
    always: function (e, data){

    }
 });


}

我试过这样发送，

uploadFile(questionId,this);

并试图像这样访问它，

$(row).closest('tr').children('td.fileuploadSuccess').html("<span class=\"glyphicon glyphicon-ok\" aria-hidden=\"true\"></span>");

然而，这不起作用，每次更改第一行列的值。为什么会这样？这种要求的任何解决方案？

Answer 1

实际上，你不需要在那里传球。传递要更新html的元素：

$(document).on('change','#uploadSupportingDoc',function(){
   console.log("on change called!");
   var questionId = $(this).parent().siblings(":first").text(); // 1st column
   console.log("fileUpload called with Id =>"+questionId);

   var cell = $(this).parent().siblings('.fileuploadSuccess');
   uploadFile(questionId, cell);

});

将function uploadFile(questionId,row){更改为function uploadFile(questionId,cell){

然后你可以简化： $(row).closest('tr').children('td.fileuploadSuccess').html(..);

要 cell.html(...);

怎么能改变事件的这个＆＃39;反对其他功能？

1 个答案: