I have a script below that works for auto-populating dropdown menu from the select tag based on INPUT TEXT .. How can I actually make it so if a user wants to change the option that has been autopopulated , he or she can still change what has been populated in the dropdown menu by the option of his or her choice while still leaving the AUTOPOPULATING feature on , I'd like it to still autopopulate , but in the event that a users doesn't like the option , he can still change it .. Below is the working script for autopopulating the dropdown select
<html>
<head> <title> validation </title >
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<script type="text/javascript">
function checkValues()
{
jQuery("#ddl_StxName").val("stm3","stx2");
jQuery("#ddl_rtumodel").val("both");
ESNList = jQuery("#ESNList").val();
if((ESNList >= 986329) && (ESNList <= 999999))
{
jQuery("#ddl_StxName").val("stx2");
jQuery("#ddl_rtumodel").val("globalstar");
}
if ((ESNList >= 660000) && (ESNList <= 699999))
{
jQuery("#ddl_StxName").val("mmt");
jQuery("#ddl_rtumodel").val("globalstar");
}
if ((ESNList >= 200000) && (ESNList <= 299999))
{
jQuery("#ddl_StxName").val("stm3");
jQuery("#ddl_rtumodel").val("stmcomtech");
}
if ((ESNList >= 1202114) && (ESNList <= 1299999))
{
jQuery("#ddl_StxName").val("smartone");
jQuery("#ddl_rtumodel").val("globalstar");
}
// you should be able to follow the above and add your own conditions
}
function checkInput()
{
jQuery(":text").each(function (){
if (jQuery(this).val().length == 0)
{
jQuery(this).css("border", "2px solid red");
}
else
{
jQuery(this).css("border", "0");
}
});
}
setInterval(function () {checkInput();checkValues();}, 500);
</script>
<body>
<form id="provision">
ESNList: <input type="text" id="ESNList" name="ESNList" size="30" /> <br />
ESN Start:<input type="text" id="ESNStart" name="ESNStart" size="10" /> <br />
ESN End: <input type="text" id="ESNStart" name="ESNStart" size="10" /> <br />
UnitName:<input type="text" id="STxName" name="STxName" size="30" /> <br />
Unit Model: <select name="STxName" id="ddl_StxName">
<option value="stx2">STX2</option>
<option value="stm3" selected>STM3</option>
<option value="acutec">Acutec</option>
<option value="trackpack">Trackpack</option>
<option value="mmt">MMT</option>
<option value="smartone">Smartone</option>
<option value="smartoneb" >SmartOneB</option>
</select> <br />
RTU Model Type:
<select name="rtumodel" id ="ddl_rtumodel">
<option value="globalstar">GlobalStar</option>
<option value="both">Both</option>
<option value="comtech">Comtech</option>
<option value="stmcomtech">STMComtech</option>
</select> <br />
<input type="submit" value ="submit" />
</form>
</body>
</html>
Hmmm My instinct is to use events rather than have all those constant background checks going via the setInterval....
Something like this
$(":text").css("border", "2px solid red");
$(":text").keyup(function(){
var enteredData = $(this).val()
if (enteredData == "") {
$(this).css("border", "2px solid red");
} else {
$(this).css("border", "inherit");
}
if ($(this).attr("id") == "ESNList"){
esnList = parseInt(enteredData);
switch (true){
case ( esnList >= 986329 && esnList <= 999999):
$("#ddl_StxName").val("stx2");
$("#ddl_rtumodel").val("globalstar");
break;
case ( esnList >= 660000 && esnList <= 699999):
$("#ddl_StxName").val("mmt");
$("#ddl_rtumodel").val("globalstar");
break;
case ( esnList >= 200000 && esnList <= 299999):
$("#ddl_StxName").val("stm3");
$("#ddl_rtumodel").val("stmcomtech");
break;
case ( esnList >= 1202114 && esnList <= 1299999):
$("#ddl_StxName").val("smartone");
$("#ddl_rtumodel").val("globalstar");
break;
}
}
});
Keeping to tradition, there is a fiddle here
I think, if it was my project, I'd probably look at making and array of objects to manage the product range and use them to build the dropdowns and events - easier to manage in the long run for a little more work up front.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.