Ajax requests

[PierrickLozach]

First, thanks for this repo. It's really helpful!

I need to retrieve some data using $.ajax and populate a table. So, I created a new .hbs file and added the following code, based on your datatables example:

logs.hbs

---
title: Logs
icon: fa fa-file-archive-o
scripts: $(function() { Metis.getLogs(); });

---

<!--Begin Datatables-->
<div class="row">
  <div class="col-lg-12">
        <div class="box">
            <header>
                <div class="icons"><i class="fa fa-file-archive-o"></i></div>
                <h5>Current logs</h5>
            </header>
            <div id="collapse4" class="body">
                <table id="logTable" class="table table-bordered table-condensed table-hover table-striped">
                    {{> logTable}}
                </table>
            </div>
        </div>
    </div>
</div>
<!-- /.row -->
<!--End Datatables-->

I created a new logTable.hbs file that contains the row and columns:

<thead>
<tr>
    <th>Created At</th>
    <th>Action Id</th>
    <th>Text</th>
    <th>Project Id</th>
    <th>Scenario Id</th>
    <th>Id</th>
</tr>
</thead>
<tbody>
{{#if logTable}}
    {{#each logTable}}
        <tr>
            <td>{{created_at}}</td>
            <td>{{action_id}}</td>
            <td>{{text}}</td>
            <td>{{project_id}}</td>
            <td>{{scenario_id}}</td>
            <td>{{_id}}</td>
        </tr>
    {{/each}}
{{/if}}
</tbody>

Finally, I added a new logs.js in the assets/js/app folder that contains my ajax code:

;(function($){
  "use strict";

  Metis.getLogs = function() {
    $.ajax({
      type: 'GET',
      url: 'http://localhost:8080/api/v1/projects/5678/scenarios/9012/log',
      dataType: 'json',
      success: function(data) {
        console.log('got data')
        var logTable = data.logentries;
      },
      error: function(error) {
        console.log(error);
      }
    });
  };

  return Metis;
})(jQuery);

I can see my js is called

How can I bind the result of my query to {{logTable}}? Should I create a template, create a helper for that?

I would welcome any help/tips on how to proceed.

Thanks.

[onokumus]

@PierrickI3 metis uses handlebars files only while creating static html files.

For details : https://github.com/assemble/assemble

[PierrickLozach]

Thanks @onokumus , I just figured out that I can use jquery-datatables for this and it works.

[PierrickLozach]

So, just to make sure I understand: Are you saying that assemble and handlebars are used to generate the static html files in /dist and then if I want to add functionalities (like ajax requests), I should use these generated files only?

[onokumus]

@PierrickI3 Yes. Assemble is used to generate the static html files. But http://handlebarsjs.com/ are not only used for this. You can see the details from http://handlebarsjs.com/ For more professional works, use http://emberjs.com/