I'm trying to learn JSON/JavaScript as I'd like to use it over PHP/SQL.

I was going to do this with TEMPOJS because it seems like that might be the easiest way to start off?

I'm getting hung up, however. I can make everything work if I include the JSON directly in my scripting. However, for the project I am working on, I need to use an external JSON feed and I can't figure out how to make my script pull in the external feed. Here is what I've got to start off:

In the header tags:

    <!-- TEMPO JS LOADIN -->
    <script type="text/javascript" src="tempo/tempo.min.js"></script>

In the content area, where I'm wanting data to appear:

            <ul id="users">
                <li data-template>
                    {{firstName}} {{lastName}}
                </li>
                <li data-template-fallback>Must have JavaScript active.</li>
            </ul>

Right before </body>:

 <!-- TEMPOJS SCRIPT -->
 <script>
        var data = {
            people: [
                { 'firstName': 'Clark', 'lastName': 'Kent' },
                { 'firstName': 'Bruce', 'lastName': 'Wayne' },
                { 'firstName': 'Peter', 'lastName': 'Parker' }
            ]
        }
        Tempo.prepare("users").render(data.people);
    </script>

In the above </body> script, I'm wanting to change the "var data =" portion so that it would pull in data from a JSON script. For testing, I have that script in the same directory as data.json. Eventually, however, it will be hosted on another server.

Just to note, I've looked for tutorials all over. Seems like all I can find are ones that load data after a button press. I can't get those scripts to not need a button action. I just want data to load when the page loads.

Member Avatar for diafol
<script>
    var data = <?php echo $data;?>;
    Tempo.prepare("users").render(data.people);
</script>

Make sure the php variable is json_encoded something like...

$arr = array("people"=>array(array('firstName'=>'Clark', 'lastName'=> 'Kent'),array('firstName'=>'Bruce', 'lastName'=>'Wayne'),array('firstName'=> 'Peter', 'lastName'=>'Parker')));
$data = json_encode($arr);

Can this be done without PHP? And the data is going to be coming from a data.json file, not directly from the page.

Right now, my script is working if I include

var data = {
            people: [
                { 'firstName': 'Clark', 'lastName': 'Kent' },
                { 'firstName': 'Bruce', 'lastName': 'Wayne' },
                { 'firstName': 'Peter', 'lastName': 'Parker' }
            ]
        }

right within the script. However, I want that code to be served out of the data.json file instead (the reason is I will eventually be updating the data.json file with another program and don't want to be changing my page scripts by hand).

Member Avatar for diafol

Yes that's fine, I just thought you wanted it in php. Loads of ways to skin a cat.

You could do something like...

<?php include 'data.json'; ?>;

at the appropriate place in your js

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.