var pg = 1;
var search_ctrl = ' <p style="text-align: justify;">Use our LIVE search page to find the villa or condo of your dreams! Choose the location, price range, bedrooms and bathrooms, or even do a full text search, to get a instant live update of our current listings. If there are more than 10 results, simple click on the [NEXT] button to move to the next ten listings. Enjoy!</p> <br />Text Search: <input type="text" value="" id="criteria" class="searchBox" style="width: 225px; height: 15px;"/> &nbsp;&nbsp;&nbsp;Price Range: <select id="price" class="searchBox" style="width: 100px;"> <option value="0">Any</option> <option value="1">up to $150</option> <option value="2">$150 to $300</option> <option value="3">$300 to $600</option> <option value="4">$600 to $800</option> <option value="5">$800 to $1000</option> <option value="6">$1000 to $2500</option> <option value="7">$2500 to $5000</option> </select> <br /><br />Location: <select id="location" class="searchBox" style="width: 100px;"> <option value="0">Puerto Vallarta</option> </select> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;# of Bedrooms: <select id="bedroom" class="searchBox" style="width: 50px;"> <option value="0">Any</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7+</option> </select> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;# of Bathrooms: <select id="bath" class="searchBox" style="width: 50px;"> <option value="0">Any</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4+</option> </select> <br /><br /> ';
var search_ctrl2 = ' <img src="images/1page_title1.gif" class="title" alt="Puerto Vallarta Villa Rental, Mexico Golf Vacation, Mexico Vacation Villa, Vacacion en Puerto Vallarta, Visit Puerto Vallarta, beach condo for rent by owner" /> <form id="search-form" action="http://www.villasofvallarta.com/search.php" method="get" enctype="multipart/form-data"> <div class="indent"> <div class="container"> <div class="box-1">Location:<br /> <select name="location" class="searchBox" style="width: 100px;"> <option value="0">Puerto Vallarta</option> </select></div> <div class="box-2">&nbsp; Price Range:<br /> &nbsp; <select name="range" class="searchBox" style="width: 100px;"> <option value="0">Any</option> <option value="1">up to $150</option> <option value="2">$150 to $300</option> <option value="3">$300 to $600</option> <option value="4">$600 to $800</option> <option value="5">$800 to $1000</option> <option value="6">$1000 to $2500</option> <option value="7">$2500 to $5000</option> </select></div> </div> <div class="container"> <div class="box-1"># of Bedrooms:<br /> <select name="bedrooms" class="searchBox" style="width: 50px;"> <option value="0">Any</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7+</option> </select></div> <div class="box-2">&nbsp; # of Bathrooms:<br /> &nbsp; <select name="bathrooms" class="searchBox" style="width: 50px;"> <option value="0">Any</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4+</option> </select></div> </div> <div class="container"> <div class="textbox">Text Search:<br /> <input type="text" value="" name="criteria"/></div> </div> <div class="line-x"></div> <div class="container"><a href="#" onclick="getElementById(\'search-form\').submit()"><img src="images/search_form_button.jpg" alt="" /></a><span>Questions?<br /> <a href="contact_us.php">Email Us Today!</a></span></div> <div class="line-x"></div> </div> </form> ';

function search_init(){
  if ($('#search_ctrls').length != 0)
    $('#search_ctrls').html(search_ctrl);
  $('#criteria').keyup(function (){
    search_site(pg);
  });
  $('#location').change(function (){
    search_site(pg);
  });
  $('#bedroom').change(function (){
    search_site(pg);
  });
  $('#bath').change(function (){
    search_site(pg);
  });
  $('#price').change(function (){
    search_site(pg);
  });
  
  if ($('#search_ctrls2').length != 0)
    $('#search_ctrls2').html(search_ctrl2);
  else search_site(pg);
}

function search_site(pg_select){


  var criteria = document.getElementById('criteria').value;
  var location = document.getElementById('location').value;
  var bedroom = document.getElementById('bedroom').value;
  var bath = document.getElementById('bath').value;
  var price = document.getElementById('price').value;
  var data = 'pg=' + pg_select + '&location=' + location + '&bedroom=' + bedroom + '&bath=' + bath + '&price=' + price + '&criteria=' + criteria;
  $.ajax({
    dataType: 'jsonp',
    data: data,
    jsonp: 'retriever',
    url: 'http://www.villasofvallarta.com/Scripts/search/',
    success: function (results) {
      $('#search_result').html(results);
    }
  });
}
 
$(document).ready(function(){
  search_init();
});