javascript - 如何存储我从隐藏字段中的下拉和复选框中选择的值?
问题描述
<script>
var mainlist=document.form.seleField;
//var valuelist=document.form.seleValue
//var value=new Array();
var parent = document.getElementById("id1");
var value=[]
value[0]=""
value[1]=["Monthly|M", "Bi-Weekly|BW", "Weekly|W", "Daily|D"]
value[2]=["Monday|1", "Tuesday|2", "Wednesday|3", "Thursday|4", "Friday|5", "Saturday|6", "Sunday|7"]
value[3]=["> 100|100","> 300|300", "> 500|500", "> 700|700", "> 1000|1000", "> 1500|1500", "> 2000|2000" , "> 5000|5000"]
/* function updatevalue(selectedvaluegroup){
valuelist.options.length=0
if (selectedvaluegroup>0){
for (i=0; i<value[selectedvaluegroup].length; i++)
valuelist.options[valuelist.options.length]=new Option(value[selectedvaluegroup][i].split("|")[0],
value[selectedvaluegroup][i].split("|")[1])
}
}
*/
function updatevalue(selectedvaluegroup){
parent.innerHTML = "";
if(selectedvaluegroup ==2){
for (var i=0; i<value[selectedvaluegroup].length; i++){
var chkbox = document.createElement("input");
chkbox.type = "checkbox";
chkbox.name = "day[]";
chkbox.value = value[selectedvaluegroup][i].split("|")[1];
parent.appendChild(chkbox);
var text = document.createElement("span");
text.innerHTML = value[selectedvaluegroup][i].split("|")[0];
parent.appendChild(text);
}
}
else if(selectedvaluegroup > 0){
var select = document.createElement("select");
parent.appendChild(select);
for ( i=0; i<value[selectedvaluegroup].length; i++){
var option = document.createElement("option");
option.value = value[selectedvaluegroup][i].split("|")[1];
option.text = value[selectedvaluegroup][i].split("|")[0];
select.add(option);
}
}
}
</script>
<table border="0" width="100%">
<!-- START ADD FORM -->
<form name="form" action="<?$PHP_SELF?>" method="post" onsubmit="return chkField.exec();">
<tr bgcolor="#ffffff">
<td>
<input id="txtSupplierNo" name="txtSupplierNo" size="6" maxlength="6" class="txbDisplay" tabindex="<?=$tabindex++?>" value="<?=$_GET['primaryID']?>" readOnly>
</td>
<td>
<input id="txtSupplier" name="txtSupplier" type="text" size = "60" class="txbDisplay" tabindex="<?=$tabindex++?>" value="<?=$objSupp->Supplier?>" readOnly>
</td>
</tr>
<tr bgcolor="#3399CC">
<td class="tfvNormal" id="lblField">Criteria</td>
<td class="tfvNormal" id="lblValue" colspan="3">Parameter</td>
</tr>
<tr bgcolor="#ffffff">
<td>
<select class='selectBox' name="seleField" id="seleField" onChange="updatevalue(this.selectedIndex)" tabindex="<?=++$tabindex?>">
<option value="">select a rule</option>
<option value="OrderFrequency">Order Frequency</option>
<option value="OrderDay">Order Day</option>
<option value="MinimumOrder">Minimum Order Amount</option>
</select>
</td>
<td>
<!--<select class='selectBox' name="seleValue" id="seleValue" tabindex="<//?=++$tabindex?>"></select>-->
<div id="id1">
</div>
</td>
<td align="center" colspan="2">
<input type="image" src="../../../image/add.gif" name="buttSubmit" id="buttSubmit" value="Add" style="cursor: hand;" onClick="MM_showHideLayers('Layer1','','show')" alt="Add Records" <?=$Permission?> >
</td>
</tr>
</form>
<!-- END ADD FORM -->
我在获取数据并存储在数据库中时遇到问题。我有两个选择选项,即下拉菜单和复选框。我使用 javascript 来制作复选框,只有复选框选择才能将数据存储在数据库中。
if (($_POST['buttSubmit_x'] >= 0) && ($_POST['seleField'])){
$Field = trim($_POST['seleField']);
$Value = trim($_POST['seleValue']);
$Value = '';
foreach($_POST['day'] as $selected){
$Value .= trim($selected) . "|";
}
$SupplierNo = $_POST['txtSupplierNo'];
$Supplier = $_POST['txtSupplier'];
$CreateUser = $_SESSION['userID'];
$ModifyUser = $_SESSION['userID'];
$CreateDate = date("Y-m-j");
$CreateTime = date("H:i:s");
if($Field != 'OrderDay'){
$objchEx = SQL_QUERY("SELECT * FROM SupplierEx WHERE Field='$Field' and SupplierNo='$SupplierNo'");
if($objchEx->Value && $Value <> $objchEx->Value){
$chkPara = 1;
echo"<script>";
echo"alert('Duplicate $Field ! Kindly delete the existing Parameter.');";
echo"</script>";
}
}
<table border="0" width="100%">
<!-- START ADD FORM -->
<form name="form" action="<?$PHP_SELF?>" method="post" onsubmit="return chkField.exec();">
<tr bgcolor="#ffffff">
<td>
<input id="txtSupplierNo" name="txtSupplierNo" size="6" maxlength="6" class="txbDisplay" tabindex="<?=$tabindex++?>" value="<?=$_GET['primaryID']?>" readOnly>
</td>
<td>
<input id="txtSupplier" name="txtSupplier" type="text" size = "60" class="txbDisplay" tabindex="<?=$tabindex++?>" value="<?=$objSupp->Supplier?>" readOnly>
</td>
</tr>
<tr bgcolor="#3399CC">
<td class="tfvNormal" id="lblField">Criteria</td>
<td class="tfvNormal" id="lblValue" colspan="3">Parameter</td>
</tr>
<tr bgcolor="#ffffff">
<td>
<select class='selectBox' name="seleField" id="seleField" onChange="updatevalue(this.selectedIndex)" tabindex="<?=++$tabindex?>">
<option value="">select a rule</option>
<option value="OrderFrequency">Order Frequency</option>
<option value="OrderDay">Order Day</option>
<option value="MinimumOrder">Minimum Order Amount</option>
</select>
</td>
<td>
<!--<select class='selectBox' name="seleValue" id="seleValue" tabindex="<//?=++$tabindex?>"></select>-->
<div id="id1">
</div>
</td>
<td align="center" colspan="2">
<input type="image" src="../../../image/add.gif" name="buttSubmit" id="buttSubmit" value="Add" style="cursor: hand;" onClick="MM_showHideLayers('Layer1','','show')" alt="Add Records" <?=$Permission?> >
</td>
</tr>
</form>
<!-- END ADD FORM -->
<script>
var mainlist=document.form.seleField;
//var valuelist=document.form.seleValue
//var value=new Array();
var parent = document.getElementById("id1");
var value=[]
value[0]=""
value[1]=["Monthly|M", "Bi-Weekly|BW", "Weekly|W", "Daily|D"]
value[2]=["Monday|1", "Tuesday|2", "Wednesday|3", "Thursday|4", "Friday|5", "Saturday|6", "Sunday|7"]
value[3]=["> 100|100","> 300|300", "> 500|500", "> 700|700", "> 1000|1000", "> 1500|1500", "> 2000|2000" , "> 5000|5000"]
function updatevalue(selectedvaluegroup){
parent.innerHTML = "";
if(selectedvaluegroup ==2){
for (var i=0; i<value[selectedvaluegroup].length; i++){
var chkbox = document.createElement("input");
chkbox.type = "checkbox";
chkbox.name = "day[]";
chkbox.value = value[selectedvaluegroup][i].split("|")[1];
parent.appendChild(chkbox);
var text = document.createElement("span");
text.innerHTML = value[selectedvaluegroup][i].split("|")[0];
parent.appendChild(text);
}
}
else if(selectedvaluegroup > 0){
var select = document.createElement("select");
parent.appendChild(select);
for ( i=0; i<value[selectedvaluegroup].length; i++){
var option = document.createElement("option");
option.value = value[selectedvaluegroup][i].split("|")[1];
option.text = value[selectedvaluegroup][i].split("|")[0];
select.add(option);
}
}
}
</script>
解决方案
请检查以下示例。希望对您有所帮助
var foo = document.getElementById('foo');
var bar = document.getElementById('bar');
var valueBtn = document.getElementById('valueBtn');
foo.addEventListener('change', function () {
bar.value = this.options[this.selectedIndex].value;
}, true);
valueBtn.addEventListener('click', function () {
console.log(bar.value)
}, true);
<select id="foo">
<option>select option</option>
<option>a</option>
<option>b</option>
</select>
<input style="display:none " type="text" id="bar">
<input type="button" id="valueBtn" value="Click and check console">
推荐阅读
- javascript - 最大化表格高度,并在 JavaScript/React.js 中包含滚动条
- amazon-web-services - 默认情况下是 Cognito 高可用服务吗?
- r - 在 purrr 循环中将数据框的名称分配给 ggplot 标题
- mysql - UNION ALL MYSQL 真的很慢
- python - 在 MongoEngine 中按条件更新嵌套属性
- swift - 自定义单元格/表格视图
- r - 设置类并避免将输出从 tibble 转换为列表
- python - CSRF 令牌在 AJAX 中丢失或不正确
- javascript - 在函数外使用变量 nav
- python - 当我尝试使用 boto3 将文件上传到 S3 时找不到文件