使用ColdFusion,jQuery和Ajax填充第二个下拉列表

我有一个有14个值的下拉列表。 根据所选的值,它将查询SQL Server数据库并返回一些客户端以在第二个下拉列表中显示。

我希望第二个下拉列表使用jQuery Multiselect Widget,其中每个值都有一个复选框可供选择。

这是我上次尝试做的事情,它只是不起作用。

Tier 1 Tier 2 Tier 3 Tier 4 Tier 5 Tier 6 Tier 7 Tier 8 Tier 9 Tier 10 Tier 11 Tier 12 Tier 13 Tier 14

这是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() 

我还尝试了一些其他jQuery,我循环并构建了选项。

最后,这是我的cfc文件:

     SELECT Div, ClientName FROM tblClientUpgradeClients WHERE Tier = #arguments.Tier# ORDER BY Div     

如果可能,返回的下拉列表应允许用户使用复选框进行多选。 我玩过jQuery Multiselect小部件,我已经有了它,但不是这个动态查询。

 $('#lstClients).multiselect( { noneSelectedText:"All Selected", show: ["fade"], hide: ["fade"], selectedList: 1, multiple: true, uncheckAllText: ["Clear"] }); 

在这个例子中,我会尽力使用你编码的白话

请注意我使用的是coldfusion 9.0.1和jquery 1.9+

 jquery/javascript $('#lstTiers').on('change', function (){ $.ajax({ url:'Ajax-test.cfm', data: {'method': 'returnSomething', 'Tier': $(this).val(); }, success: function(json){ if (json != '' ) var vx=''; $.each (json, function(k, v){ vx+=''; }); $('#lstClients').html(vx); } }); //end ajax() }); 

ColdFusion的

     Select * from Clients WHERE Tier = #arguments.Tier# ORDER BY 1    

继续这件事,你需要看看json格式给你的返回类型,如果是coldfusion json,你会将每次迭代的jquery更改为$.each (json.DATA, function(k, v){

我以MVC的方式做事,就像我的json是标准的非CF输出,所以这是我的代码的一个例子

调节器

       select distinct d.init_contact_staff, initcap(e.pref_name_sort) name from ben_activity_dtl d inner join entity e on e.id_number = d.init_contact_staff where d.nd_event_id =   and d.request_status_code =   order by 2 asc    

模型

             

尝试使用cfcomponent和cfselect标记。

以下链接可能有用。

http://forta.com/blog/index.cfm/2007/5/31/ColdFusion-Ajax-Tutorial-2-Related-Selects