2013-11-28 3 views
0

Я не могу получить строку ответа из метода выборки в методе рендеринга просмотра.Анализ синтаксического ответа

The Collection Class Goes here.

Collection = (function(){ 

    var Events; 

    Events = Backbone.Collection.extend({ 


     url:function(){ 
      //alert(urlOptions); 
     return this.urlParam; 
      // alert('API call :'+urlOptions); 
     }, 

     initialize: function(models, options){ 
      this.urlParam = options.urlParam || ""; 
     }, 

     parse: function(response){ 
      var parsed = Jath.parse(
       [ '//notes', { 

       } ], response); 
      console.log(parsed); 
      return parsed; 

     } 
     }); 

    return { 
     newInstance : function(models,options) { return new Events(models,options); } 
    }; 
})(); 


The View Goes Here 

    View = (function() { 
    'use strict'; 

    var 
    htmlTemplate = _.template($('#eventGridTemplate').html()), // See templatesSearch.jsp 
    expanded = true, // By default the Events Grid extends to the bottom of the browser window. 
    BackboneView, applyStyles; 

    /** 
    * Apply CSS specific to this view 
    * Unfortunately, this View needs to modify its parent wrapper element. 
    * Otherwise the layout will break when it's resized. See templatesSearch.jsp. 
    * @param {Object} $elmt 
    * @param {Boolean} expand 
    */ 
    applyStyles = function($elmt, expand) { 

    var 
     top = '2px', 
     left = '2px', 
     pos = 'absolute', 
     right = '2px'; 

    if (expand) { 

     $elmt.css({ 
     "position" : pos, 
     "top"  : top, 
     "left"  : left, 
     "right" : right, 
     "bottom" : "2px" 
     }); 

     $elmt.parent().css('bottom', '2px'); 

    } else { 

     $elmt.css({ 
     "position" : pos, 
     "top"  : top, 
     "left"  : left, 
     "right" : right, 
     "bottom" : "50%" 
     }); 

     $elmt.parent().css('bottom', '50%'); 
    } 
    }; 

    // See 'http://backbonejs.org/#View-constructor' for more info 
    BackboneView = Backbone.View.extend({ 

    onAiringsBtn : function(event) { 

     // If the Events Grid container was expanded, contract it. 
     // If it was contracted, expand it. 
     expanded = expanded ? false : true; 
     applyStyles(this.$('div'), expanded); 
}, 

    initialize : function() { 
    this.render(); 
    }, 

    render : function() { 
     // this.$el is the jQuery version of this.el 
     // Which is populated by options.el 
     // Which is part of the options object passed into the constructor 
     //alert('Start Date:' +$('#datepicker').datepicker('getDate')); 
     var eventsCollection = Collection.newInstance([],{urlParam:'http://localhost:8080/adtglobal/2.0/api/events?startDate=2013-11-05T00:00:00-0400&endDate=2013-11-06T00:00:00-0400'}); 
     //console.log(eventsCollection.url()); 
     eventsCollection.fetch({ 
      success : function(eventsCollection , response){ 
       console.log(eventsCollection.toJSON()); 
       alert(eventsCollection.toJSON()); 
      } 
        }); 
     this.$el.html(htmlTemplate); 
     applyStyles(this.$('div'), true); 
    } 
    }); 

    //------------------------------------------------------------------------------------------------------------------- 
    // Public API 
    //------------------------------------------------------------------------------------------------------------------- 

    return { 
    newInstance : function(options) { return new BackboneView(options); } 
    }; 

})(); 

Получаю ответ как успех, и я вижу xml в консоли браузера, но как его разобрать здесь?

Ответ здесь

<Events xmlns="urn:api:2.0"> 
<PageNavigation showing="45"></PageNavigation> 
<Event id="400515625" href="400515625" source="SDR"> 
<OrgHierarchy> 
<level id="56" typeId="100" title="Soccer" description="Sport" href="../sporthierarchy?levelId=56&levelTypeId=100"></level> 
<level id="2902" typeId="101" title="UEFA" description="Confederation" href="../sporthierarchy?levelId=2902&levelTypeId=101" parentId="56" parentType="100"></level> 
</OrgHierarchy> 
<EventType id="1">Standard Event</EventType> 
<League id="1860">UEFA > Polish Orange Ekstraklasa</League> 
<EventTitleText>Ruch Chorzow vs. Zawisa Bydgoszcz</EventTitleText> 
<CompetitionType id="1">Team vs Team</CompetitionType> 
<EventCompetitors> 
<Teams> 
<HomeTeam id="73960" href="../teams/73960">Ruch Chorzow</HomeTeam> 
<AwayTeam id="107278" href="../teams/107278">Zawisa Bydgoszcz</AwayTeam> 
</Teams> 
</EventCompetitors> 
</Event> 
</Events> 
+0

Какое значение «разбора» выглядит в вашей функции синтаксического анализа? –

+0

Я не могу получить там никакой ценности. Ответ - это xml, который я могу видеть в консоли браузера, но не здесь. :-(Я очень новичок в позвоночнике, возможно, я, возможно, пропустил некоторые базовые вещи :-( – Vinay

+0

вы можете разместить образец ответа на ваш сервер здесь? –

ответ

0

хорошо, кажется, что вы не используете Jath правильно.

необходимо определить шаблон, соответствующий вашему XML.

я раньше не использовал Jath, но я попытаюсь создать простой шаблон для вас:

//in your parse 
var template = [ "//Events", {id: "@id", eventType: 'EventType'}]; 

return Jath.parse(template, response); 

попробовать это первый и посмотреть, если у вас есть что-то в вашей коллекции.

Кажется, у вас есть вложенные ресурсы в вашем ответе, поэтому вам нужно будет заполнить шаблон.

или, если вам не нужно использовать Jath, попробуйте что-то более простое: вот пример jsfiddle, вы должны увидеть синтаксический JSON в консоли. http://jsfiddle.net/5j57T/

EDIT: XML в JSON код из: http://davidwalsh.name/convert-xml-json

ПРИМЕЧАНИЯ: вам нужно разобрать, что JSON снова в массив объектов, которые необходимы для того, чтобы сделать работу приложения!

=====================

EDIT: еще один пример (работает лучше, чем предыдущая скрипка) http://jsfiddle.net/5j57T/1/

использует JQuery библиотека http://www.fyneworks.com/jquery/xml-to-json/

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

parsed = [$.xml2json(xmlDoc.getElementsByTagName('event')[0])] 

или вы можете просто сделать

parsed = $.map(xmlDoc.getElementsByTagName('event'), function(eventXml) { 
    return $.xml2json(eventXml); 
}); 

рабочий jsfidde: http://jsfiddle.net/5j57T/2/

====== ====================

EDIT:

Я думаю, что по умолчанию, позвоночник ожидает ответ JSON от сервера. Вам придется перезаписать его функцию fetch(), чтобы поддерживать XML.так что в вашем определении коллекции, добавьте это:

fetch: function (options) { 
    options = options || {}; 
    options.dataType = "xml"; 
    return Backbone.Collection.prototype.fetch.call(this, options); 
} 

вот работает jsfiddle: http://jsfiddle.net/5j57T/4/

Игнорировать «данные» и опции «типа» я прошел, чтобы принести(), и URL-адрес, все это просто для того, чтобы сделать запрос Ajax на jsfiddle. Вы не должны иметь их в своем приложении.

В этом демонстрационном примере, когда XML возвращается, он правильно разбирается в коллекции. Вы сможете увидеть свою коллекцию в консоли.

======

Если все серверные услуг возвращать только XML. Я бы предложил перезаписать функцию Backbone.sync, чтобы она работала для других методов, таких как save().

+0

Я хочу увидеть сырое ответ в консоли, не беспокоясь о jath, я планирую использовать сам xmltojson, но прежде чем использовать его, я должен иметь ответ в переменной справа, который не получается. – Vinay

+0

см. мой отредактированный ответ для xmltojson. верните массив объектов в вашу функцию синтаксического анализа. –

+0

У меня есть несколько событий в ответе, извините за просто публикацию только одного, мне тоже нужно сделать то же самое для этого? – Vinay

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