如何使用 jQuery 从 AJAX 生成的选择下拉列表中获取文本选项
How can i get text option from AJAX generated select dropdown using jQuery?
我正在尝试使用 AJAX 填充下拉列表并尝试获取选择下拉列表的文本字段以及该选择的值。我正在获取文本,但只有预选文本。如果我在第二个下拉列表中更改选择,则与值对应的文本不会更改。这是我尝试过的——
< script type = "text/javascript" >
function AjaxFunction() {
var httpxml;
try {
// Firefox, Opera 8.0+, Safari
httpxml = new XMLHttpRequest();
} catch (e) {
// Internet Explorer
try {
httpxml = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
httpxml = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
alert("Your browser does not support AJAX!");
return false;
}
}
}
function stateck() {
if (httpxml.readyState == 4 && httpxml.status == 200) {
//alert(httpxml.responseText);
var myarray = JSON.parse(httpxml.responseText);
// Remove the options from 2nd dropdown list
for (j = document.testform.subcat_id.options.length - 1; j >= 0; j--) {
document.testform.subcat_id.remove(j);
}
for (i = 0; i < myarray.data.length; i++) {
var optn = document.createElement("OPTION");
optn.text = myarray.data[i].Description;
optn.value = myarray.data[i].Component_ID;
document.testform.subcat_id.options.add(optn);
document.getElementById("des").value = $("#subcat_id option:selected").text(); // here i get the text
}
}
} // end of function stateck
var url = "production_add_filter.php";
var cat_id = document.getElementById('cat_id').value;
url = url + "?cat_id=" + cat_id;
url = url + "&sid=" + Math.random();
httpxml.onreadystatechange = stateck;
//alert(url);
httpxml.open("GET", url, true);
httpxml.send(null);
} < /script>
<form name="testform" method='POST' action="production_add_exec.php">
<label>Select Category :</label>
<select name=cat_id id="cat_id" onchange=AjaxFunction(); required>
<option value=''>Select One</option></select>
<label>Select Component :</label>
<select name=subcat_id id='subcat_id' required>
<option value=''>Select One</option>
</select>
<input id="des" type=text>//updated text value required here !
<input type=submit value=submit>
</form>
更新的代码 -
for (i=0;i<myarray.data.length;i++)
{
var optn = document.createElement("OPTION");
optn.text = myarray.data[i].Description;
optn.value = myarray.data[i].Component_ID;
document.testform.subcat_id.options.add(optn);
document.getElementById("des").value = $("#subcat_id option:selected").text();
}
document.getElementById("des").value = $('#subcat_id').change(function() {
$('#des').val($('#subcat_id option:selected').text());
});
}
}
尝试将更改事件添加到第二个选择:
$('#subcat_id').change(function() {
$('#des').val($('#subcat_id option:selected').text());
});
相关文章:
- 将下拉列表“选择值”传递到 URL
- 禁用基于下拉列表选择 asp.net JavaScript 启用文本框
- 下拉列表<选择>为列表.js
- 经典 ASP - 下拉列表:选择与第一个下拉列表具有相同值的所有下拉列表
- 映射下拉列表选择到URL
- 删除基于先前下拉列表选择的“选择下拉列表”选项
- 下拉列表选择的值在UI淘汰js中没有更新
- 如何将 ID 分配给动态下拉列表选择
- 使用 dojo 将鼠标悬停在动态下拉列表选择上时添加工具提示
- 链接下拉列表选择列表代码 -- 连接数据
- Javascript 不遵循下拉列表选择
- 检索引导下拉列表选择文本
- 表单事件更改不适用于下拉列表选择
- 无法检测加载时的选择/下拉列表选择事件
- 如果另一个下拉列表选择发生更改,则重置另一个下拉列表
- 基于复选框和下拉列表选择优化列表
- 使用 AJAX 和 ORACLE 以及不使用 php 填充下拉列表(选择 )
- 如何在jQuery弹出窗口中显示下拉列表选择列表并检索所选值
- 调用 java 方法,从 jsp 中的下拉列表选择中设置参数值
- 使用列表而不是选项进行下拉列表选择