How to populate template with AJAX data, need some help

I got te top late to be loaded with router, and can load data with AJAX request
but I can’t push them back inside the template
and i don’t know I to pass a variable to the template I’m going to load

I need to specify the ID to my endpoint to load the data i need

this is what I got to work so far

<!-- component template -->
  <div class="page">
<div class="navbar">
  <div class="navbar-inner">
    <div class="title">{{title}}</div>
<div class="page-content">
  <div class="list simple-list">
      {{#each names}}
  <div class="block block-strong">
     <a href="#" class="link back">
	        <i class="icon icon-back"></i>
			<span class="ios-only">Back</span>

  /* */
  // script must return component object
  return {
data: function () {
  return {
    title: 'Component Page',
    names: [],
	on: {
  pageInit() {
    var self = this;
    var app = self.$app;
		app.request.get('../json/test-d-01.json?id=xxx', function (data) {
	       var d = JSON.parse(data);
		   return {
	        title: d.ptitle,
	        names: d.pnames,
	            names: jsondata.names,

I see you commented self.$setState, why? This is the way to put it in data and update template

1 Like

you need to refresh the page with this when the AJAX finish to reload the template:


its will refresh the page and renew the scroll to top 0, to fix this you need to save the current position of page-content DIV:

$(’#pageContent’).scroll(function() {
if (app.boolChange == undefined) {
app.scrollTop = $(’#pageContent’).prop(‘scrollTop’)

if (app.boolChange != undefined) {
delete app.boolChange

and when the page reload finish, set the position saved:

if (app.scrollTop != undefined) {
$(’#pageContent’).animate({ scrollTop: app.scrollTop }, 0, function () { })

because not sure why but

app.request.get('../json/test-d-01.json?id=zzz', function (data) {
		var d = JSON.parse(data);
			names: ["aa","bb","cc"],
			names: d.names,

if I hardcode the array ( first comment ) seems to work
if I pass JSON it doesn’t work

console log output this

(3) [“John”, “Vladimir”, “Timo”]
0: “John”
1: “Vladimir”
2: “Timo”
length: 3

so it seems to be right

TST JSON is like this

{“ptitle”:“D Page”,“pnames”:[“John”,“Vladimir”,“Timo”]}

to use jQuery, that i more comfortable with, to build the page is a bad idea?