user3711600
user3711600

Reputation: 873

Stop jquery function from automatically being called

I'm sure this is very simple, but I can't seem to find the answer.

I have a RoR app, and in my application.js file I want to call a function from within a function.

application.js:

jQuery(function_1($) {

     $("#select_box").change(function() {  ....
     ....
     function_2 ();
return false;
});

jQuery(function_2 () {
   ...
return false;
);

function 1 is triggered when a select box is changed and works correctly. The issue is that function 2 is executed as soon as a new page is loaded. I only want function 2 to be called from within function 1.

How can I do that?

Upvotes: 1

Views: 1403

Answers (4)

Mandeep
Mandeep

Reputation: 9173

Your question says:

function 1 is triggered when a select box is changed and works correctly. The issue is that function 2 is executed as soon as a new page is loaded. I only want function 2 to be called from within function 1.

$(document).on("change","#select_box",function(e) {
  // used on function to incorporate for turbolinks  
  // your code
  // to trigger your function1 when select box is changed
  function1 (); 
  e.preventDefault();
});

function function1(){
  //your code
  // to trigger your function2 inside function1
  function2();
}

function function2(){
  //your code 
}

Upvotes: 0

Shelby L Morris
Shelby L Morris

Reputation: 726

The problem is that when you put code inside of a block like this:

jQuery(function() {
    $("#select_box").change(function() {
        function_2();
        return false;
    });
});

The code is automatically executed. This is equivalent to

$(function() {
});

or

$(document).ready(function() {
});

Which should give you an idea of why function_2 is being invoked on page load. To remedy this, just define the function like this:

jQuery(function() {
    var function_2 = function() {
        return false;
    };

    $("#select_box").change(function() {
        function_2();
        return false;
    });
});

See jQuery docs: http://learn.jquery.com/using-jquery-core/document-ready/

Upvotes: 1

Seth Phillips
Seth Phillips

Reputation: 87

 $("#select_box").change(function() {  
     ....
     function_2 ();
     return false;
 });


function function_2 () {
   ...
   return false;
}

Upvotes: 0

sockmonk
sockmonk

Reputation: 4255

If you're using the asset pipeline, you shouldn't have javascript functions in application.js at all, it should just be a manifest. So, assuming you've disabled the asset pipeline, I think you just need to change how you define function_2. Try this:

var function_2 = function () {
    ...
    return false;
};

Upvotes: 0

Related Questions