jQuery: trigger click or focus input field

Question

I have a page with multiple divs that all look like the example below. Each div contains a field, a hidden field and a button.

How can I achieve that by click on the button the (visible) input field gets triggered ? I need to trigger either a click or focus as both fire the same function.

Each button in question has the class="triggerBtn" and the corresponding input field has the class="inputField".

Example div:

<div>
    <input type="text" class="inputField" id="field1" name="field1" />
    <input type="hidden" name="field1" />
    <button type="button" class="btn btn-primary triggerBtn">Find</button>
</div>

$(".triggerBtn").click(function(e){ myFunction(); }); and $(".inputField").focus(function(e){ myFunction(); }); — TCHdvlp
– TCHdvlp, Commented Dec 17, 2013 at 13:29

A. Wolff · Accepted Answer · 2013-12-17 13:31:23Z

19

I guess you want:

$(".triggerBtn").click(function () {
    $(this).closest('div').find('.inputField').focus();
});

answered Dec 17, 2013 at 13:31

A. Wolff

74.4k9 gold badges98 silver badges158 bronze badges

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

2 Comments

TCHdvlp Over a year ago

You guess... Like all of us. As long as this question is unclear, we can't help him/her.

user2571510 Over a year ago

You guessed right ! :) Thanks for the quick reply and sorry I wasnt clear enough.

AmOs · Accepted Answer · 2013-12-17 13:30:35Z

6

add Onclick="function()" see here if you need to trigger it manually using jquery you can to this by

$("#field1").trigger("click");

Comments

Khanh TO · Accepted Answer · 2013-12-17 13:31:20Z

1

$(".triggerBtn").on("click",function(e){
      $(this).closest("div").find(".inputField").click();
     //or $(this).closest("div").find(".inputField").focus();
});

answered Dec 17, 2013 at 13:31

Khanh TO

49k13 gold badges101 silver badges117 bronze badges

Comments

Jeet · Accepted Answer · 2013-12-17 13:35:24Z

0

$(".triggerBtn").parent().children("input[type:text]").first().focus()

answered Dec 17, 2013 at 13:35

Jeet

1,3801 gold badge15 silver badges34 bronze badges

1 Comment

Adam Merrifield Over a year ago

shouldn't input[type:text] be input[type='text']?

patel.milanb · Accepted Answer · 2013-12-17 13:36:12Z

-1

Updated Jsfiddle: http://jsfiddle.net/ZmL4y/3/

$(document).on("click",".triggerBtn", function() { 
    var inputField =  $(this).closest('div').find('.inputField');
    if($(inputField).is(":visible"))
    {
       $(inputField ).focus();
    }
});

edited Dec 17, 2013 at 13:36

answered Dec 17, 2013 at 13:29

patel.milanb

6,00215 gold badges62 silver badges95 bronze badges

1 Comment

TCHdvlp Over a year ago

How can you focus an array of elements ?

Collectives™ on Stack Overflow

jQuery: trigger click or focus input field

5 Answers 5

2 Comments

Comments

Comments

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

2 Comments

Comments

Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related