bbkrz
bbkrz

Reputation: 433

How to call node js function from node js client side

I am playing around with an html template and I have noticed that the developer doesn't use RequireJS or anything else to require and call different functions from other node files. Instead, they used this in the html file to initialise and call the function:

<script src="../../assets.js/test.js"></script>

<script type="text/javascript">
        $(document).ready(function(){
            test.initSomeFunction();
        });
    </script>

And I've got the below code in assets/js/test.js which defines initSomeFunction in javascript:

test = {
  initSomeFunction: function() {
     //Some code
  }

  initAnotherFunction: function() {
     //More code
  }
}

(It would be helpful if someone can tell me what this method is called so that I can research it more.)

My problem arises when I try to do the same thing in my node app in the home directory /main.js. The node app works fine on its own but when I add something like this:

test2 = {
  initMyFunction: function() {
    console.log("I finally decided to work! Good luck...");
  }
}

and modify my html file like this:

<script src="../../main.js"></script>

<script type="text/javascript">
        $(document).ready(function(){
            test.initSomeFunction();
            test2.initMyFunction();

        });
    </script>

then it won't work. Can someone please point me to the right direction as I don't even know what to Google. I am trying to avoid using RequireJS or anything else as I am a total beginner and the method that the developer used sounds so simple and tempting.

Upvotes: 0

Views: 4663

Answers (1)

MWY
MWY

Reputation: 1181

I wish this answer will help you:

I am using express, so I do this to solved your problem!

main.js file's position:

enter image description here

modify app.js add:

      app.use(express.static(path.join(__dirname, '/')));

Then, in the view file:

         <html>
         <head>
         <script src="public/javascripts/jquery-1.10.2.min.js">       </script>
         <script src="main.js"></script>
         </head>
         <body>


         <script>
          $(function () {
          //test.initSomeFunction();
           test2.initMyFunction();

          })
         </script>
         </body>
         </html>

Open the chrome Developer Tools. You will see the result.

enter image description here

Upvotes: 3

Related Questions