Pass Parameter to Custom jQuery Function

Question

Here's what I have so far:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>

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

 <script type="text/javascript"> 

$(document).ready(function() { 
    $("#weight").change(onSelectChange);
}); 

function onSelectChange(){
        var selected = $('#weight').val();
        $.post("tship.php", {weight: selected},
            function(data){
                $("#ship").html(data.ret_html);
                }, "json");
} 

 </script>   


</head>
<body>

<select id="weight">
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
</select>

<br />

<div id="ship">
</div>

</body>
</html>

I want to change it so that onSelectChange accepts a single parameter. I need to be able to call the function for other events as well - not only when the select box value changes. Here is my attempt, not working:

<script type="text/javascript"> 

$(document).ready(function() { 
    $("#weight").change(onSelectChange($('#weight').val()));
}); 

function onSelectChange(parm){

        $.post("tship.php", {weight: parm},
            function(data){
                $("#ship").html(data.ret_password);
                }, "json");
} 

</script>

Thanks for the answers so far - but I really need to have the function accept a parameter so that I can call it for other events as well — Joe Riggs
– Joe Riggs, Commented Sep 15, 2010 at 15:45

Mike Robinson · Accepted Answer · 2010-09-15 15:41:08Z

3

Try this:

$("#weight").change(function(){
 onSelectChange($(this).val());
});

answered Sep 15, 2010 at 15:41

Mike Robinson

25.2k8 gold badges63 silver badges83 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Kobi · Accepted Answer · 2010-09-15 15:45:50Z

2

You should add another function:

$("#weight").change(function(){
      onSelectChange($('#weight').val());
}); //close the anonymous function

Note that in your original code you've passed onSelectChange as a reference, you didn't start it - onSelectChange(). With the code as it is, you start the function once instead of binding it.

edited Sep 15, 2010 at 15:45

answered Sep 15, 2010 at 15:40

Kobi

139k41 gold badges259 silver badges302 bronze badges

1 Comment

Joe Riggs Over a year ago

ty! Very similar to Mike Robinson's answer. I marked yours because of the explantion, thanks again!

David Thomas · Accepted Answer · 2010-09-15 15:41:15Z

1

You were calling a function within another function, so I think that if you amend your code to the following it should work okay (assuming your onSelectChange() function works properly:

$(document).ready(function() { 
    $("#weight").change(
        function() {
            $(this).onSelectChange($('#weight').val()));
        }
    );
});

answered Sep 15, 2010 at 15:41

David Thomas

254k53 gold badges382 silver badges421 bronze badges

Comments

brad · Accepted Answer · 2010-09-15 15:41:19Z

1

You can't do that, the onSelectChange gets called by jQuery's change function so it chooses what params to pass.

In your case however, this is simple, jQuery will bind 'this' to the item that you've applied that event handler to, so you can reference that value in your onSelectChange using:

$(this).val();

answered Sep 15, 2010 at 15:41

brad

32.4k29 gold badges106 silver badges159 bronze badges

Collectives™ on Stack Overflow

Pass Parameter to Custom jQuery Function

4 Answers 4

Comments

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related