Question

我需要用户能够上传文件，一旦文件上传，我需要提交按钮才能启用。我有这个代码，但由于某种原因它不起作用。

                @using (Html.BeginForm("UploadChangedDocument", "Admin", FormMethod.Post, new { enctype = "multipart/form-data" }))
                {
                    @Html.Hidden("documentId", item.DocumentId)
                    <div class="form-group">
                        <label for="file" class="control-label col-md-4">Upload Edited Document:</label>
                        <div class="col-md-8 upload-block">
                            <input type="file" name="file" id="InputFile" />
                        </div>
                        <br />
                    </div>

                    <div class="form-group">
                        <label for="file" class="control-label col-md-4">Submit Edited Document:</label>
                        <div class="col-md-8 upload-block">
                            <button id="upload-btn" type="button blue-button" class="btn blue-button" disabled="">Submit</button>
                        </div>
                    </div>

                }

这是我的Jquery代码

<script>
    $('.upload-block input').change(function () {
        $('#upload-btn').prop('disabled', !($('#InputFile').val()));
    });
</script>

这段代码有问题吗？有一个更好的方法吗？通过上传文档，＃InputFile将获得一个启用“提交”按钮的值，对吗？

我还应该补充说，这是为许多文档生成的，因此每个文档都应该能够被下载编辑和提交。

Answer 1

对于任何想要通过文档编辑方式进行编辑并在此处上传的人来说，这是一个可以使用的公式

@using (Html.BeginForm("UploadChangedDocument", "Admin", FormMethod.Post, new { enctype = "multipart/form-data" }))
                {
                    @Html.Hidden("documentId", item.DocumentId)
                    <div class="form-group">
                        <label for="file" class="control-label col-md-4">Upload Edited Document:</label>
                        <div class="col-md-8">
                            <input type="file" name="file" id="InputFile-@count.ToString()" />

                        </div>
                        <br />
                    </div>

                    <div class="form-group">
                        <label for="file" class="control-label col-md-4">Submit Edited Document:</label>
                        <div class="col-md-8">
                            <input id="upload-btn-@count.ToString()" type="submit" class="btn blue-button" disabled="" />
                        </div>
                    </div>

                    <script>
                        $(document).ready(
                            function () {
                                $('#InputFile-@count.ToString()').change(
                                    function () {
                                        if ($(this).val()) {
                                            $('#upload-btn-@count.ToString()').attr('disabled', false);
                                            // or, as has been pointed out elsewhere:
                                            // $('input:submit').removeAttr('disabled'); 
                                        }
                                    }
                                );
                            });
                    </script>
                }

输入文件.NET Razor的禁用按钮

1 个答案: