2010-03-31 3 views
1

Я упростил этот пример настолько, насколько смогу. У меня есть функция дистанционного:

<cfcomponent output="false"> 
<cffunction name="Read" access="remote" output="false"> 
    <cfset var local = {}> 

    <cfquery name="local.qry" datasource="myDatasource"> 
    SELECT PersonID,FirstName,LastName FROM Person 
    </cfquery> 
    <cfreturn local.qry> 
</cffunction> 
</cfcomponent> 

и используя метод .ajax JQuery $, я хотел бы сделать маркированный список всех.

<!DOCTYPE HTML> 
    <html> 
    <head> 
    <script src="http://www.google.com/jsapi"></script> 
    <script type="text/javascript"> 
    google.load("jquery", "1"); 
    </script> 
    <script type="text/javascript"> 
    jQuery(function($){ 
    $.ajax({ 
      url: "Remote/Person.cfc?method=Read&ReturnFormat=json", 
      success: function(data){ 
       var str = '<ul>'; 
// This is where I need help: 
       for (var I=0; I<data.length; I++) { 
        str += '<li>' + I + data[I][1]+ '</li>' 
       } 
       str += '</ul>'; 
       $('body').html(str); 
      }, 
      error: function(ErrorMsg){ 
       console.log("Error"); 
      } 
     }); 
    }); 
    </script> 
    </head> 
    <body> 
    </body> 
    </html> 

Часть, где я потеряна, является местом, где я перебираю данные. Я предпочитаю использовать метод jQuery $ .ajax, потому что понимаю, что $ .get и $ .post не имеют захвата ошибок.

Я не знаю, как обращаться с JSON, возвращенным из cfc.

ответ

8

Похоже результат в формате JSON (проверьте документы http://livedocs.adobe.com/coldfusion/8/htmldocs/help.html?content=Tags_f_21.html). «Если вы укажете returnformat =« json », и функция возвращает запрос, ColdFusion сериализует запрос в объект JSON с двумя записями и массив имен столбцов и массив массивов данных столбцов. Дополнительные сведения см. В разделе SerializeJSON." http://livedocs.adobe.com/coldfusion/8/htmldocs/help.html?content=Tags_f_21.html

Итак, первый массив (data.COLUMNS должен быть массивом имен столбцов. Data.COLUMNS [0] предоставит вам имя первого столбца. Data.DATA [0] предоставит вам первую строку запрос.

хороший фокус в том, чтобы использовать console.log (данные) в хромированной или Firebug консоли, чтобы просмотреть данные в это структурированной форме.

Я не проверял, но это должно быть близко. Просто создавая базовую таблицу из данных.

$.ajax({ 
    url: 'Remote/Person.cfc?method=Read&ReturnFormat=json', 
    dataType: 'json', 
    success: function(response) { 
     var str = '<table><tr>'; 
     var i; 
     var j; 

     //loop over each column name for headers 
     for (i = 0; i < response.COLUMNS.length; i++) { 
       str += '<th>' + response.COLUMNS[i] + '</th>'; 
      } 
     } 
     str += '</tr>'; 

     //loop over each row 
     for (i = 0; i < response.DATA.length; i++) { 
      str += '<tr>'; 
      //loop over each column 
      for (j = 0; j < response.DATA[i].length; j++) { 
       str += '<td>' + response.DATA[i][j] + '</td>'; 
      } 
      str += '</tr>'; 
     } 
     str += '</table>'; 

     $('body').html(str); 
    }, 
    error: function(ErrorMsg) { 
     console.log('Error'); 
    } 
}); 
+1

Спасибо, что помогли мне понять, что данные были в шапках, пропустили это. Однако ваш ответ также страдает от одной и той же проблемы. 'var data = response.data;' должно быть 'var data = response.DATA;' также зацикливаются ваши циклы for. Первым должен быть 'response.COLUMNS.length' и' response.COLUMNS [i] ', а ваш второй и третий должны быть' data.length' и 'data [i] .length',' data [i] [j] 'соответственно. – anomareh

+0

К сожалению. Я думал, что параметр был данными и забыл о переназначении. Итак, я просто изменил «данные» на «ответ» и удалил «data = response.data». – Lee

4

Я не очень хорошо знаком с ColdFusion, но вы пытались настроить тип данных на JSON?

$.ajax({ 
    url: 'Remote/Person.cfc?method=Read&ReturnFormat=json', 
    dataType: 'json', 
    success: function(response) { 
     var data = response.DATA; 
     var str = '<ul>'; 

     for (var I = 0; I < data.length; I++) { 
      str += '<li>' + I + data[I][1] + '</li>'; 
     } 

     str += '</ul>'; 

     $('body').html(str); 
    }, 
    error: function(ErrorMsg) { 
     console.log('Error'); 
    } 
}); 

Это должно работать, если данные вы получаете обратно напоминает что-то вроде:

[["PersonID1", "FirstName1", "LastName1"],["PeronID2", "FirstName2", "LastName2"]] .. etc 

Если выше не работает, если вы могли бы показать исходные данные в формате JSON, возвращаемых ваш запрос I должен быть в состоянии легко исправить это.

Кроме того, не уверен, что он был в вашем коде, но вы пропустили точку с запятой в конце строки в цикле for.

+0

Спасибо, что нашли уловив полуточку. Данные, которые я возвращаю, это: {"COLUMNS": ["PERSONID", "FIRSTNAME", "LASTNAME"], "DATA": [[1001, "Scott", "Wimmer"], [1002, "Phillip "," Senn "], [1003," Paul "," Nielsen "]]} Кроме того, я не знаю, почему, но условие ошибки теперь выполняется, а не условие успеха. –

+0

@cf_PhillipSenn Попробуйте мое редактирование. Если он все еще выполняет условие ошибки 'console.log (ErrorMsg)' вместо строки и дайте мне знать, что такое ошибка. – anomareh

4

Самый простой способ - визуально увидеть, как структурированы возвращаемые данные JSON. Тогда это не должно быть слишком сложно для поперечного перемещения объекта JS. Вы пробовали визуализацию JSON? http://chris.photobooks.com/json/default.htm

Если все, что вам нужно, это PersonID, вы можете вернуть массив или список PersonID из CF.

Или, факультативно, вы можете попросить CF вернуть обычный текст со всеми генерируемыми <li>. Сообщение, переданное через ajax, будет больше, но у вас будет меньше кода JS для поддержки. CFML легче поддерживать, не так ли? :)

2

Варианты:

В вашем случае я бы поставил

<cffunction name="keywordAutoComplete" access="remote" 
      returntype="struct" returnformat="JSON" > 

НО

это делает то же самое, как returntype="string" returnformat="plain" + <cfreturn serializeJSON(query) > и это проблема формы JQuery точки зрения потому что вы получаете уродливый JSON, даже если вы используете serializeJSON srerialization по столбцам.

  1. Вы можете сделать JSON строку вручную через cfloop и конкатенации:/
  2. Использование cfjson.cfc, который переопределяет serializeJSON
  3. Перейти на сайт Ben Надель и принять его метод toJSON и изменить его каким-то образом, чтобы соответствовать вашим потребностям

Другое дело - serializeJSON, возвращает клавиши с верхним регистром, поэтому обратите внимание, используйте lcase() или напишите .LIKETHIS в js.

PS: Попробуйте это для динамического creaiton из HTML в JQuery:

var someLiElement = $('<li />').addClass('custom_class') 
       .text('Foo bar') 
       .attr('id', 'custom_id' + someInteger) 

затем добавить метод родительского элемента

+0

@anomareh "[['PersonID1', 'FirstName1', 'LastName1'], ['PeronID2', 'FirstName2', 'LastName2']] .." не является JSON, это строка с хорошими скобками;) –

+0

I есть вещь против двойных кавычек: p – anomareh

Смежные вопросы