File upload and display in jquery

Posted By : Surbhi Gupta | 29-Nov-2017

How to use the basic plugin to upload file

1. The plugin download bundle accompanies an entire UI in view of Bootstrap. 

2. Be that as it may, on the off chance that you need to assemble your own UI, it is conceivable to utilize just the fundamental plugin adaptation and an insignificant setup. 

3. The accompanying is a contrasting option to index.html with just the insignificant necessities and a straightforward done callback handler (see API and Options on the best way to utilize the diverse alternatives and callbacks).

 


Response and data type
The case above sets the dataType alternative to JSON, anticipating that the server should restore a JSON reaction for each transferred document. However, it's in like manner possible to manage HTML content sorts as the response or whatever another dataType that you can manage in your done handler.
 
How to display upload progress with the basic plugin
The file upload module triggers advance occasions for both individual transfers (advance) and all running transfers joined (progress).Event handlers can be set with the occasion restricting component or as contraption choices (see API and Options documentation
$('#fileupld').fileupld({
    /* ... */
    progressall: function (e, res) {
        var progress = parseInt(res.loaded / data.total * 100, 10);
        $('#prgrss .bar').css(
            'width',
            progress + '%'
        );
    }
});

The past code accepts an advance hub with an internal component that shows the advance status by means of its width rate:


 
 

The inner element  ought to have numerous distinction contrast foundation shading than the compartment hub, set through CSS and requirements a stature connected

.progressbar {
    height: 17px;
    background: red;
}

About Author

Author Image
Surbhi Gupta

Surbhi is a Java Developer and a simple ,straightforward, friendly person. She loves to work in a challenging job.

Request for Proposal

Name is required

Comment is required

Sending message..