-1

I have couple functions that I would like to separate from the main jquery file. However if I just put them in different file I will receive error when I will try to call it. - TypeError: $ is not a function Well it a simple error that solved by put in all function in

jQuery(document).ready(function($) { }); Well but then as soon main jquery file will try to call the function it will gave the error that function is not defined. So I find out that function defined within one $(document).ready block cannot be called from another $(document).ready block, therefore my question is how to call function from different file.

The problem with functions is that I can't use it without jQuery(document).ready block, but as soon I put ready block function is not visible for main jquery file . Here is the test -

https://stackoverflow.com/a/1327766/4849611

so for many comment here is my links

<script type="text/javascript" src="js/jquery.js"> </script>

<script type="text/javascript" src="js/function.js"></script> <!--file with functions-->
<script type="text/javascript" src="js/main.js"> </script> <!-- file which try to call functions--->
<script type="text/javascript" src="js/jquery-ui.js"></script>
<script type="text/javascript" src="js/jquery.webcam.js"> </script>

I will specified the problem, since people don't understand... simple function - as example in function.js file

function dialog(){

$("#message").dialog({
    modal: true,
    buttons: {
        Ok: function() {
            $( this ).dialog( "close" );
                }
        }
}); 

}

Main file -main.js

jQuery(document).ready(function($) {

$(document).on("click", "#take_one", function(e){ 
e.preventDefault;
dialog();
return false;   
});

});
Community
  • 1
  • 1
ZeroVash
  • 546
  • 4
  • 20
  • Possible duplicate of [Calling a javascript function in another js file](http://stackoverflow.com/questions/25962958/calling-a-javascript-function-in-another-js-file) – Adam Konieska Mar 02 '16 at 15:17
  • Why do you want to split a function into its own file? you probably shouldnt be doing that. – Marie Mar 02 '16 at 15:18
  • well because some function is used in couples files at the same time, so instead of making delicate I can put them in separate file. – ZeroVash Mar 02 '16 at 15:20
  • This could turn out into a long discussion/tutorial, you should read up on @AdamKonieska reference. Other things to get familiar with are the order of inclusion of scripts, global scope and closures. – Aukhan Mar 02 '16 at 15:30
  • @Aukhan The problem in Adam topic is different, my problem is that called function require .ready statement. – ZeroVash Mar 02 '16 at 15:34
  • @alex_mike the problem isn't any different. You'd have one file with the `$(document).ready()`, and within that, you can call the other functions located in other files. Providing a detailed answer, *without seeing your code/functions*, is difficult because your problem is too broad to be answered concisely. This is really something that you should look to a tutorial for more information. – Adam Konieska Mar 02 '16 at 15:38
  • @AdamKonieska I provide some example of code, check please. Also my problem is shortly described here http://stackoverflow.com/a/1327766/4849611 in the end. PLease check. – ZeroVash Mar 02 '16 at 15:42
  • My problem that my function in second file require the $(document).ready() too. otherwise it will give me error TypeError: $ is not a function – ZeroVash Mar 02 '16 at 15:44
  • First thing you need to do is make sure both your files are loaded after jQuery is included in the page. That should resolve your jQuery dependency in the simplest way. – Aukhan Mar 02 '16 at 15:51
  • as you can see above the jQuery is included first and the go function and the main file – ZeroVash Mar 02 '16 at 15:52
  • yet your function.js file complains that `$ is not defined` ? – Aukhan Mar 02 '16 at 15:54
  • @Aukhan yes, that is my problem – ZeroVash Mar 02 '16 at 15:59
  • @alex_mike are you sure you've included jQuery and jQuery UI properly? Is the pathing correct and are the files accessible? When I test the files as you have them set up, I don't get any errors. – Adam Konieska Mar 02 '16 at 16:01
  • 1
    try replacing all `$` instances in your function.js file with `jQuery`. If that works then something is redefining `$` in your program that you haven't shown. Also share the version of jQuery you're using. – Aukhan Mar 02 '16 at 16:03
  • well version is 2.1.3 , jQuery UI - is not a problem I put just simple function $().show; and the same problem, jQuery included properly for sure . well if I put $(document).ready() block in file with function the error is disappear but then function is not defined. – ZeroVash Mar 02 '16 at 16:09
  • @Aukhan jQuery instead $ is fix my problem. But I just don't understand why it happen – ZeroVash Mar 02 '16 at 16:13

1 Answers1

-1

Include the other file in a script tag on the page.

<script src="path/to/your/script.js"></script>

brettkc
  • 252
  • 1
  • 9
  • @JoeAttardi well what exactly I didn't explain? The problem in using .ready statment – ZeroVash Mar 02 '16 at 15:30
  • You tell me to read the question more carefully after you edit it to include relevant details that you omitted at the start? Ok – brettkc Mar 02 '16 at 17:51