.ui-accordion-content {height:260px;width: 100}
#accordion, #category-search {width: 100%;}
fieldset #glm-member-search label {width:25%;text-align: right;}
- .fieldcontain {display:block;width:100%;clear:right; margin: 10px 0;padding: 5px;}
+ .fieldcontain {display:block;width:100%;clear:right; margin:2px 0;padding: 0;}
.fieldcontain input[type=submit] {
float: right;
}
- .glm-chbx-label {width:280px;text-align: left;float:left;display:inline;}
- .glm-chbx {width:580px;text-align: left;display:block;clear:right;float:right;}
- .fieldHdr {width: 120px;float: left;display: block;text-align: right;margin:0 15px;font-weight: bold;}
- .fieldHdr2 {width: 100%;display: block;text-align: left;margin:0 15px;font-weight: bold;}
+ .glm-chbx-label {width:40%;text-align: left;display:block;float:left;text-wrap: none}
+ .glm-chbx {text-align: left;display:block;clear:right;}
+ .fieldHdr {display: block;text-align: left;margin:0 15px 0 0;font-weight: bold;}
+ .fieldHdr2 {width: 100%;display: block;text-align: center;margin:0 15px;font-weight: bold;}
+ #rightColSearch {
+ width: 70%;
+ float: right;
+ padding: 5px;
+ }
+ #leftColSearch {
+ width: 30%;
+ float: left;
+ padding: 5px;
+ }
+ #submitSearch {
+ width: 100%;
+ clear:both;
+ }
+ #trail-form select {
+ width: 100%;
+ height: 26px;
+ padding: 3px;
+ margin: 0;
+ }
+ #trail-form input[type="search"] {
+ width: 100%;
+ height: 26px;
+ padding: 3px;
+ }
</style>
<div
- id="category-search"
- class="category-search-accommodations">
+ id="category-search">
<form
flexy:ignore="yes"
action="{formURL:h}"
id="trail-form"
method="post">
<input type="hidden" name="search" value="1">
- <div class="fieldcontain">
- <label class="fieldHdr">Trail Name</label>
- <input
- type="search"
- name="member_name"
- placeholder="trail name"
- value="{_REQUEST[member_name]}">
- </div>
- <div flexy:if="regions" class="fieldcontain">
- <label class="fieldHdr">Regions</label>
- <select name="regionId">
- <option value="">-- Select --</option>
- {foreach:regions,id,name}
- <?php
- echo '<option value="'.$id.'"
- '.(($id == $_REQUEST['regionId'])?'selected':'')
- .'>'.$name.'</option>';
- ?>
- {end:}
- </select>
- </div>
- <div flexy:if="counties" class="fieldcontain">
- <label class="fieldHdr">Counties</label>
- <select name="countyId">
- <option value="">-- Select --</option>
- {foreach:counties,id,name}
- <?php
- echo '<option value="'.$id.'"
- '.(($id == $_REQUEST['countyId'])?'selected':'')
- .'>'.$name.'</option>';
- ?>
- {end:}
- </select>
- </div>
- <div id="accordion">
-
- <h3><a href="#">Activities</a></h3>
- <div>
- <div flexy:if="activities" class="fieldcontain">
- <div class="glm-chbx">
- {foreach:activities,id,name}
- <label for="chbx-{id:h}" class="glm-chbx-label">
- <?php
- echo '<input
- id="chbx-'.$id.'"
- type="checkbox"
- name="activity[]"
- value="'.$id.'"
- '.((isset($_REQUEST['activity'])
- && is_array($_REQUEST['activity'])
- && in_array($id, $_REQUEST['activity']))?'checked':'').'
- >';
- ?>
- {name}
- </label>
- {end:}
- </div>
- </div>
+ <div id="leftColSearch">
+ <div class="fieldcontain">
+ <label class="fieldHdr">Trail Name</label>
+ <input
+ type="search"
+ name="member_name"
+ value="{_REQUEST[member_name]}">
</div>
-
- <h3><a href="#">Parks</a></h3>
- <div>
- <div flexy:if="parks" class="fieldcontain">
- <div class="glm-chbx">
- {foreach:parks,id,name}
- <label for="chbx-{id:h}" class="glm-chbx-label">
- <?php
- echo '<input
- id="chbx-'.$id.'"
- type="checkbox"
- name="park[]"
- value="'.$id.'"
- '.((isset($_REQUEST['park'])
- && is_array($_REQUEST['park'])
- && in_array($id, $_REQUEST['park']))?'checked':'').'
- >';
- ?>
- {name}
- </label>
- {end:}
- </div>
- </div>
+ <div flexy:if="counties" class="fieldcontain">
+ <select name="activityId" id="advSearchActivities">
+ <option value="">Activities</option>
+ {foreach:activities,id,name}
+ <?php
+ echo '<option value="'.$id.'"
+ '.(($id == $_REQUEST['activityId'])?'selected':'')
+ .'>'.$name.'</option>';
+ ?>
+ {end:}
+ </select>
+ </div>
+ <div flexy:if="counties" class="fieldcontain">
+ <select name="parkId" id="advSearchParks">
+ <option value="">Parks</option>
+ {foreach:parks,id,name}
+ <?php
+ echo '<option value="'.$id.'"
+ '.(($id == $_REQUEST['parkId'])?'selected':'')
+ .'>'.$name.'</option>';
+ ?>
+ {end:}
+ </select>
+ </div>
+ <div flexy:if="regions" class="fieldcontain">
+ <select name="regionId" id="advSearchRegions">
+ <option value="">Regions</option>
+ {foreach:regions,id,name}
+ <?php
+ echo '<option value="'.$id.'"
+ '.(($id == $_REQUEST['regionId'])?'selected':'')
+ .'>'.$name.'</option>';
+ ?>
+ {end:}
+ </select>
+ </div>
+ <div flexy:if="counties" class="fieldcontain">
+ <select name="countyId" id="advSearchCounties">
+ <option value="">Counties</option>
+ {foreach:counties,id,name}
+ <?php
+ echo '<option value="'.$id.'"
+ '.(($id == $_REQUEST['countyId'])?'selected':'')
+ .'>'.$name.'</option>';
+ ?>
+ {end:}
+ </select>
</div>
- <h3><a href="#">Amenities</a></h3>
+ </div>
+ <div id="rightColSearch">
<div>
-
<div flexy:if="parks" class="fieldcontain">
+ <label class="fieldHdr2">Amenities</label>
<div class="glm-chbx">
{foreach:amenities,name,id}
<label for="amchbx-{id:h}" class="glm-chbx-label">
</div>
</div>
</div>
- <div class="fieldcontain">
+ <div id="submitSearch">
<input
style="float:left;margin-bottom: 15px;"
type="submit"
</div>
<script>
jQuery(document).ready(function() {
- $("#trail-search-form").button();
-
- $("#accordion").accordion();
- <?php if ($_REQUEST['parkId']) {?>
- $("#accordion").accordion('option', 'active', 1);
- <?php }?>
+ $("#advSearchRegions").change(function(){
+ updateCountySelect();
+ });
+ if ($("#advSearchRegions").val()) {
+ updateCountySelect();
+ }
});
+ function updateCountySelect() {
+ $.ajax({
+ dataType: 'json',
+ url: 'ajax/form.json',
+ data: {'regionId': $("#advSearchRegions").val()},
+ success: function(data) {
+ var currentVal = $("#advSearchCounties").val();
+ $("#advSearchCounties").html('<option value="">Counties</option>');
+ $.each(data, function(index, county) {
+ var sel
+ = (currentVal == county.county_id)
+ ? ' selected'
+ : '';
+ $("#advSearchCounties").append('<option value="' + county.county_id
+ + '" '+sel+'>'
+ + county.county_name + '</option>');
+ //console.log(county.county_id);
+ });
+ }
+ });
+ }
</script>
\ No newline at end of file