2012-05-18 2 views
-1

Мой вызов ajax успешно возвращает данные из базы данных, но я не могу понять, как разбирать json и отображать его правильно. Вот мой Аякса вызов:отображение json-ответа от jquery ajax call

$('#cardText').change(function(){ 
      if($('#cardText').val().trim().length == 9) 
       { 
        $.ajax({ 

         url: 'components/Person.cfc', 

         //GET method is used 
         type: "POST", 

         //pass the data   
         data: { 
          method: "getGroup", 
          uid: $('#cardText').val(), 
          }, 
         datType: "json", 

         success: function(response) { 

          var resp = $.trim(response); 
          $('#form_result').html(resp); 
         }, 

         error: function(jqXHR, exception) { 
          if (jqXHR.status === 0) { 
           alert('Not connect.\n Verify Network.'); 
          } else if (jqXHR.status == 404) { 
           alert('Requested page not found. [404]'); 
          } else if (jqXHR.status == 500) { 
           alert('Internal Server Error [500].'); 
          } else if (exception === 'parsererror') { 
           alert('Requested JSON parse failed.'); 
          } else if (exception === 'timeout') { 
           alert('Time out error.'); 
          } else if (exception === 'abort') { 
           alert('Ajax request aborted.'); 
          } else { 
           alert('Uncaught Error.\n' + jqXHR.responseText); 
          } 
         } 
       }); 
      } 
     }); 

И возвращает следующее (Div ID = «form_result»), но я не могу понять, что теперь делать с данными, чтобы правильно отобразить его:

{"COLUMNS":["PLAN","NAME","ID","ISSUE","TYPE","LASTUSED","BALANCE"],"DATA":[["DINING STAFF CAFE 1919 ","YOUNG, MARIA ",8.03976343E8,"2001-04-02",2.0,"2012-01-27",1]]} 

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

+1

Вы хотите создать таблицу из этого? Что вам нужно с данными? –

+0

У вас есть typeo: 'datType' должен быть' dataType' –

+0

@MestekWebmaster 'dataType' по умолчанию для JSON, это не проблема –

ответ

0

Поскольку вы получаете JSON на стороне клиента, вы можете подать его в какой-то JS-плагин, который понимает эти данные или отображает их самостоятельно с помощью механизма шаблонов.

Приятный механизм шаблонов - это то, что вам нужно.

чек из http://api.jquery.com/category/plugins/templates/, http://handlebarsjs.com/ или https://github.com/leonidas/transparency

+0

Мое голосование за шаблоны JS - это шаблоны закрытия Google. https://developers.google.com/closure/templates/docs/helloworld_js –

+0

@JuanMendes, почему ваш голос переходит к шаблонам закрытия Google? – Henry

+0

Из-за того, насколько это просто. Мне не нравятся шаблоны на стороне клиента, которые определяют шаблоны в файле HTML и анализируют шаблоны на клиенте. Это затрудняет повторное использование их между страницами. Шаблоны закрытия Google запускают шаг сборки в вашем файле шаблона и генерируют функцию JS, которую вы можете вызывать из своего скрипта для генерации HTML и его повторного использования на разных страницах. –

0

вы можете сделать это путем анализа данных JSON таким образом

var ReturnedData = jQuery.parseJSON(response); 

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

var Col1 = ReturnedData.COLUMNS[0]; // will provide you first COLUMN value i.e. "PLAN" 
var Data1= ReturnedData.DATA[0]; // will provide you first DATA value i.e. "DINING STAFF  CAFE 1919" 

над двумя строками просто пример того, как вы можете захватить ваши данные

+0

Это похоже на то, что я хочу, но после того, как я исправил свою опечатку в dataType, теперь я получаю parseerror - правильно ли я делаю json? – user1371409

+0

Для выяснения проблемы выполните следующие действия. 1) наблюдайте за возвращаемым json-форматом, ошибка синтаксического анализа чаще всего возникает из-за неправильного JSON. 2) попробуйте JSON.parse (response), который является нативной функцией jquery.parseJSON 3) применяет try catch и observer ошибку – Tanveer

0

Кажется, вам просто нужно что-то сделать с данными JSON, возвращаемыми с сервера. Если вы хотите проанализировать его в более разумном формате, например, хэш, см. Мою скрипку здесь: http://jsfiddle.net/skamansam/T7WbK/25/. Если вы просто хотите, чтобы сообщить пользователю данные, которые он/она представила были правильными, измените строку:

$('#form_result').html(resp);

в

$('#form_result').html("Form submitted successfully!");

Идеальное здесь является то, что вы меняете сервер реагирует на что-то, что имеет смысл, например, html-ответ вместо json. Это скорее вопрос предпочтения, чем технический или протокол.

0

Кажется есть лишняя запятая в «данных» Попробуйте удалить запятую после uid: $('#cardText').val()