添加图像后,模态形式消失

时间:2019-04-30 19:21:05

标签: modal-dialog

我有一个模态表格,可以很好地加载并能够填写表格。添加图像后,该表单关闭。

<button id="createButton" class="btn btn-success show-modal" type="button" data-toggle="modal" data-target="#formModal">
                    Create New Auction
</button>

和脚本

<script>
  $('#formModal').modal({
     backdrop: 'static',
     keyboard: false
  });

    $(document).ready(function () {
        $(".show-modal").click(function () {
            $("#formModal").modal({
                backdrop: 'static',
                keyboard: false
            });
        });
    });

    $("#saveButton").click(function () {

        var imageIDs = [];
        $("#pictureArea .image").each(function () {
            var imageID = $(this).attr("data-id");
            imageIDs.push(imageID);
        });
        $("#pictureIDs").val(imageIDs.join());

        $.ajax({
            url: "@Url.Action("Create","Auctions")",
            type: "post",
            data: $("#createForm").serialize()
        }).done(function (response) {
            $('#formModal').modal('toggle');
            $("#listingArea").html(response);
        });
    });

    $("#auctionPictures").change(function () {
        var pictures = this.files;
        var picsData = new FormData();
        for (var i = 0; i < pictures.length; i++) {
            picsData.append("Pictures", pictures[i]);
        }

        $.ajax({
            url: "@Url.Action("UploadPictures", "Shared")",
            type: "post",
            data: picsData,
            dataType: "json",
            processData: false,

            contentType:false
        }).done(function (responses) {
            for (var i = 0; i < responses.length; i++) {
                var picResponse = responses[i];

                AttachNewImage(picResponse.pictureUrl, picResponse.Id);
            }

        });
    });

    function AttachNewImage(imageURL, imageID) {

        var $newimgHTML = $("#imageTemplate").clone();

        $newimgHTML.find(".image").attr("src", "/uploads/images/" + imageURL);
        $newimgHTML.find(".image").attr("data-id", imageID);

        $("#picturesArea").append($newimgHTML.html());

        RemoveImagesOnClick();
    }

</script>

0 个答案:

没有答案