How can I map a service response to html component?

[adam griffin]

I have a html component that uses a little javascript inside the component. How can I map a service response to the component? This is my html without me trying to map to the component:

<!-- <div id="timeline"< --

<!-- <script type="text/javascript" --
<!-- $(document).ready(function() { --
var timeline_data = [
{
type: 'blog_post',
date: '2011-08-03',
dateFormat: 'DD MMMM YYYY',
title: 'Blog Post',
width: 400,
content: '',
image: 'xxxx.jpg',
readmore: 'http://www.example.com'
}
];

Code: Select all

     var timeline = new Timeline($('#timeline'), timeline_data); 
     timeline.display(); 
 }); 

<!-- </script --

This is the code with me trying to map to it from a success:

var r = data;

var temp = [];
for(var i = 0;i!=r.length;i++){

Code: Select all

 temp.push(  'type:'+        "'blog_post',"+ 
             'date:'+        "2011-08-03,"+ 
             'dateFormat:'+  "'DD MMMM YYYY',"+ 
             'title:'+       "'"+r[i].Username+","+ 
             'width:'+       '200,'+ 
             'content:'+     "'"+r[i].Post+"',"+ 
             'image:'+       "''"); 

}

$(document).ready(function() {
var timeline_data = [];
timeline_data.push(temp);

Code: Select all

     var timeline = new Timeline($('#timeline'), timeline_data); 
     timeline.display(); 
 });

[adam griffin]

I dont know what I am doing wrong

[Evgene Karachevtsev]

Adam,

Please detail, on what component do you want to map your results and what service do you use.

[adam griffin]

.

[adam griffin]

I have a html component named "timeline". It is set on one of my pages. I have a query service that list a Username, Post. I would like to populate the html component with the username and post from my database.

[Kateryna Grynko]

Hi Adam,

It's better to map your service data to a localStorage variable and read it in the code that you use in HTML component. Beforehand, move the code to an event handler or to a JS asset.