Заполнение второго раскрывающегося списка с использованием ColdFusion, jQuery и Ajax

Question

У меня есть одно выпадающее меню, которое имеет 14 значений. В зависимости от выбранного значения он будет запрашивать базу данных SQL Server и возвращать некоторые клиенты для отображения во втором раскрывающемся списке.

Я хочу, чтобы второе выпадающее меню использовало виджет jquery Multiselect, в котором у каждого значения есть флажок.

Вот что я в последний раз пытался сделать, и он просто не работает.

<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> 

Вот одна попытка на 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:

<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> 

Если возможно, что вернулся выпадающий список должен позволить пользователю MULTISELECT с помощью флажка. Я играл с виджетами jQuery Multiselect, и я работал, но не по этому динамическому запросу.

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

Answer 1

Я сделаю все возможное, чтобы использовать жаргон вашего кодирования в данном примере

нотой я использую 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='<option value="">All</option>'; 
        $.each (json, function(k, v){ 

         vx+='<option value="'+v.client_id+'">'+v.client_name+'</option>';    
        }); 
        $('#lstClients').html(vx); 
        } 

       }); //end ajax() 

     }); 

Coldfusion

<cffunction name="returnSomething" access="remote" output="false" returntype="json"> 
<cfargument name="Tier" type="string" required="yes"> 
    <cfset var qryGetClients= ""> 
     <cfquery name="qryGetClients" datasource="ProjectGrid_Test"> 
Select * from Clients WHERE Tier = #arguments.Tier# ORDER BY 1 
    </cfquery> 
    <cfreturn qryGetClients> 
</cffunction> 

heres the thing, вам нужно посмотреть, какой тип возвращаемого формата json вам даст, если это coldfusion json, вы wou Л.Д. менять Jquery каждой итерации к $.each (json.DATA, function(k, v){

я делать вещи так, как MVC, и как мой JSON быть стандартным не выход CF, так Heres пример моего кода

контроллер

<cffunction name="getRequestorsByEvent" access="remote" output="false" returntype="query"> 
     <cfargument name="nd_event_id" type="string" required="false"> 
     <cfargument name="status" type="string" required="false"> 
     <cfset var qRequestorsByEvent = ""> 
     <cfquery datasource="#application.DSN#" name="qRequestorsByEvent"> 
    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 = <cfqueryparam cfsqltype="cf_sql_varchar" value="#arguments.nd_event_id#"> 
    <cfif isDefined("arguments.status") and arguments.status neq ""> 
           and d.request_status_code = <cfqueryparam cfsqltype="cf_sql_varchar" value="#arguments.status#"> 
          </cfif> 
    order by 2 asc  
     </cfquery> 
     <cfreturn qRequestorsByEvent> 
    </cffunction> 

модель

<cffunction name="RequestorsByEvent" output="false" hint="index"> 
    <cfset var rc=event.getcollection()> 
    <cfset var returnArray = ArrayNew(1) /> 
    <cfset qRequestorsByEvent = getmodel("dynform").getRequestorsByEvent(rc.nd_event_id, Event.getValue("status", ''))> 
    <cfloop query="qRequestorsByEvent"> 
     <cfset RequestorsStruct = StructNew() /> 
     <cfset RequestorsStruct["init_contact_staff"] = init_contact_staff/> 
     <cfset RequestorsStruct["name"] = name /> 

     <cfset ArrayAppend(returnArray,RequestorsStruct) /> 
    </cfloop>   

    <cfset event.renderData(type="json", data=returnArray) /> 
</cffunction> 

Answer 2

Попробуйте использовать cfcomponent и cfselect.

Данная ссылка может быть полезна.

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