SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    Patience... bronze trophy solidcodes's Avatar
    Join Date
    Jul 2006
    Location
    Philippines
    Posts
    933
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)

    Basic AJAX question?

    Hi guys,

    I have these codes below,
    Code:
    	<script> 
            $(document).ready(function() { 
    		//elements
    		var progressbox 	= $('#progressbox');
    		var progressbar 	= $('#progressbar');
    		var statustxt 		= $('#statustxt');
    		var submitbutton 	= $("#SubmitButton");
    		var myform 			= $("#UploadForm");
    		var output 			= $("#output");
    		var completed 		= '0%';
    
    			$(myform).ajaxForm({
    				beforeSend: function() { //brfore sending form
    					submitbutton.attr('disabled', ''); // disable upload button
    					statustxt.empty();
    					progressbox.show(); //show progressbar
    					progressbar.width(completed); //initial value 0% of progressbar
    					statustxt.html(completed); //set status text
    					statustxt.css('color','#000'); //initial color of status text
    				},
    				uploadProgress: function(event, position, total, percentComplete) { //on progress
    					progressbar.width(percentComplete + '%') //update progressbar percent complete
    					statustxt.html(percentComplete + '%'); //update status text
    					if(percentComplete>50)
    						{
    							statustxt.css('color','#fff'); //change status text to white after 50%
    						}
    					},
    				complete: function(response) { // on complete
    					output.html(response.responseText); //update element with received data
    					myform.resetForm();  // reset form
    					submitbutton.removeAttr('disabled'); //enable submit button
    					progressbox.hide(); // hide progressbar
    					alert("Data successfully saved!");
    				}
    			});
            }); 
        </script> 
    </head>

    What is this codes below do?
    Is this codes below necessary?
    Code:
    output.html(response.responseText);
    Can someone explain to me in detail please.

    Thank you very much in advanced.
    Quality codes are optimized and tested...
    Click here for inspiration..

  2. #2
    Patience... bronze trophy solidcodes's Avatar
    Join Date
    Jul 2006
    Location
    Philippines
    Posts
    933
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    I use the AJAX codes above for file upload with progress bar.
    The file is successfully uploaded but since the form has data fields like 'Title', 'Description' etc...
    The data is not saved only the uploaded file is saved.

    If hope someone can give shed to this.
    Because AJAX is one of my weakness.

    Thanks in advanced.
    Quality codes are optimized and tested...
    Click here for inspiration..

  3. #3
    Community Advisor bronze trophy
    fretburner's Avatar
    Join Date
    Apr 2013
    Location
    Brazil
    Posts
    1,389
    Mentioned
    45 Post(s)
    Tagged
    12 Thread(s)
    Hi solidcodes,

    That line takes the response from the server (the result of the form being submitted) and outputs it to the page, inside an element with the ID output. Whether you need that line or not really depends on if you want to display the output to the user.

  4. #4
    Patience... bronze trophy solidcodes's Avatar
    Join Date
    Jul 2006
    Location
    Philippines
    Posts
    933
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    @fretburner

    So it's fine if I don't include it right?
    Quality codes are optimized and tested...
    Click here for inspiration..

  5. #5
    Gre aus'm Pott gold trophysilver trophybronze trophy
    Pullo's Avatar
    Join Date
    Jun 2007
    Location
    Germany
    Posts
    5,892
    Mentioned
    211 Post(s)
    Tagged
    12 Thread(s)
    Quote Originally Posted by solidcodes View Post
    So it's fine if I don't include it right?
    It won't break your script, if that's what you mean.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •