Appel de variable php depuis fichier js

Hello tout le monde,

Je suis tombé sur un Admin kit plutôt sympa que j'aimerais retravailler, et notamment la page Invoice (que j'aimerais utiliser pour une list d'user)

seuleument je commenc tranquillement le js et là je sèche de ouf !!

http://altair_html.tzdthemes.com/page_invoices.html

J'ai chargé ma liste d'user sur la partie droite (sous forme de <li>) mais impossible d'aller chercher le bon bloc principal... voici comment le tout fonctionne :

page invoice.php

chargement des users

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
<li class="heading_list">Mes users chéris</li>
<?php	
$UsersMini = $bdd->query('SELECT * FROM users WHERE 1 ORDER BY idUser DESC');
while($UM=$UsersMini->fetchObject())
{?>
<li>
<a href="#" class="md-list-content" data-invoice-id="<?php echo $UM->idUser;?>">
<span class="md-list-heading uk-text-truncate"><?php echo $UM->loginUser;?></span>
</a>
</li>
<?php
};
?>

Gabarit du bloc principal (j'ai conserver les noms d'origine, mais le contenu sera remplacé):

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<script id="invoice_template" type="text/x-handlebars-template">
        <div class="md-card-toolbar">
            <div class="md-card-toolbar-actions hidden-print">
                <i class="md-icon material-icons" id="invoice_print">&#xE8ad;</i>
                <div class="md-card-dropdown" data-uk-dropdown="{pos:'bottom-right'}">
                    <i class="md-icon material-icons">&#xE5D4;</i>
                    <div class="uk-dropdown uk-dropdown-small">
                        <ul class="uk-nav">
                            <li><a href="#">Archiver</a></li>
                            <li><a href="#" class="uk-text-danger">Supprimer</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <h3 class="md-card-toolbar-heading-text large" id="invoice_name">
                Identifiant {{invoice_id.invoice_number}}
            </h3>
        </div>
        <div class="md-card-content">
            <div class="uk-margin-medium-bottom">
                <span class="uk-text-muted uk-text-small uk-text-italic">Date de dernière connexion :</span> {{invoice_id.invoice_date}}
            </div>
            <div class="uk-grid uk-margin-large-bottom">
                <div class="uk-width-1-1">
                    <table class="uk-table">
                        <thead>
                        <tr class="uk-text-upper">
                            <th> titre du sujet</th>
                            <th>nombre de réponse</th>
                            <th class="uk-text-center">nombre de vues</th>
                        </tr>
                        </thead>
                        <tbody>
                        {{#each invoice_id.invoice_services}}
                            <tr class="uk-table-middle">
                                <td>
                                    <span class="uk-text-large">{{ service_name }}</span><br/>
                                </td>
                                <td>
                                    {{ service_rate }}
                                </td>
                                <td class="uk-text-center">
                                    {{ service_hours }}
                                </td>
 
                            </tr>
                        {{/each}}
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </script>

et voici là où je pêche, car le gabarit "template" charge tout le temps les mêmes infos, impossible de modifier le contenu, j'ai tenter des boucle à la en veux tu en voilà mais rien.

De peur de vous donner un code complètement pété, je vous donne celui de base, pourriez vous m'indiquer par où attaquer pour rendre le tout modifiable par boucle php

page invoice.js (partie qui nous intéresse,) il manque des champs, mais je les rajouterais plus tard, je souhaite juste piger le truc

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
 open_invoice: function() {
 
        var show_invoice = function(element) {
            var $this = element,
                $invoice_template = $('#invoice_template');
 
            var template = $invoice_template.html(),
                template_compiled = Handlebars.compile(template);
 
            var invoice_id = parseInt($this.attr('data-invoice-id')),
                context = {
                    invoice_id: {
                        invoice_number:         Math.floor((Math.random() * 200) + 1) + '/2016',
                        invoice_date:           moment().format('DD.MM.YYYY'),
 
 
invoice_services: [
{
service_name:           "nom du sujet crée par le user",
service_description:    "sous titre du sujet créé par le user",
},
],
 
                },
                theCompiledHtml = template_compiled(context);
 
            $invoice_preview.html(theCompiledHtml);
            $invoice_form.html('');
 
            $window.resize();
 
        };
 
        $(invoice_list_class)
            .on('click','a', function(e) {
                e.preventDefault();
                e.stopPropagation();
                altair_md.card_show_hide($invoice_card,undefined,show_invoice,$(this));
                $(this).closest('li').siblings('li').removeClass('md-list-item-active').end().addClass('md-list-item-active');
                setTimeout(function() {
                    // reinitialize uikit margin
                    altair_uikit.reinitialize_grid_margin();
                },560); //2 x animation duration
            });
 
            if($(invoice_list_class).find('a').length) {
                // open first invoice
                $(invoice_list_class).find('a').eq(0).click();
            } else {
                // open form
                $invoice_add_btn.trigger('click');
            }
 
    },

Merci à tous pour votre aide les potos !