locked
How to call javascript function from the html page ? RRS feed

  • Question

  • why I can't use onclick="somefunction()" its returns me an undefined error ?

    The function is on the js file and in the header of the html I have the <script src="thejsfile.js"></script>



    Friday, June 7, 2013 3:21 PM

Answers

  • Hi,

    To do what you want to do the function must be declared outside the data.js scope.

    The data.js probably has something like:

    (function () {
        "use strict";
    
    //lots of code and things
    
    })();

    You need to declare the function outside, like:

    (function () {
        "use strict";
    
    //lots of code and things
    
    })();
    
    function somefunction(){
    //function code
    }

    This is a global function.

    That is why, it's always better to declare handlers via Javascript using the addEventListener call, instead of using the HTML attribute "onclick".

    • Marked as answer by Daniel Iliya Friday, June 7, 2013 5:03 PM
    • Unmarked as answer by Daniel Iliya Saturday, June 8, 2013 9:40 AM
    • Marked as answer by Daniel Iliya Saturday, June 8, 2013 9:40 AM
    Friday, June 7, 2013 4:56 PM

All replies

  • Whatever you assign to onclick has to be a function. By having the () there you're assigning the result of the function. Try just using onclick="somefunction".
    Friday, June 7, 2013 4:09 PM
  • Thank you for your respond but it's not working, seems like the html page don't know about the existence of the functions on the data.js because the auto fill option of the visual studio don't show the function name either. 
    Friday, June 7, 2013 4:31 PM
  • Hi,

    To do what you want to do the function must be declared outside the data.js scope.

    The data.js probably has something like:

    (function () {
        "use strict";
    
    //lots of code and things
    
    })();

    You need to declare the function outside, like:

    (function () {
        "use strict";
    
    //lots of code and things
    
    })();
    
    function somefunction(){
    //function code
    }

    This is a global function.

    That is why, it's always better to declare handlers via Javascript using the addEventListener call, instead of using the HTML attribute "onclick".

    • Marked as answer by Daniel Iliya Friday, June 7, 2013 5:03 PM
    • Unmarked as answer by Daniel Iliya Saturday, June 8, 2013 9:40 AM
    • Marked as answer by Daniel Iliya Saturday, June 8, 2013 9:40 AM
    Friday, June 7, 2013 4:56 PM
  • Thanks that's working , could you give me an example of addEventListener for the onclick ?

    Friday, June 7, 2013 5:05 PM
  • Sure, for this you need to have the control available, either by its ID or by some other reference.

    var item = document.querySelector("#id_of_element");
    item.addEventListener("click",function(){
    //your function code
    });
    //or if the function exists previously
    item.addEventListener("click",yourfunctioname);
    

    If your function is defined somewhere else (for example, in another JS file) you could use Namespaces(see link for details) to define it and use it.

    //in some other file
    WinJS.Namespace.define("My_Namespace", {
    MyFunction:function(){
    //my code
    }
    });
    
    //on default.js or any other file in the project (given that you included the file with the code
    item.addEventListener("click",My_Namespace.MyFunction);

    Using Namespaces enables you to use the function on ListView binding scenarios too.

    It depends a bit on your scenario, but these general guidelines will be useful.

    Also, the book Kraig wrote (the link is on his signature in his answer above) is GREAT and a must-read, be sure to get it ,it's free.

    Friday, June 7, 2013 5:13 PM
  • Actually I neglected the link. Here it is then: Programming Windows 8 Apps with HTML, CSS, and JavaScript. You can also find it on Amazon in the Kindle Store (still free there too).
    Friday, June 7, 2013 6:03 PM
  • Thank you very much ! That's grate example and nice source for Namespaces, thank's 

    and I will sure read the book, I have to much free time anyway.

    Saturday, June 8, 2013 9:40 AM