How to keep selected value in a dropdown box using JQUERY? - php

Question

Hi am using a jquery code like this
$(".selfont").change(function(event){
$('#dav').val();
window.location ='?davQ=' + $('#dav').val() + '&pathogenQ=' + $('#pathogen').val() + '&topicQ=' + $('#topicF').val() ;
});
I want to keep the dropdown value selected by the user in each dropdown boxes. But at present the value is not the one selected by the user, its always showing the first value. How can I set the dropdown field with value selected by the user using jquery? Please help me.
My first select box code is like below
<select name="dav" id="dav" style="width: 275px" class='selfont' >
<option value='' class=''>Select one</option>
<?php
$test = mysql_query("SELECT DISTINCT DataVersion FROM olivesdeptable ORDER BY DataVersion DESC");
$i=1;
while($numval=mysql_fetch_array($test))
{
print "<option value=\"".$numval['DataVersion']."\">".$numval['DataVersion']."</option>";
$i=$i+1;
}
?>
</select>
Even if we select value it will show as "Select one" in the field.
javascript code for dropdown fields
<script type="text/javascript">
if (document.getElementById("dav").selectedIndex < 1)
{
document.getElementById('pathogen').selectedIndex = "";
document.getElementById('pathogen').disabled = true;
}
if (document.getElementById("pathogen").selectedIndex < 1)
{
document.getElementById('topicF').selectedIndex = "";
document.getElementById('topicF').disabled = true;
}
if (document.getElementById("topicF").selectedIndex < 1)
{
document.getElementById('ind').selectedIndex = "";
document.getElementById('ind').disabled = true;
}
if (document.getElementById("ind").selectedIndex < 1)
{
document.getElementById('subind').selectedIndex = "";
document.getElementById('subind').disabled = true;
}
if (document.getElementById("subind").selectedIndex < 1)
{
document.getElementById('countryR').selectedIndex = "";
document.getElementById('countryRF').options.length = 0;
document.getElementById('countryRF').selectedIndex = "";
document.getElementById('countryR').disabled = true;
document.getElementById('countryRF').disabled = true;
}
</script>
even the value is updated, the second drop down box is showing as disabled ?
Next dropdown field markup is as below
<select name="pathogen" id="pathogen" style="width: 275px" class='selfont' >
<option value=''>Select one</option>
<?php
$test = mysql_query("SELECT DISTINCT Pathogen FROM olivesdeptable where DataVersion='$davQ' ORDER BY Pathogen ASC");
$i=1;
while($numval=mysql_fetch_array($test))
{
print "<option value=\"".$numval['Pathogen']."\">".$numval['Pathogen']."</option>";
$i=$i+1;
}
?>
</select>
only first dropbox value is working for next dropbox value is storing in url but in page the value shows as 'Select one' ? Please help to sort

Answer 1

$(document).ready(function () {
$('#dav').val(getURLParameter('davQ'));
$('#pathogenQ').val(getURLParameter('pathogenQ'));
$('#topicQ').val(getURLParameter('topicQ'));
$(".selfont").change(function (event) {
window.location = '?davQ=' + $('#dav').val() + '&pathogenQ=' + $('#pathogen').val() + '&topicQ=' + $('#topicF').val();
});
function getURLParameter(name) {
return decodeURI((RegExp(name + '=' + '(.+?)(&|$)').exec(location.search) || [, null])[1]);
}
});

Answer 2

<?php
$test = mysql_query("SELECT DISTINCT DataVersion FROM olivesdeptable ORDER BY DataVersion DESC");
$i=1;
$selected = '';
// make compare with the value you want to select with the parameter form url
// here I assume $_GET['davQ'] holds the value to $numval['DataVersion']
if($_GET['davQ'] == $numval['DataVersion']) $selected = 'selected';
while($numval=mysql_fetch_array($test))
{
echo "<option value=\"".$numval['DataVersion']."\" $selected>".$numval['DataVersion']."</option>";
$i=$i+1;
}
?>