Need urgent Javascript help

[EggDesign]

Hi lads

Im doing some work on a site which involves some javascript. Ive got the job half done already. Need help with the second half!

Basically the site has a search by area function here http://www.discoveringcork.ie/places-to-stay/bed-breakfasts/

So when you select an area the results show underneath.

The client wanted me to make it so when you select an area it opens a new page, specific to that area with the results showing (for seo purposes) which i have done on this test page (select bantry)
http://www.discoveringcork.ie/places-to-stay/bed-breakfasts/bandon/

Thats all fine but the results are not showing on the new page.

Here is the form code:

<form name='restaurant_search'>
    <select id="location_dropdown" onchange="update_guesthouse_types_new(this.value)">

<?
$myrows = mysql_query( "Select distinct meta_value from wp_postmeta where meta_key='rblocation' order by meta_value asc" );
echo mysql_numrows($myrows);
while ($row = mysql_fetch_array($myrows) ) {
   	$option_value = strtolower(current(explode(" ", $row[meta_value])));
	echo "<option value=\"$option_value\">".$row[meta_value]."</option>";
}

?>
</select>
<input type='button' value='Search &raquo;' id='restaurant_search_btn' onclick="update_guesthouse_types();">


</td>


<tr>

</form>

and javascript:

<script type="text/javascript">
function update_guesthouse_types_new(option){
	var base_url = "http://www.discoveringcork.ie/places-to-stay/bed-breakfasts/";
	location.href = base_url + option;
}
</script>

Any help at all with this would be very much appreciated.

cheers
john

 

[DecKen]

Hi John,

The code all looks good from what I can see - even tested it here. Are you sure you uploaded you new code to the server, when I checked the page source the onchange in the resturant_search form is still set to
update_guesthouse_types() and not
onchange="update_guesthouse_types_new(this.value)"

 

[EggDesign]

Hi Dec

The first link I posted is the current page. That will have the old code (update_guesthouse_types())
Is that the source you are checking? If you source the second link (my hidden test page) you will see the other new code.

Hope I got that right!

Cheers
john

 

[DecKen]

Are you trying to get the results to open in a new window? The pages seem to change fine when I select a different region...

 

[EggDesign]

Yep I got that far myself, working fine. Thing is its not displaying the search results underneath, like the first link I posted above (the current setup).

cheers

 

[louie]

If you want to open a new page onchange, then you could try setting the target='_blank' to the form and use POST instead of GET and use onchange='this.form.submit();'

That's an option. The second option is using AJAX to load result below the select menu. onchange='loadresults(this.value);'

 

[EggDesign]

I think your first option sounds good Louie. I dont want to open a new browser window though, just a new page I created. Is that how it will function?

thanks

 

[louie]

From what I understood, you are trying to submit the form if the select menu has changed, so yes that's what the first option will do, but isn't what the current js function does?

 

[EggDesign]

It opens a new page, but not a separate browser window.

Will your fix solve the results showing problem though? Thanks again for the help.

 

[louie]

Ad target='_blank' to the form and try it out.

 

[EggDesign]

Where do I add 'POST' I dont see the 'GET' in that code? Also where will I put '_blank'.

Sorry Im not well up on javascript obviously.

 

[EggDesign]

Please guys, really need this sorted so any help would be great..

 

[louie]

<form action='' method='post' target='_blank'>

 

[EggDesign]

Thanks but the form is dynamically generated. Its a Wordpress plugin.

 

[EggDesign]

Tried inserting that in the form, didnt work im afraid.

I found the javascript for the current setup (first link I posted) Problem is the new javascript is overwriting this function so its not showing the results.

 function update_guesthouse_types(){
 selObj = document.getElementById('location_dropdown');
    event_location = "Everywhere";
        selIndex = selObj.selectedIndex;
    
    event_location = selObj.options[selIndex].text;

    
        
mydomain=window.location.hostname;
http.open("GET", 'http://'+mydomain+'/wp-content/themes/sandbox/ajax/guesthouse_types.php?l=' + escape(event_location), true); 

  http.onreadystatechange = handleHttpResponse_restaurant_types;

  http.send(null);
 
  return false;
 }

Any ideas how to make the new javascript show results also on the new page?

 

[louie]

Find the PHP function or HTML template that creates the form and manualy ad it.