• 0

[JQuery] Need help fixing this piece of code


Question

Hello,

I have been trying to update my database by passing data from a form submit via the jquery ajax features, more so using a form plug-in.

I am able to grab my data, and send it to my process.php to do a sql update query.

from there i'm trying to figure out how to refresh the content of my div dynamically once the form is submitted.

here is my jquery code:

// AJAX response for FORM submission //
			// prepare the form when the DOM is ready 
			$(document).ready(function() { 
				var options = {
					url: 'process.php',
					type: 'post',
					//dataType: 'json',
					target: '#last_five_sellers',
					//beforeSubmit: showRequest,
					success: success
				};

				// bind to the form's submit event
				$('#form').submit(function() { 
					// inleft event callbacks 'this' is the DOM element so we first 
					// wrap it in a jQuery object and then invoke ajaxSubmit 
					$(this).ajaxSubmit(options); 

					// !!! Important !!! 
					// always return false to prevent standard browser submit and page navigation 
					return false; 
				});

				function success(data) {
					$("form#form").hide();
					$(".success").fadeIn();
					//$("#last_five_sellers").empty();
					//$("#last_five_sellers").fadeOut();
					//$("#last_five_sellers").replaceWith(data);
				}
			});

the fadeIn works, but the empty(), fadeOut(), and replaceWith() doesn't

if you notice atop the script there is a target parameter, where the plug-in loads the new form data into

Link to comment
Share on other sites

4 answers to this question

Recommended Posts

  • 0

.fadeOut() and .empty() would only hide/empty the #last_five_sellers

.replaceWith(data) should in theory work, if data contains HTML, DOM element(which yours doesn't or jQuery object(which yours doesn't)

does data contain HTML when you come back from you AJAX call?

Link to comment
Share on other sites

  • 0

.fadeOut() and .empty() would only hide/empty the #last_five_sellers

.replaceWith(data) should in theory work, if data contains HTML, DOM element(which yours doesn't or jQuery object(which yours doesn't)

does data contain HTML when you come back from you AJAX call?

hmmm not sure how to check if the AJAX call has HTML content....

but in firebug the response shows the htmk value of my input form that was sent over to be processed, which does in need get processed.

I tried to encode my data in json but i just getting back an array of my data as an output, so then i just echoed out a table with the processed data so not sure i can bring over the new content from .php page via ajax...

Link to comment
Share on other sites

  • 0

hmmm not sure how to check if the AJAX call has HTML content....

but in firebug the response shows the htmk value of my input form that was sent over to be processed, which does in need get processed.

I tried to encode my data in json but i just getting back an array of my data as an output, so then i just echoed out a table with the processed data so not sure i can bring over the new content from .php page via ajax...

HTML = simply text

should be able to alert(data); and get a massive(or not) alert box

If you get an alert box, but all it says is Object, bla bla, then what your form plugin is passing as data to the callback function is an object

I'd read a bit on the particular way the plugin works, namely the object structure that gets passed to the callback

Again, this is only if the alert(data); does NOT have any HTML in the alert box, i.e. data is some bespoke object or an array, etc..

Then you need to adjust to the specifics of the plugin..

I hope this helps

Edit: Looking at your code, you should indeed be receiving responseText in data, as you're not specifying any specific dataType for the response when requesting

So.. in theory this all should work, with the catch that specifying the target makes the plugin inject the HTML in the target element, at a point. Now, the point may be AFTER the success callback.

I'd remove the target parameter in options, and handle it all manually in the success callback, so you can time things.

Cheers

Link to comment
Share on other sites

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.