jquery call function by name

Question

i have function

<script type="text/javascript">
    $(function () {
        $("#search").click(function() {
            var text = $("#searchText").val();
            $.getJSON("Search", { world: text, filter: text }, function(data) {
                $("tr.DataRow").toggle(false);
                for (i = 0; i < data.length; i++) {
                    $("#obj" + data[i]).toggle(true);
                }
            });
        })            
    });


</script>

now i have another function

<script type="text/javascript">

    $(function() {
        $('#searchText').bind('keypress', function(e) {
            if (e.keyCode == 13) {

            }
        });
    });
</script>

how can i call first function from second function?

@kusanagi It is considered proper courtesy to mark the correct answers to your questions as "accepted". You have asked 11 questions, so it will be very easy to go back through them and accept all the correct answers. This will encourage people to answer your questions fully and without reservation. — Doug Neiner
– Doug Neiner, Commented Dec 15, 2009 at 1:39

Champo · Accepted Answer · 2009-12-15 01:32:43Z

20

You can raise a click event on the element you registered the first function

<script type="text/javascript">

    $(function() {
        $('#searchText').bind('keypress', function(e) {
            if (e.keyCode == 13) {
                $('#search').click(); // Raise a click event on #search element
            }
        });
    });
</script>

answered Dec 15, 2009 at 1:32

Champo

3,41731 silver badges32 bronze badges

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

1 Comment

Doug Neiner Over a year ago

+1 for the simplest solution to the question asked. Great answer!

harto · Accepted Answer · 2009-12-15 01:49:54Z

20

Extract the logic from the first event handler into a named function:

function doSearch() {
    var text = $("#searchText").val();
    $.getJSON("Search", { world: text, filter: text }, function(data) {
        $("tr.DataRow").toggle(false);
        for (i = 0; i < data.length; i++) {
            $("#obj" + data[i]).toggle(true);
        }
    });
}

You can now pass doSearch by name to the click handler:

    $(function () {
        $("#search").click(doSearch);
    });

and explicitly invoke it from within the key handler:

    $(function () {
        $('#searchText').bind('keypress', function(e) {
            if (e.keyCode == 13) {
                doSearch();
            }
        });
    });

answered Dec 15, 2009 at 1:49

harto

90.6k9 gold badges49 silver badges62 bronze badges

4 Comments

Pointy Over a year ago

... except that you've polluted the global namespace instead of extending the jQuery object.

harto Over a year ago

@Pointy - If you start treating the jQuery object as a de facto global namespace, you'll run into the same problems as making all your variables global. What happens when we write the function each()?

harto Over a year ago

Besides, we aren't writing a plugin here. It makes no sense to modify the jQuery object. I also happen to think there's nothing inherently wrong with using the global namespace for user applications.

benz001 Over a year ago

Plus this is only hitting the global namespace if it's declared outside any other functions. For basic situations if this code only needs to be re-used within a single page (eg if an number of events need to call the same custom animation on a page) then it will probably already be within a closure inside the $(document).ready(function(){.....}) If it needs to be reused more widely then turn it into a plugin and give it it's own file.

Pointy · Accepted Answer · 2009-12-15 01:30:07Z

12

// first function
$(function() {
  $.yourFavoriteFunctionName = function() {
    // the code for the first function
  };
  $.yourFavoriteFunctionName();
});

then

// second function
$(function() {
  // whatever
  if (foo)
    $.yourFavoriteFunctionName();

answered Dec 15, 2009 at 1:30

Pointy

415k62 gold badges600 silver badges631 bronze badges

Comments

RamboNo5 · Accepted Answer · 2009-12-15 02:17:07Z

1

you could give it a name? am I missing something?

edit: to get this right

<script type="text/javascript">
function() myfunction{
    var text = $("#searchText").val();
    $.getJSON("Search", { world: text, filter: text }, function(data) {
        $("tr.DataRow").toggle(false);
        for (i = 0; i < data.length; i++) {
            $("#obj" + data[i]).toggle(true);
        }
    });
}

$(function(){
    $("#search").click(myfunction);
});
</script>

and then

<script type="text/javascript">

$(function() {
    $('#searchText').bind('keypress', function(e) {
        if (e.keyCode == 13) {
            myfunction();
        }
    });
});
</script>

edited Dec 15, 2009 at 2:17

answered Dec 15, 2009 at 1:28

RamboNo5

2,0602 gold badges17 silver badges26 bronze badges

5 Comments

Pointy Over a year ago

That will not work. When you instantiate a function as part of an expression, giving it a name will provide a way for the function to call itself recursively, but it will not set up that name as an attribute of the window object (or any other object).

Doug Neiner Over a year ago

@RamboNo5 All myfunction() is triggering is the event binding of the #search element, not the click action itself.

RamboNo5 Over a year ago

Ok thanks! I edited thhe code. Now it should work as expected right? Your solution is much more slick, though :)

Doug Neiner Over a year ago

@RamboNo5, basically, to follow your approach, you need to empty take the contents of the #search anonymous function, and put them into myfunction(), then use this to bind it to #search : $("#search").click(myfunction); And then whether you call myfunction or click the #search element, the same function will run.

RamboNo5 Over a year ago

Alright, that makes sense. A repeated binding of the click event is kinda superfluously.

Collectives™ on Stack Overflow

jquery call function by name

4 Answers 4

1 Comment

4 Comments

Comments

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

4 Comments

Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related