Related questions

FormData only run once when using ajax

2018-07-11 03:01 Huang Lee imported from Stackoverflow

i have a code like this

function SaveFolderThumbnail(folderInfo) {
var formData = new FormData();
if (uploadFile != null || uploadFile != undefined) {
    formData.append(uploadFile.name, uploadFile.rawFile);

    //check exist thumbnail
    if (folderInfo == undefined) {
        if (folderThumbnailSelected.ThumbnailUrl != null) {
            formData.append("ExistThumbnail", folderThumbnailSelected.ThumbnailUrl);
        }
    }
}


$.ajax({
    url: folderUploadFolderThumbnailUrl,
    type: 'POST',
    contentType: false,
    processData: false,

    cache: false,
    data: formData,
    success: function (e) {
        var thumbnailFileName = e;
        if (folderInfo != undefined) {
            SaveFolderInfo(folderInfo, thumbnailFileName);
        }
        else {
            InvokeSaveChanges(thumbnailFileName);
        }
    }
});

If this code run for the first time, it reach the ajax, pass to controller & return the filename to me, like this

        var thumbnailFileName = e; //e= "onepiece.jpg"

After that, i can save the file normally. But many time after this i select the element again, this problem show up, when i debug the code at this

var formData = new FormData();

I find out it jump straight right into ajax, but never reach the controller, which return null & the thumbnail was never been save

        var thumbnailFileName = e;// e=""

Can anybody know what cause this problem?

See also questions close to this topic

  • Why touchmove event is blocked inside modal when listening body element and using bubbling

    In generally, when we implement modal, we should block touchmove (or scroll) on body to prevent scrolling outside modal.

    // <body><div id="modal"></div></body>
const bodyElement = document.querySelector("body");
bodyElement.addEventListener("touchmove", (e) => {
  e.preventDefault();
}, { passive: false, capture: false });

    At first, I wrote the above code, but could not scroll on scrollable element inside modal. I can't understand why this is happened.

    You know, there are two event flow on JavaScript and the above code is using bubbling. Of course, the modal element is on body element, but it appeared to be event capturing...

    I want to know why this is happened to get more understanding of event in JS.

  • Popping up a table with data from a database when button is clicked

    Hi guys I'm trying to create a system in which requires to click a button and pop-up table with data from a database. please refer to the photo.

    here's the photo

    I search from the internet but all suggest to use jquery and ajax...I just have basic understanding in javascript, php, html and css. My question is can I implement this without using ajax and jquery?

  • What is the description of how to define variables character (questions)?

    Javascript description of how to define variables character question(?)

    pure?: ?boolean

  • Puppeteer: How to get Data from Chrome Extension

    I have added extension in puppeteer. Is there any way to get data which is captured by extension.

  • How can I show similarity between two text chunks in a visual form?

    Any ideas on which diagrams to use, what information can be displayed on diagrams etc.?

    The similarity is just text similarity (not conceptual).

  • bootstrap 4 show error in delete confirm box

    I have this code for show bootstrap 4 modal confirm before send delete using json:

    $(document).ready(function() {
    $('.launchConfirm').on('click', function (e) {
        $('#confirmDelete')
            .modal({ backdrop: 'static', keyboard: false })
            .one('click', '#delete', function (e) {
                $.ajax({
                    url:"../account/edit/profileimage",
                    type: "POST",
                    dataType:"json",
                    data:{"action": 'delete',"csrf_token": '<?= $this->e($Csrf_Token); ?>'},
                    success: function(data) {
                        if(data.status === 'error') {
                            $('#confirmDelete').animate({ scrollTop: $('#deleteError').offset().top }, 500);                             
                        } else {
                            alert('error found');
                        }
                    }
                });
        });
    });
});

    html:

    <div id="confirmDelete" class="modal" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Delete Image</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12" style="">
                        <div id="deleteError" class="alert alert-danger"></div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" data-dismiss="modal" class="btn btn-primary" id="delete">Delete</button>
                <button type="button" data-dismiss="modal" class="btn">Cancel</button>
            </div>
        </div>
    </div>
</div>

    Now in action, I need to show error if response error status from php file in the modal box But after click delete button and response error, modal box close and not show error in div with id deleteError. how do fix this problem?

  • jQuery: How to refresh data being read from a cookie after the cookie is updated in an Ajax call

    I have a billing form that reads data from a cookie and prefills the fields based on the cookie value. If a user changes the field, they can click 'save' which triggers an AJAX call and upon that success, I update the cookie with the new field values. How can I have the page refresh without actually reloading it. 

    let address = `<input class="street-address inner-inputs" value='${Cookies.getJSON('braintreeData') && Cookies.getJSON('braintreeData').streetAddress || ""}'></input>
  • ASP.NET MVC err_connection_reset no response from server no error message

    I have hosted an ASP.NET MVC 5 application on Windows Server (plesk)

    It was working well, but yesterday I have uploaded some changes, after that I got into this issue.

    After that I reverted back the changes and re-uploaded, but still same issue. tried many things but no luck, actually I am not able to get the actual error.

    I also created fresh ASP.NET MVC application, upload that to same location that fresh app is working. But the real website is not working.

    This makes sure there is something wrong with code.

    I added snap of chrome network tab, there are few chrome dinasore images in base64, while my web request headers are not completed, and there is no response headers, I also exceeded executiontimeout=36000 but no luck

    please help how can I trace the issue.

    enter image description here

  • SaveFileDialog in C# MVC

    I'm developing a website in C# MVC and I need to create and download a pdf file dynamically. I'm using ClosedXML for creating pdf.To download the file , I need to choose a folder in my computer like SaveFileDialog in ASP NET. Anybody know how to show a SaveFileDialog in C# MVC?

  • I'm having problem getting data from ckeditor textarea

    I'm having problem getting the textarea(ckeditor) value. This is the script line : 

    <script src="https://cdn.ckeditor.com/ckeditor5/11.1.1/classic/ckeditor.js"></script>

    This is my textarea code :

     @Html.TextAreaFor(model => model.FullNews, new { @class = "form-control", @id = "Parag" })

    This is my scripts section code :

     ClassicEditor
        .create(document.querySelector('#Parag'))
        .catch(error => {
            console.error(error);
        });



    function loadData() {
        debugger;
        var head = $("#Header").val();
        var para = CKEDITOR.instances.Parag.getData();
        document.getElementById("Para").innerHTML = para;
        document.getElementById("Head").innerHTML = head;
        readURL(document.getElementById("newsImage"));
        $("#previwe_before_publish").modal("show");
    }

    When i debug it in browser, i get the error "Uncaught ReferenceError: CKEDITOR is not defined" in the line : 

    var para = CKEDITOR.instances.Parag.getData();

    I searched over the internet but couldn't find the solution for it. Can anybody help me ?