JQuery Ajax Plugin File Upload simplify code

Question

Hi

I am currently using Valums JQuery File Upload plugin. The plugin is very convenient to use, but I do not like how the code looks. Because it occupied inside document.ready such as:

$(document).ready(function() { var button = $('#button1'), interval;

new AjaxUpload(button, {
    action: 'http://test.com/user/uploadfile', 
    name: 'myfile',
    onSubmit : function(file, ext){
        // change button text, when user selects file           
        button.text('Uploading');

        // If you want to allow uploading only 1 file at time,
        // you can disable upload button
        this.disable();

        // Uploding -> Uploading. -> Uploading...
        interval = window.setInterval(function(){
            var text = button.text();
            if (text.length < 13){
                button.text(text + '.');                    
            } else {
                button.text('Uploading');               
            }
        }, 200);
    },
    onComplete: function(file, response){
        button.text('Upload Finished');

        window.clearInterval(interval);

        // enable upload button
        //this.enable();

        alert(response);            
    }
});

});

My question is can the code be more simplified? So that I can have the code more or less look like :

$(document).ready(function() { var button = $('#button1'), interval;

new AjaxUpload(button, {#leads to another function}#);

});

Thanks in advance

Answer 1

Are you new to Javascript? I remember my first experiences with Javascript & jQuery were interesting because I didn't like the way my code looked at first. The thing is that you really have to get used to it and understand that it is all there for a reason. Writing a custom plugin to do things like this would work, but in the end, you'll still have that code stashed away somewhere. Just pick a code nesting scheme you like and be proud of what you have working because 99% of your guests prolly won't really care =)