Basic AJAX question?

JavaScript
1

Hi guys,

I have these codes below,


	<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?


output.html(response.responseText);

Can someone explain to me in detail please.

Thank you very much in advanced.

2

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.

3

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

@fretburner

So it’s fine if I don’t include it right?

5

It won’t break your script, if that’s what you mean.