为什么只有一个脚本值从表中回复到操作?

时间:2014-09-05 13:51:45

标签: javascript jquery html ajax asp.net-mvc-3

我会根据需要发布更多代码我只是不想放弃一个巨大的块,如果我可以避免。 基本上在我的MVC 3应用程序中,我有一个以表格格式显示的列表。 该表包含每行的复选框,以指示用户选择的行。 我正在尝试在此表的每一行上实现文件上传功能。 只有选中该复选框,此功能才可用。

上传功能使用valums Ajax uploader http://valums.com/ajax-upload/ 这是使用的javascript函数,我现在在视图中有它...

  <script type="text/javascript">
$(document).ready(function () {

    function handleCheckbox() {
        if ($(this).find(':checkbox').is(':checked')) {
            //$(this).find('#file-uploader-attachment').html($('#myHTML').html());
            createUploader();
            $(this).find('#file-uploader-attachment').removeClass("upload-placeholder-unchecked");
            $(".qq-upload-button").css("margin-top", "-6px");
            $(".qq-upload-button").css("margin-bottom", "-20px");
        }
        else {
            $(this).find('#file-uploader-attachment').addClass("upload-placeholder-unchecked");
            $(this).find('#file-uploader-attachment').html($('#myHTML2').html());
        }
    }

    $('tr').each(function () {
        handleCheckbox.apply(this); // We need to call the function initially using 'label' for this.
    });
    $('tr').on('click', handleCheckbox);

    function createUploader() {
        var uploader = new qq.FileUploader({
            element: document.getElementById('file-uploader-attachment'),
            sizeLimit: 2147483647, // max size
            action: '/CalibrationViewer/AttachmentUpload',
            allowedExtensions: ['xls', 'xlsx', 'pdf', 'doc', 'docx', 'csv', 'txt', 'rtf', 'zip', 'zipx', '7z'],
            params: {
                customer: CUST_NAME,
                calibrationId: CAL_ID
            },
            multiple: false,
            debug: false,
            onComplete: function (id, fileName, responseJson) {
                var resultMessage = document.getElementById('resultMessage');
                alert(responseJson.msg);
                $('#resultMessage').addClass('greenText');
                resultMessage.innerHTML = responseJson.msg;

                $('#attachment').prepend('<hr/><p><a class="attachment-file" href="' + responseJson.fileId + '">' + responseJson.fileName + '</a>' +
                    '<a class="attachment-delete" href="' + responseJson.fileId + '">X</a></p>');

                $('#no-attachments').remove();
            }
        });
    }
});

上传功能实际上有效....如果只有一行,如果有多行,则选择最后一行的ID并在JsonResult中使用。

我在视图中使用的foreach循环中有以下脚本来填充表,但是我猜测脚本标记不能以这种方式使用。

     <script type="text/javascript">
                 var CAL_ID = '@Model.ElementAt(index).Id';
                 var CUST_NAME = '@Model.ElementAt(index).CustomerName'; 
            </script>

我只关心Cal_ID参数,因为CUST_NAME将完全相同。 这是控制器中的JsonResult。

  public JsonResult AttachmentUpload(string qqfile, string customer, int calibrationId, IPrincipal user)

json结果中的int calibrationId参数始终是表中的最后一行id,无论是否已选中。

所以我真的有一些问题。 如果表中有多行,则不会选择正确的行ID。 上传btn仅出现在第一行,无论选中哪个行复选框。 并且不确定如何允许循环以确保每行都有上传btn并且在上传时使用行ID。

如果这个问题过于宽泛,我会道歉,如果需要,我会添加更多代码。

0 个答案:

没有答案