填充使用ColdFusion，jQuery和Ajax的第二个下拉列表 [英] Populating a second dropdown using ColdFusion, jQuery, and Ajax
问题描述
我有一个下拉菜单，有14的值。根据选择的值，它会查询SQL Server数据库，并返回一些客户端在第二个下拉列表显示。
我想要第二个下拉菜单使用jQuery的多选控件，每个值都有一个复选框以选择。
这是我最后一次尝试做的，它只是不工作。
＆LT;形式GT;
＆LT;标签=lstTiers＆GT;二线：LT; /标签＆gt;
＆LT;选择名称=lstTiersID =lstTiers＆GT;
＆LT;期权价值=1＆GT; 1级＆LT; /选项＆GT;
＆LT;期权价值=2＆GT;第2层和LT; /选项＆GT;
＆LT;期权价值=3＆GT;第3层和LT; /选项＆GT;
＆LT;期权价值=4＆GT;一线4℃/选项＆GT;
＆LT;期权价值=5＆GT;一级5℃/选项＆GT;
＆LT;期权价值=6＆GT;第6层＆LT; /选项＆GT;
＆LT;期权价值=7＆GT;第7层＆LT; /选项＆GT;
＆LT;期权价值=8＆GT;第8层＆LT; /选项＆GT;
＆LT;期权价值=9＆GT;第9层＆LT; /选项＆GT;
＆LT;期权价值=10＆GT;第10层和LT; /选项＆GT;
＆LT;期权价值=11＆GT;第11层和LT; /选项＆GT;
＆LT;期权价值=12＆GT; 12层＆LT; /选项＆GT;
＆LT;期权价值=13＆GT;二线13 LT; /选项＆GT;
＆LT;期权价值=14＆GT;二线14 LT; /选项＆GT;
＆LT; /选择＆GT;
＆LT;标签=lstClients＆GT;客户：LT; /标签＆gt;
＆LT;选择名称=lstClientsID =lstClients＆GT;
＆LT; /选择＆GT;
＆LT;输入类型=按钮NAME =click_meID =click_me值=点击我/＆GT;
＆LT; /形式GT;
下面是一次尝试在jQuery的：
$（'＃click_me）点击（函数（）{警报（'这里'）;
$阿贾克斯（{
网址：'？Ajax的test.cfc方法= returnSomething'，
数据： {
方法：$（'＃lstTiers）VAL（）。
}，
缓存：假的，
数据类型：JSON，
成功：功能（数据）{
$（'＃lstClients'）的HTML（数据）;
}，
//这个火灾时，使用ColdFusion发生错误
错误：函数（）{
警报（发生错误！）;
}
}）;
}）; //最后点选（）
我也尝试了一些其他的jQuery，我循环和内置的选项。
最后，这是我的CFC文件：
＆LT; CFCOMPONENT输出=假＆GT;
＆LT; cffunction访问=远程NAME =returnSomething的返回类型=查询returnformat =json的＆GT;
＆LT; cfargument名=一线式=字符串要求=是＆GT;
＆LT; CFQUERY NAME =qryGetClients数据源=ProjectGrid_Test＆GT;
选择事业部，CLIENTNAME从tblClientUpgradeClients WHERE级=＃arguments.Tier＃ORDER BY事业部
＆LT; / CFQUERY＆GT;
＆LT; cfreturn qryGetClients＆GT;
＆LT; cffunction＆GT;
＆LT; / CFCOMPONENT＆GT;
如果可能，返回下拉应该允许用户使用复选框多选。我已经打了jQuery的多选控件，我已经受够了工作，但不会在这个动态查询。
$（'＃lstClients）.multiselect（
{noneSelectedText：所有的选择，
显示：[淡出]，
隐藏：淡出]，
selectedList：1，
多：真，
uncheckAllText：清除]
}）;
尝试使用CFCOMPONENT和cfselect标签。
的下面链路可能是有用的。
的http://forta.com/blog/index.cfm/2007/5/31/ColdFusion-Ajax-Tutorial-2-Related-Selects
I have one dropdown that has 14 values. Depending on the value chosen, it'll query a SQL Server database and return some clients to display in a second dropdown.
I want that 2nd dropdown to use the jQuery Multiselect Widget where each value has a checkbox to select.
Here is what I last tried to do, and it just doesn't work.
<form>
<label for="lstTiers">Tier:</label>
<select name="lstTiers" id="lstTiers">
<option value="1">Tier 1</option>
<option value="2">Tier 2</option>
<option value="3">Tier 3</option>
<option value="4">Tier 4</option>
<option value="5">Tier 5</option>
<option value="6">Tier 6</option>
<option value="7">Tier 7</option>
<option value="8">Tier 8</option>
<option value="9">Tier 9</option>
<option value="10">Tier 10</option>
<option value="11">Tier 11</option>
<option value="12">Tier 12</option>
<option value="13">Tier 13</option>
<option value="14">Tier 14</option>
</select>
<label for="lstClients">Client:</label>
<select name="lstClients" id="lstClients">
</select>
<input type="button" name="click_me" id="click_me" value="Click Me" />
</form>
Here is one attempt at the jQuery:
$('#click_me').click(function() { alert('here');
$.ajax({
url: 'Ajax-test.cfc?method=returnSomething',
data: {
Tier: $('#lstTiers').val()
},
cache: false,
dataType: 'json',
success: function(data) {
$('#lstClients').html(data);
},
// This fires when an error with ColdFusion occurs
error: function() {
alert('An error has occured!');
}
});
}); // End click()
I had also tried some other jQuery where I looped and built the options.
Finally, here's my cfc file:
<cfcomponent output="false">
<cffunction access="remote" name="returnSomething" returntype="query" returnformat="json">
<cfargument name="Tier" type="string" required="yes">
<cfquery name="qryGetClients" datasource="ProjectGrid_Test">
SELECT Div, ClientName FROM tblClientUpgradeClients WHERE Tier = #arguments.Tier# ORDER BY Div
</cfquery>
<cfreturn qryGetClients>
<cffunction>
</cfcomponent>
If possible, that returned dropdown should allow user to multiselect using a checkbox. I've played with the jQuery Multiselect widget and I've had it work, but not on this dynamic query.
$('#lstClients).multiselect(
{ noneSelectedText:"All Selected",
show: ["fade"],
hide: ["fade"],
selectedList: 1,
multiple: true,
uncheckAllText: ["Clear"]
});
Try that using cfcomponent and cfselect tag.
The below link may be useful.
http://forta.com/blog/index.cfm/2007/5/31/ColdFusion-Ajax-Tutorial-2-Related-Selects
这篇关于填充使用ColdFusion，jQuery和Ajax的第二个下拉列表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
