CODEWITHSUNDEEP
javascripthtmlbutton
mmzc
mmzc

Reputation: 622

Enter triggers html button click with javascript that has a specific value

Because we use orbeon xforms, we don't know the id of the button tag. What we would like is the Enter key to trigger a button that contains a certain string value.

If my form contains a Check button like so:

<button id"random">Check</button>

I would like my javascript button to trigger it with something like: find the button that has value "Check" and click it when Enter is pressed.

Upvotes: 0

Views: 398

Answers (1)

gideon
gideon

Reputation: 19465

Updated code, since I didn't see your markup (which contained <button> instead of <input>)

I would use JQuery here since selecting the buttons you are looking for could be more difficult using Pure JS only.

Something like this should work:

$(
    function(){
        $(document).keydown(function(){
             if (event.keyCode == '13') {
                 event.preventDefault();//stop what normally happens..
                 //..like submitting a form maybe
                 //$("input[type='submit'][value='Check']").click();
                 $("button").each(function(i){
                  if($(this).text() == "Check")
                  {
                     $(this).click();
                  }
                 })
             }
        });
    }
);

With markup like this:

<button id="random" onclick="alert('clicked 0');">Check</button>
<button id="random2" onclick="alert('clicked 1');">Something else</button>
<button id="random3" onclick="alert('clicked 2');">Third Button</button>

See Demo : http://jsfiddle.net/giddygeek/Caxae/3/ (Click/Focus on the result pane and hit the Enter key)

Upvotes: 2

Related Questions