Heather Ritchey
asked on
Loading graphic while getting form results
What would be the simplest/easiest way to show a loading graphic after hitting submit and waiting for the form results to be gathered? The results show on the same page after getting them. The amount of time to get the results varies greatly so I don't want to have to use a timer.
Currently we're using a jquery call to do this, but mostly since it's not my strong point of a programming language - with the latest wordpress 3.0.1 and so many different plugins being required on some one site, there's apparently conflict somewhere.
Showing a loading graphic is important for this because of the lengthy wait at times. We want the viewer to know that the results are still being gathered.
I've showed the jquery code here at EE before asking for advice, but it does seem that the code is correct. So I'm looking for an alternative to jquery so we aren't constantly running into conflicts.
Thanks for any additional options.
Currently we're using a jquery call to do this, but mostly since it's not my strong point of a programming language - with the latest wordpress 3.0.1 and so many different plugins being required on some one site, there's apparently conflict somewhere.
Showing a loading graphic is important for this because of the lengthy wait at times. We want the viewer to know that the results are still being gathered.
I've showed the jquery code here at EE before asking for advice, but it does seem that the code is correct. So I'm looking for an alternative to jquery so we aren't constantly running into conflicts.
Thanks for any additional options.
ASKER
Hopefully this doesn't make me sound really dumb, but to call your function would you use an onclick in the button? I see the word ajax, so I want to be sure I'm not confusing the languages.
Also another question - the data line:
Will that accept php and/or smarty terms ok?
Also another question - the data line:
Will that accept php and/or smarty terms ok?
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
I'm still unable to get your example working for me. The attached code shows the loading graphic correctly, but the results being returned when using an alert to view just say [object Object].
I've already confirmed that all variables are set correctly that you see in that code. Is there something different that needs to be done to display the real results? If it's seeing it as an object instead of html, is there an additional call that needs added to tell the jquery what is in the results?
I've already confirmed that all variables are set correctly that you see in that code. Is there something different that needs to be done to display the real results? If it's seeing it as an object instead of html, is there an additional call that needs added to tell the jquery what is in the results?
url_form.submit(function(){
results.hide();
throbber.fadeIn("slow");
results.load(seourl, {"url": url.val(), "output": "html", "ref": ref.val() }, function(){
throbber.hide();
results.show();
htmltooltip.render();
For the loading graphic, simply replace the container (<div>) of the search results with the graphic before the results are returned, then when the results are loaded, have them replace the graphic.
function search(){
$('#SearchResults').html('
$.ajax({
type: "POST",
url: "search.php",
data: "keyword=searchterm",
success: function(data){
$('#SearchResults').html(d
}
});
}