2016-02-29 3 views
1

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

Затем я пытаюсь взять эту сумму в долларах и изменить значение элемента <input>.

Я могу успешно запустить свой CFC и вернуть правильное значение, но мой JQUERY не меняет значение моего поля ввода. Он пропускает мой успех: метод и подходит к моей ошибке: метод.

Вот мой код формы:

<cfselect class="required" queryPosition="below" query="get_ticket" display="company_name" name="customer_checkout" id="customer_checkout" tabindex="0" onchange="PopulateGrandTotal();" ><option>---Make A Selection---</option></cfselect> 

<div id="grant_totalDIV" > 
     <input type="number" name="grand_total_due" id="grand_total_due"> 
</div> 

Вот мой CFC:

<cffunction name="getTotal" access="remote" returntype="any"> 
<cfargument name="customer_checkout" type="any" required="true"> 

<!--- localize function variables ---> 
<cfset var dataDetail = ""> 

<cfquery name="dataDetail" datasource="#datasource#" > 
select grand_total 
from service_ticket 
where company_name = '#customer_checkout#' 
</cfquery> 


<cfoutput query="dataDetail"> 

    <cfreturn dataDetail.grand_total> 
</cfoutput> 
</cffunction></cfcomponent> 

Вот JQuery:

<script> 
function PopulateGrandTotal(){ 
    // Populate the customer alert DIV based on the customer selection 
    console.log($("#customer_checkout>option:selected").attr("Value")); 

    $.ajax({ 
     url:'cfcs/grand_totalDIV.cfc?method=getTotal&returnformat=json', 
     dataType: 'json', 
     data: { customer_checkout: $("#customer_checkout>option:selected").attr("Value") }, 

     success: function(response) { 
      console.log('Successfully ran JSON, now changing input value'); 
      $("#grand_total_due").val(response); 

      console.log('Input value cahnged'); 

      }, 
     error: function(response){ 

       console.log('Error'); 

       } 
     }); 
} 
</script> 

Мой JSON ответ:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 

</head> 
<body> 

</body> 
274.00 

Может ли кто-нибудь помочь?

ответ

2

Похоже, вы просто возвращаете текст, поэтому не используйте dataType: 'json',, так как это не то, что отправляется.

Вы можете просто удалить эту опцию из конфигурации АЯКСА

В противном случае вам нужно будет JSon сериализовать структура и доступ к нужному свойству в обработчике успеха

+0

ОК, я заметил, что часть кода, и теперь он запускает успех: метод, поскольку я могу видеть, как он регистрирует сообщения, которые я закодировал там. Но это не меняет значение моего поля ввода с ответом. Является ли эта часть моего кода правильной? –

+0

попробуйте войти в ответ на консоль – charlietfl

+0

UPDATE: Я изменил тип для поля ввода из числа в текст, теперь он меняет свое значение на это: 274,00 –

1

(слишком долго для комментариев)

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

  • Установите CFFunction использовать тип ИЭ соответствующий обратный returntype="numeric" или returntype="string"
  • Тогда скажите CF, какой формат он должен использовать, снабжая параметр returnformat и используйте dataType, чтобы сообщить jQuery, какой тип данных он должен ожидать получить. Как упоминалось в комментариях, по умолчанию используется intelligent guess: (xml, json, script, or html). Тем не менее, поставка его ничем не повредит, и указание ее явно помогает избежать непреднамеренных путаниц, таких как исходная ошибка json/text IMO.

    $.ajax({ 
        url:'cfcs/grand_totalDIV.cfc?method=getTotal&returnformat=plain', 
        dataType: 'text', 
        ... 
    }); 
    

Кроме того, ничего не делать с вашей ошибкой, но несколько советов:

  • Поскольку функция фактически не показывая ничего, нет никакой необходимости в <cfoutput query="...">. Просто верните одно значение: <cfreturn dataDetail.grand_total>
  • Если для функции требуется определенный тип значения для customer_checkout (например, строка, номер и т. Д.), Укажите его в сигнатуре аргумента, а не используя type="any".
  • Всегда используйте cfqueryparam для повышения производительности и защиты от инъекции SQL
  • Не забудьте размаху все переменные, т.е. arguments.customer_checkout вместо customer_checkout
+0

FYI 'plain' не является допустимым типом данных ...« text »..or« html »будет, но интеллектуально угаданным встроенным, будет по умолчанию использоваться text/html – charlietfl

+0

@ charlietfl - Ой, спасибо. Это была ошибка копирования + вставка. Я обновлю его. Конечно, это * может * догадаться, но мое предложение о выравнивании типов было главным образом для того, чтобы подчеркнуть, где «формат» вписывается в изображение и что между двумя сторонами существует связь (честно говоря, казалось, что это было совершенно ясно к спрашиваемому). – Leigh