Home/ Questions/Q 8826207
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T07:04:52+00:00

I’m having a bit of trouble getting a basic knockout.js script to run and

  • 0

I’m having a bit of trouble getting a basic knockout.js script to run and I’m not sure whether it’s the files not loading correctly, or if it’s another issue.

Essentially I’m just trying to get a snippet of a tutorial to work on localhost. I’m using PHP which calls the function “names”. All it should do is display the names listed in the javascript file. The tutorial can be found here

//on name_test.php
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://github.com/downloads/SteveSanderson/knockout/knockout-2.0.0.js"></script>
<script src="name_test.js"></script>  //name_test.js is in the folder with all of my other files
</head>

//bunch of irrelevant code omitted

<?
function names(){
    ?>
    <p>First name: <strong data-bind="text: firstName"></strong></p>
    <p>Last name: <strong data-bind="text: lastName"></strong></p>
    <?
}
?>

Here’s the javascript file

// name_test.js
function AppViewModel() {
  this.firstName = "first name here";
  this.lastName = "last name here";
}

ko.applyBindings(new AppViewModel());

Right now when the page loads all I see is

First name:
Last name:

Is there something I’m missing here? The javascript file is in the directory with all of my other files. I’ve also tried the entire path (in xampp) and it still displays nothing.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Interesting, for me it works just fine:

    HTML-File:

    • Set Script-Tags to bottom
    • Removed the PHP-Code

    so we have:

    <p>First name: <strong data-bind="text: firstName"></strong></p>
<p>Last name: <strong data-bind="text: lastName"></strong></p>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://github.com/downloads/SteveSanderson/knockout/knockout-2.0.0.js">   </script>
<script src="name_test.js"></script>

    JS-File (unchanged):

    function AppViewModel() {
  this.firstName = "first name here";
  this.lastName = "last name here";
}

ko.applyBindings(new AppViewModel());

    It also works when I use the PHP-Version (of course I call the names() function after declarating it, I assume you forgot that in your example above?)

    <?php
function names(){
    ?>
    <p>First name: <strong data-bind="text: firstName"></strong></p>
    <p>Last name: <strong data-bind="text: lastName"></strong></p>
    <?php
}
names();
?>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://github.com/downloads/SteveSanderson/knockout/knockout-2.0.0.js"></script>
<script src="name_test.js"></script>

    I’m sorry I can’t help you any further, but it works for me. And I am not using any libraries, just your script-tags.

    • 0