Convert iframe target to Javascript / ajax div?

[tydende1]

This seems like a great thing to learn but I can't find a good tutorial or resource to accomplish what I'm trying to do.

I have this site that I'm working on
http://lucalune.com/wordpress/

If you click on Search Projects, it will bring up a drodown. If you select an option or two you can filter the projects (click Search). It is basically a search form and the form is targeting the iframe "results"
<form action="<?php bloginfo('template_url') ?>/build_search.php" method="post" target="results" accept-charset="utf-8">

It works great in firefox, but in ie you have to click the iframe for the results to show up. Why? I have no idea. But..... That made me think that having an ajax or jquery driven div display the results would be a better solution an something I want to learn.

If I were just directing a link to show content in the div, I could do it. But since I'm using the target="" code in a form, I can't figure out how to do it. Aaaarggghhh.
This must be common thing to do, right?

Does anyone know how to target a div using an html form?

Thanks!

[jscheuer1]

As regards the use of ddaccordion.js -

Your page is in violation of Dynamic Drive's usage terms (http://www.dynamicdrive.com/notice.htm), which, among other things, state that the script credit must appear in the source code of the page(s) using the script. Please reinstate the notice first.


As regards your question - Put this script in the head of the page:


<script type="text/javascript">
jQuery(function($){
$('form').submit(function(e){
e.preventDefault();
var $f = $(this);
$.ajax({
url: $f.attr('action'),
type: 'post',
data: $f.serialize(),
success: function(data){
$('#results').replaceWith('<div id="results">' + data + '<\/div>');
}
});
});
});
</script>

[tydende1]

Hey John,

Thanks for the head's up on that, regarding ddaccordian.js
I have added that into the header.

And thanks for that code! Works perfect. Now I can dissect and learn.

Much, much appreciated!

[tydende1]

Hey John,

I have that working great. Thanks again!
http://lucalune.com/wordpress

and i'm trying to find an answer to one last piece. After some searching I thought I'd see if you might have an answer.....

When you click Search Project and sort by something, say just the first option, Available by Exhibit, it produces a list of page results. If you click one of those links, you will go to that page and I'm able to keep the menu dropdown open (this is all perfect), BUT.... the results are cleared on page refresh.

What I would love to figure out, is how to keep those results shown when the page is refreshed. It would essentially be keeping the results shown at all times until a new search overrides the previous one.

Do you know of any way to achieve this?

Thanks again for your help,
Ty