Coldfusion Заполните форму с помощью выпадающего списка, используя ajax

Итак, у меня есть проект, который использует ColdFusion, и у него есть форма с выпадающим списком.

See example: http://jsfiddle.net/mwoods98/KXmNK/

То, что мне нужно сделать после выбора выпадающего списка, - это вызов ajax для вызова Cfc ColdFusion, который возвращает информацию для заполнения формы, находящейся под раскрывающимся списком.

Используя приведенную выше скрипку в качестве примера, если пользователь выберет "2", то в поле имени будут Боб, 202 Fake Street и 111-555-1234. Если они выберут "3", они получат все остальное, что будет возвращено из CFC (базы данных).

У CFC будет просто вызов метода, который будет получать информацию, основанную на значении числа, представленного в раскрывающемся списке.

Любая помощь будет оценена.

Спасибо

3 ответа

Решение

Если вы используете jQuery, вы можете использовать встроенную в jquery функцию ajax, чтобы вызвать CFC, вернуть результат и заполнить поля. Кстати, если вы хотите сделать это, размещение идентификаторов на полях будет ОЧЕНЬ полезным.

$.ajax({
    type: 'get',
    url: 'pathToMy.cfc',
    data: {method:'getNameAddressAndNumberFromID'
        , myID : valueOfItemSelectedInDropDown
        },
    dataType: 'json',
    async: false,
    success: function(result){
         $('#myNameInput').val(result.NAME);
         $('#myNameInput').val(result.ADDRESS);
         $('#myNameInput').val(result.NUMBER);
        }
    }); 

Предположим, у вас есть CFC с именем "pathToMy.cfc" с методом "getNameAddressAndNumberFromID", и у вас есть идентификатор для входных данных, таких как Name:

<input name="name" id="myNameInput" type="Text">

результат метода может вернуть имя, адрес и номер из запроса. Возвращение этой информации в формате JSON будет действительно полезным.

Это должно привести вас на правильный путь, удачи.

В моем примере у меня есть набор раскрывающихся списков, которые зависят от уровня (Coldbox 3.5+, CF9)

Используя bindCFC и cfajax, здесь приведен пример первых двух выпадающих списков, второй зависит от

Мой фрагмент кода

<cfform>
    <cfselect name="groups" id="groups" bind="cfc:#getSetting('AppMapping')#.model.dynform.getGroups()" 
         bindOnLoad="Yes" 
         display="group_name" 
         value="group_id" />

    <cfselect name="events" id="events" selected="#form.event_id#" 
          bind="cfc:#getSetting('AppMapping')#.model.dynform.getEventsByGroup({groups})" 
          display="event_name" 
          value="event_id" 
          queryPosition="below">
</cfform>

Фрагмент моей модели (dynform)

<cffunction name="getGroups" access="remote" output="false" returntype="query"> 
    <cfset var qGroups = "">
    <cfquery datasource="#application.DSN#" name="qGroups">
       SELECT
               egc.nd_event_group_id                  group_id,
               egc.short_desc                         group_name
       FROM    event_group_code egc
       WHERE   egc.status_code = 'A'
       ORDER BY egc.sort_order
    </cfquery>
    <cfreturn qGroups>
</cffunction>

<cffunction name="getEventsByGroup" access="remote" output="false" returntype="query">
    <cfargument name="event_group_id" type="string" required="true">    
    <cfset var qEventsByGroup = "">
    <cfquery datasource="#application.DSN#" name="qEventsByGroup">
        SELECT ec.event_id,           
               ec.FULL_DESC as event_name              
        FROM   events ec
        WHERE  ec.event_group_id =  <cfqueryparam cfsqltype="cf_sql_varchar" value="#arguments.event_group_id#"> 

    </cfquery>
    <cfreturn qEventsByGroup>
</cffunction>

Хотя вышеприведенное сработает, я отказался от него для подхода JSON jQuery / ajax return. Причины почему:

  1. Coldbox way = Обработчики должны выполнять работу, а не представления

  2. CFajax/cfselect был медленнее, чем jQuery ajax, и с меньшим количеством опций. (Что, если я хочу поле множественного выбора? Или возвращено три атрибута данных, а не два?)

  3. Я не хотел использовать тег cfform в моем представлении, который требует cfselect

Я могу опубликовать JQuery AJAX способ, если это необходимо, но я думаю, что я ответил на оригинальный вопрос

Самый простой способ сделать это с помощью атрибута bind cfselect. Однако, используете ли вы этот метод или накатываете свой собственный jquery, сделайте это:

  1. Убедитесь, что ваш запрос работает, когда он не находится в CFC.
  2. Убедитесь, что ваш запрос работает, когда он находится в cfc, и вы вызываете его с помощью cfinvoke или из объекта.

Таким образом, если у вас возникнут проблемы с вызовом через ajax, вы будете знать, что виноват не cfc.

Другие вопросы по тегам