HTML 在 SQL 查询中使用的下拉 onChange 值
HTML dropdown onChange value to be used in SQL query
我有一个 Web 表单(我认为 HTML5 兼容!),它使用经典 ASP 和 VBScript,带有一些自由文本字段、一个日期选择器和一些下拉选项从各种 SQL 查询中提取。 (这是用于测试此问题的表单的精简基本版本。)
其中一个下拉菜单需要显示依赖于上一个下拉菜单中的选择的选项。
我可以使用 javascript onChange 获取所选选项并将其显示在页面上(这是当前 get_boiler 脚本所做的,但我不知道如何使用在用于显示所需选项的查询中。
OnChange 获取值的下拉列表是 "Installed Boiler Make",将使用该值作为 SQL 查询的一部分的下拉列表是 "Installed Boiler Model"
我考虑过将该值作为查询字符串推出并重新加载表单,但后来我丢失了所有先前输入的值,这不是我想要的结果。
任何人都可以指出我正确的方向吗?
需要使用所选值的查询是名为 "models" 的记录集。我放了????作为 SQL 查询中的临时值。
希望我已经正确解释了这一点并在 post 中使用了正确的标签。
我不是在找人为我做这项工作,只是给我指明正确的方向。我通过 Whosebug 仔细查看了一个与此相同的问题,但没有找到任何试图做同样的事情。
<!--#include virtual="/includes/functions.asp"-->
<!DOCTYPE html>
<%
Call OpenDB()
Call OpenRecordSet(heatcontrols, "select callmd3_field_no, callmd3_listitem from dbo.Call_More_Def3 where callmd3_link_to_def1 = 'LOG' and callmd3_field_no = '170' and callmd3_listorder not in ('1') order by callmd3_listorder")
Call OpenRecordSet(maincontrols, "select callmd3_field_no, callmd3_listitem from dbo.Call_More_Def3 where callmd3_link_to_def1 = 'LOG' and callmd3_field_no = '168' and callmd3_listorder not in ('1') order by callmd3_listorder")
Call OpenRecordSet(installtype, "select callmd3_field_no, callmd3_listitem from dbo.Call_More_Def3 where callmd3_link_to_def1 = 'LOG' and callmd3_field_no = '171' and callmd3_listorder not in ('1') order by callmd3_listorder")
Call OpenRecordSet(makes, "select make from lu_make where make not in ('-') order by make")
Call OpenRecordSet(models, "select model from lu_model where link_to_make = '????' order by model")
%>
<html>
<head>
<title>TEST</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="/includes/css/installer.css"/>
<link rel="stylesheet" href="/includes/datepicker/jquery.ui.all.css"/>
<script type="text/javascript" src="/includes/scripts/jquery.min.js"></script>
<script type="text/javascript" src="/includes/scripts/jquery-1.7.1.js"></script>
<script type="text/javascript" src="/includes/scripts/jquery.ui.core.js"></script>
<script type="text/javascript" src="/includes/scripts/jquery.ui.datepicker.js"></script>
<script>
$(function() {
$( "#surveydate" ).datepicker({
dateFormat: 'dd MM yy'
});
});
</script>
<script type="text/javascript">
function get_boiler(){
document.getElementById("boilervalue").innerHTML = document.getElementById("boilermake").value;
return true;
}
</script>
<script type="text/javascript" src="/includes/scripts/update-validate.js"></script>
<script type="text/javascript" src="/includes/scripts/update-showhide.js"></script>
</head>
<body>
<div class="popup-content">
<form method="POST" name="updatejob" action="/includes/update.asp" onsubmit="return validateForm()">
<h1>TEST FORM</h1>
<br/>
<b>Surveyor</b>
<br/>
<input type="text" name="surveyor" id="surveyor" maxlength="50" class="addjobmenudropmedium">
<br/><br/>
<b>Survey Date</b>
<br/>
<input type="text" name="surveydate" id="surveydate" class="addjobmenudropmedium">
<br/><br/>
<b>Heating Controls (with boiler install)</b>
<br/>
<select name="continst" id="continst" class="addjobmenudropsmall">
<option value="">Select.....</option>
<% WHILE (NOT heatcontrols.EOF) %>
<option value="<%=heatcontrols.Fields("callmd3_listitem").value %>"><%=heatcontrols.Fields("callmd3_listitem").value %></option>
<% heatcontrols.movenext()
Wend %>
</select>
<br/><br/>
<b>Main Heating Controls</b>
<br/>
<select name="heatcon" id="heatcon" class="addjobmenudrop">
<option value="">Select.....</option>
<% WHILE (NOT maincontrols.EOF) %>
<option value="<%=maincontrols.Fields("callmd3_listitem").value %>"><%=maincontrols.Fields("callmd3_listitem").value %></option>
<% maincontrols.movenext()
Wend %>
</select>
<br/><br/>
<b>Install Type</b>
<br/>
<select name="installtype" id="installtype" class="addjobmenudrop">
<option value="">Select.....</option>
<% WHILE (NOT installtype.EOF) %>
<option value="<%=installtype.Fields("callmd3_listitem").value %>"><%=installtype.Fields("callmd3_listitem").value %></option>
<% installtype.movenext()
Wend %>
</select>
<br/><br/>
<b>Installed Boiler Make</b>
<br/>
<select name="boilermake" id="boilermake" class="addjobmenudrop" onChange="get_boiler()">
<option value="">Select.....</option>
<% WHILE (NOT makes.EOF) %>
<option value="<%=makes.Fields("make").value %>"><%=makes.Fields("make").value %></option>
<% makes.movenext()
Wend %>
</select>
<br/><br/>
<b>Installed Boiler Model</b>
<br/>
<select name="boilermodel" id="boilermodel" class="addjobmenudrop">
<option value="">Select.....</option>
<% WHILE (NOT models.EOF) %>
<option value="<%=models.Fields("model").value %>"><%=models.Fields("model").value %></option>
<% models.movenext()
Wend %>
</select>
<br/><br/>
<b>Installed Boiler Serial Number</b>
<br/>
<input type="text" name="boilerserial" id="boilerserial" maxlength="50" class="addjobmenudropmedium">
<br/><br/>
<b>Notes</b>
<br/>
<textarea name="notes" id="notes" rows="5" cols="62" maxlength="1000" class="addjobtextbox"></textarea>
<br/><br/><br/>
<input type="submit" value="UPDATE JOB" name="Submit" class="formbutton">
<br/><br/><br/>
</form>
</div>
<%
Call CloseRecordSet(heatcontrols)
Call CloseRecordSet(maincontrols)
Call CloseRecordSet(installtype)
Call CloseRecordSet(makes)
Call CloseRecordSet(models)
Call CloseDB()
%>
</body>
</html>
这是表格的实时版本 - http://www.chenks.co.uk/form.asp
我还没有用 ASP 编程,但我想它的工作方式与你用 PHP 做的一样:
创建一个名为 "ModelsDropdown.asp" 的新页面,其中包含下拉菜单所需的内容:
<!--#include virtual="/includes/functions.asp"-->
<%
Call OpenDB()
Call OpenRecordSet(models, "select model from lu_model where link_to_make = url_parameter_make order by model")
%>
<option value="">Select.....</option>
<% WHILE (NOT models.EOF) %>
<option value="<%=models.Fields("model").value %>"><%=models.Fields("model").value %></option>
<% models.movenext()
Wend %>
<%
Call CloseRecordSet(models)
Call CloseDB()
%>
您如何在 ASP 中使用 URL 参数 我不知道,但我希望您知道。当你打开 http://www.chenks.co.uk/ModelsDropdown.asp?make=some_make
它应该只为传递的品牌吐出 select 选项。
现在您可以通过JavaScript/Ajax获取此内容并将其放入您的原始表单中:
$("#boilermake").on("change", function(){
// Use jQuery get to call your new page with the selected make as parameter
$.get("/ModelsDropdown.asp", {make: $("#boilermake")[0].value}, function(data){
// paste the select options into the DOM
$("#boilermodel").html(data);
});
});
我有一个 Web 表单(我认为 HTML5 兼容!),它使用经典 ASP 和 VBScript,带有一些自由文本字段、一个日期选择器和一些下拉选项从各种 SQL 查询中提取。 (这是用于测试此问题的表单的精简基本版本。)
其中一个下拉菜单需要显示依赖于上一个下拉菜单中的选择的选项。
我可以使用 javascript onChange 获取所选选项并将其显示在页面上(这是当前 get_boiler 脚本所做的,但我不知道如何使用在用于显示所需选项的查询中。
OnChange 获取值的下拉列表是 "Installed Boiler Make",将使用该值作为 SQL 查询的一部分的下拉列表是 "Installed Boiler Model"
我考虑过将该值作为查询字符串推出并重新加载表单,但后来我丢失了所有先前输入的值,这不是我想要的结果。
任何人都可以指出我正确的方向吗? 需要使用所选值的查询是名为 "models" 的记录集。我放了????作为 SQL 查询中的临时值。
希望我已经正确解释了这一点并在 post 中使用了正确的标签。 我不是在找人为我做这项工作,只是给我指明正确的方向。我通过 Whosebug 仔细查看了一个与此相同的问题,但没有找到任何试图做同样的事情。
<!--#include virtual="/includes/functions.asp"-->
<!DOCTYPE html>
<%
Call OpenDB()
Call OpenRecordSet(heatcontrols, "select callmd3_field_no, callmd3_listitem from dbo.Call_More_Def3 where callmd3_link_to_def1 = 'LOG' and callmd3_field_no = '170' and callmd3_listorder not in ('1') order by callmd3_listorder")
Call OpenRecordSet(maincontrols, "select callmd3_field_no, callmd3_listitem from dbo.Call_More_Def3 where callmd3_link_to_def1 = 'LOG' and callmd3_field_no = '168' and callmd3_listorder not in ('1') order by callmd3_listorder")
Call OpenRecordSet(installtype, "select callmd3_field_no, callmd3_listitem from dbo.Call_More_Def3 where callmd3_link_to_def1 = 'LOG' and callmd3_field_no = '171' and callmd3_listorder not in ('1') order by callmd3_listorder")
Call OpenRecordSet(makes, "select make from lu_make where make not in ('-') order by make")
Call OpenRecordSet(models, "select model from lu_model where link_to_make = '????' order by model")
%>
<html>
<head>
<title>TEST</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="/includes/css/installer.css"/>
<link rel="stylesheet" href="/includes/datepicker/jquery.ui.all.css"/>
<script type="text/javascript" src="/includes/scripts/jquery.min.js"></script>
<script type="text/javascript" src="/includes/scripts/jquery-1.7.1.js"></script>
<script type="text/javascript" src="/includes/scripts/jquery.ui.core.js"></script>
<script type="text/javascript" src="/includes/scripts/jquery.ui.datepicker.js"></script>
<script>
$(function() {
$( "#surveydate" ).datepicker({
dateFormat: 'dd MM yy'
});
});
</script>
<script type="text/javascript">
function get_boiler(){
document.getElementById("boilervalue").innerHTML = document.getElementById("boilermake").value;
return true;
}
</script>
<script type="text/javascript" src="/includes/scripts/update-validate.js"></script>
<script type="text/javascript" src="/includes/scripts/update-showhide.js"></script>
</head>
<body>
<div class="popup-content">
<form method="POST" name="updatejob" action="/includes/update.asp" onsubmit="return validateForm()">
<h1>TEST FORM</h1>
<br/>
<b>Surveyor</b>
<br/>
<input type="text" name="surveyor" id="surveyor" maxlength="50" class="addjobmenudropmedium">
<br/><br/>
<b>Survey Date</b>
<br/>
<input type="text" name="surveydate" id="surveydate" class="addjobmenudropmedium">
<br/><br/>
<b>Heating Controls (with boiler install)</b>
<br/>
<select name="continst" id="continst" class="addjobmenudropsmall">
<option value="">Select.....</option>
<% WHILE (NOT heatcontrols.EOF) %>
<option value="<%=heatcontrols.Fields("callmd3_listitem").value %>"><%=heatcontrols.Fields("callmd3_listitem").value %></option>
<% heatcontrols.movenext()
Wend %>
</select>
<br/><br/>
<b>Main Heating Controls</b>
<br/>
<select name="heatcon" id="heatcon" class="addjobmenudrop">
<option value="">Select.....</option>
<% WHILE (NOT maincontrols.EOF) %>
<option value="<%=maincontrols.Fields("callmd3_listitem").value %>"><%=maincontrols.Fields("callmd3_listitem").value %></option>
<% maincontrols.movenext()
Wend %>
</select>
<br/><br/>
<b>Install Type</b>
<br/>
<select name="installtype" id="installtype" class="addjobmenudrop">
<option value="">Select.....</option>
<% WHILE (NOT installtype.EOF) %>
<option value="<%=installtype.Fields("callmd3_listitem").value %>"><%=installtype.Fields("callmd3_listitem").value %></option>
<% installtype.movenext()
Wend %>
</select>
<br/><br/>
<b>Installed Boiler Make</b>
<br/>
<select name="boilermake" id="boilermake" class="addjobmenudrop" onChange="get_boiler()">
<option value="">Select.....</option>
<% WHILE (NOT makes.EOF) %>
<option value="<%=makes.Fields("make").value %>"><%=makes.Fields("make").value %></option>
<% makes.movenext()
Wend %>
</select>
<br/><br/>
<b>Installed Boiler Model</b>
<br/>
<select name="boilermodel" id="boilermodel" class="addjobmenudrop">
<option value="">Select.....</option>
<% WHILE (NOT models.EOF) %>
<option value="<%=models.Fields("model").value %>"><%=models.Fields("model").value %></option>
<% models.movenext()
Wend %>
</select>
<br/><br/>
<b>Installed Boiler Serial Number</b>
<br/>
<input type="text" name="boilerserial" id="boilerserial" maxlength="50" class="addjobmenudropmedium">
<br/><br/>
<b>Notes</b>
<br/>
<textarea name="notes" id="notes" rows="5" cols="62" maxlength="1000" class="addjobtextbox"></textarea>
<br/><br/><br/>
<input type="submit" value="UPDATE JOB" name="Submit" class="formbutton">
<br/><br/><br/>
</form>
</div>
<%
Call CloseRecordSet(heatcontrols)
Call CloseRecordSet(maincontrols)
Call CloseRecordSet(installtype)
Call CloseRecordSet(makes)
Call CloseRecordSet(models)
Call CloseDB()
%>
</body>
</html>
这是表格的实时版本 - http://www.chenks.co.uk/form.asp
我还没有用 ASP 编程,但我想它的工作方式与你用 PHP 做的一样:
创建一个名为 "ModelsDropdown.asp" 的新页面,其中包含下拉菜单所需的内容:
<!--#include virtual="/includes/functions.asp"-->
<%
Call OpenDB()
Call OpenRecordSet(models, "select model from lu_model where link_to_make = url_parameter_make order by model")
%>
<option value="">Select.....</option>
<% WHILE (NOT models.EOF) %>
<option value="<%=models.Fields("model").value %>"><%=models.Fields("model").value %></option>
<% models.movenext()
Wend %>
<%
Call CloseRecordSet(models)
Call CloseDB()
%>
您如何在 ASP 中使用 URL 参数 我不知道,但我希望您知道。当你打开 http://www.chenks.co.uk/ModelsDropdown.asp?make=some_make 它应该只为传递的品牌吐出 select 选项。
现在您可以通过JavaScript/Ajax获取此内容并将其放入您的原始表单中:
$("#boilermake").on("change", function(){
// Use jQuery get to call your new page with the selected make as parameter
$.get("/ModelsDropdown.asp", {make: $("#boilermake")[0].value}, function(data){
// paste the select options into the DOM
$("#boilermodel").html(data);
});
});