How to upload a text content as a file in $.Ajax()?

FormData class is used to create a multipart/form-data inside of JS code. A sample code speaks thousand words:

var formData = new FormData();
 var blob = new Blob([YOUR_CONTENT_HERE], { type: "text/html"});
 formData.append("file", blob);

We have created a binary data from the text which is in the format of text/html, then I have appended the data as an input file with the name of file (which will be captured on server-side).

The Ajax part is utterly simple:

$.ajax({
     type: 'POST',
     url: 'https://www.example.com/storage',
     data: formData,
     processData: false,
     contentType: false
 }).done(function(data) {});

NOTE: DO NOT OMIT processData, contentType parameters.

#javascript #jQuery #ajax #FormData #Blob #upload

https://stackoverflow.com/questions/1964839/how-can-i-create-a-please-wait-loading-animation-using-jquery

#jquery #ajax #loading

How to get only numbers in textbox using jQuery?

// Restricts input for each element in the set of matched elements to the given inputFilter.
 (function($) {
     $.fn.inputFilter = function(inputFilter) {
     return this.on("input keydown keyup mousedown mouseup select contextmenu drop", function() {
         if (inputFilter(this.value)) {
         this.oldValue = this.value;
         this.oldSelectionStart = this.selectionStart;
         this.oldSelectionEnd = this.selectionEnd;
         } else if (this.hasOwnProperty("oldValue")) {
         this.value = this.oldValue;
         this.setSelectionRange(this.oldSelectionStart, this.oldSelectionEnd);
         }
     });
     };
 }(jQuery));

 // restrict input to receive just numbers
 $("#my_input_num").inputFilter(function(value) {
     return /^\d*$/.test(value);
 });

#javascript #jquery #input #number

How to convert ByteArray to PDF and then upload it via jQuery?

var docData = [ yourByteArray ];
 var blob = new Blob([new Uint8Array(docData)], { type: 'application/pdf' });

 // Now create form to upload the file
 var formData = new FormData();
 formData.append("file", blob);

 // Let's now upload the file
 $.ajax({
         type: 'POST',
         url: 'https://www.YOUR-UPLOAD-FILE-ENDPOINT.com/storage',
         beforeSend: request => set_ajax_headers(request),
         data: formData,
         processData: false,
         contentType: false
     }).done(function(data) {
         console.log('File is uploaded!');
     });

NOTE: function set_ajax_headers is a function that sets headers on the given request.

#javascript #ByteArray #PDF #Uint8Array #Blob #jQuery