Alpha Video Training
Results 1 to 24 of 24

Thread: Javascript - convert keypress to button click

  1. #1
    Volunteer Moderator Steve Workings's Avatar
    Real Name
    Steve Workings
    Join Date
    Apr 2000
    Location
    The Dreaded Chair
    Posts
    5,606

    Default Javascript - convert keypress to button click

    I've spent too much time on this, and wonder if anyone has the correct javascript. When the user is finished typing a search term in a control, I want their "Enter" key press to click the Search button next to the text control. I've tried the OnKeyUp, OnKeyDown, OnKeyPress event but I think my javascript is the real problem and continued weakness:

    Code:
    $('PRESCRIPTADD.V.R1.MEDSEARCH').onkeypress(function(event){
        if(event.keyCode == 13){
            $('PRESCRIPTADD.V.R1.BUTTON_SEARCH').click();
            alert('key PRESS');
        }
    });
    -Steve


  2. #2
    Member -Jinx-'s Avatar
    Real Name
    Jinx
    Join Date
    Jul 2012
    Location
    Wisconsin
    Posts
    963

    Default Re: Javascript - convert keypress to button click

    I can't seem to post code tags with my stupid phone....argh.

    Code:
    var keycode = event.keyCode;
    if (keycode == 13){$('PRESCRIPTADD.V.R1.BUTTON_SEARCH').click();}
    Should work. I believe that's what I use but I'm not near my computer. Just put it in the onKeyDown or press event for the control that they will be typing in. You should be able to test it with an alert as well
    Last edited by Al Buchholz; 04-09-2014 at 10:42 PM.

  3. #3
    Volunteer Moderator Steve Workings's Avatar
    Real Name
    Steve Workings
    Join Date
    Apr 2000
    Location
    The Dreaded Chair
    Posts
    5,606

    Default Re: Javascript - convert keypress to button click

    Perfect. Thanks so much.
    -Steve


  4. #4
    Volunteer Moderator Peter.Greulich's Avatar
    Real Name
    Peter Greulich
    Join Date
    Apr 2000
    Location
    Boston, MA
    Posts
    11,643

    Default Re: Javascript - convert keypress to button click

    Hey Jinx

    That method works great.

    e.g. on a UX
    Code:
    var keycode = event.keyCode;
    if (keycode == 13){
    	{dialog.Object}.setFocus('LOC_NUM');
    	}
    However, this doesn't work:
    Code:
    var keycode = event.keyCode;
    if (keycode == 13){
    	ele = $('DLG1.V.R1.LOGIN_BUTTON');
    	ele.click();
    	}
    Nor does this:
    Code:
    var keycode = event.keyCode;
    if (keycode == 13){
    	ele = $('DLG1.V.R1.LOGIN_BUTTON');
    	{dialog.Object}.setFocus(ele);
    	}
    Nor does the way as in your code example w/o assigning the ele object. I got the button id from FireBug, so that's good. I also tried:
    Code:
    var keycode = event.keyCode;
    if (keycode == 13){
    	ele = $('{dialog.Object}.DLG1.V.R1.LOGIN_BUTTON');
    	ele.click();
    	}
    Any ideas?

  5. #5
    "Certified" Alphaholic
    Real Name
    Govindan Gandhi
    Join Date
    Aug 2008
    Location
    New York, NY
    Posts
    4,294

    Default Re: Javascript - convert keypress to button click

    do you need to add
    var ele
    to assign a variable in javascript?
    thanks for reading

    gandhi

    version 11 3381 - 4096
    mysql backend
    http://www.alphawebprogramming.blogspot.com
    ggandhi344@gmail.com
    Skype:ggandhi344@gmail.com
    1 914 924 5171

  6. #6
    "Certified" Alphaholic
    Real Name
    Govindan Gandhi
    Join Date
    Aug 2008
    Location
    New York, NY
    Posts
    4,294

    Default Re: Javascript - convert keypress to button click

    http://www.youtube.com/watch?v=VJNLRBJFs7k
    here is a video,
    you may be able to modify this to suit you.
    thanks for reading

    gandhi

    version 11 3381 - 4096
    mysql backend
    http://www.alphawebprogramming.blogspot.com
    ggandhi344@gmail.com
    Skype:ggandhi344@gmail.com
    1 914 924 5171

  7. #7
    Member -Jinx-'s Avatar
    Real Name
    Jinx
    Join Date
    Jul 2012
    Location
    Wisconsin
    Posts
    963

    Default Re: Javascript - convert keypress to button click

    Peter, I'll check when I get to work tomorrow. I had a similar problem lately with trying to disable a button, you might find it if you look a few posts down, back to last week.

    Could you so try $(ele).click()

    As far as not assigning it with "var ele" it will work but may mess things up if you have more than one "ele" assigned that way. "var ele" isn't available outside the function but just "ele" is. So, you should use "var ele =" unless you actually need it outside.
    Last edited by -Jinx-; 04-28-2014 at 09:54 PM.

  8. #8
    "Certified" Alphaholic
    Real Name
    Govindan Gandhi
    Join Date
    Aug 2008
    Location
    New York, NY
    Posts
    4,294

    Default Re: Javascript - convert keypress to button click

    instead of clicking that button, is it possible (in you situation) just to call the function that is called when clicking the button.
    when I tried, that it works.

    I tried in the afterDialogValidate added a line e.javascript = "alert('success');"
    and the code called the submit button action.
    thanks for reading

    gandhi

    version 11 3381 - 4096
    mysql backend
    http://www.alphawebprogramming.blogspot.com
    ggandhi344@gmail.com
    Skype:ggandhi344@gmail.com
    1 914 924 5171

  9. #9
    Volunteer Moderator Peter.Greulich's Avatar
    Real Name
    Peter Greulich
    Join Date
    Apr 2000
    Location
    Boston, MA
    Posts
    11,643

    Default Re: Javascript - convert keypress to button click

    Quote Originally Posted by GGandhi View Post
    instead of clicking that button, is it possible (in you situation) just to call the function that is called when clicking the button.
    when I tried, that it works.

    I tried in the afterDialogValidate added a line e.javascript = "alert('success');"
    and the code called the submit button action.
    Yup. That works. Thanks Gandhi. Why didn't I think of that?

  10. #10
    Member -Jinx-'s Avatar
    Real Name
    Jinx
    Join Date
    Jul 2012
    Location
    Wisconsin
    Posts
    963

    Default Re: Javascript - convert keypress to button click

    It looks like Ghandi's idea works fine for you, and I'm still not sure why the methods above won't work properly.

    There is another method you can use though, and I'm using this in searches on dialogs. It's one of those obvious solutions we forget about from time to time:

    Code:
    var keycode = event.keyCode;
    if (keycode == 13){
    	{dialog.object}.buttonClick('LOGIN_BUTTON');
    	}

  11. #11
    Volunteer Moderator Peter.Greulich's Avatar
    Real Name
    Peter Greulich
    Join Date
    Apr 2000
    Location
    Boston, MA
    Posts
    11,643

    Default Re: Javascript - convert keypress to button click

    Quote Originally Posted by -Jinx- View Post
    It looks like Ghandi's idea works fine for you, and I'm still not sure why the methods above won't work properly.

    There is another method you can use though, and I'm using this in searches on dialogs. It's one of those obvious solutions we forget about from time to time:

    Code:
    var keycode = event.keyCode;
    if (keycode == 13){
        {dialog.object}.buttonClick('LOGIN_BUTTON');
        }
    We're hitting pay dirt today. That works too. Thanks Jinx.

  12. #12
    Member
    Real Name
    Jim DeWitt
    Join Date
    Jun 2014
    Posts
    50

    Default Re: Javascript - convert keypress to button click

    Jinx/Peter, Thanks, worked for me as well
    Last edited by stewx; 08-03-2014 at 11:56 AM.

  13. #13
    "Certified" Alphaholic CharlesParker's Avatar
    Real Name
    Charles Parker
    Join Date
    Dec 2012
    Location
    New Orleans, LA
    Posts
    2,117

    Default Re: Javascript - convert keypress to button click

    I have a request for you guys - I am trying to open a detail view in a grid for editing and want to put code somewhere that would allow a user to Submit() the detail view by being able to enter
    ctrl+enter once the record is dirty.

    I dont want to use just the keycode == 13 because there is a textarea that once clicked into the enter key is used for returns.

    I have tried a few things, but I keep coming up with javascript errors or the code simply not performing. First of all, I can't figure out how to join keycodes
    is it (event.keycode == 13 && event.ctrlKey) or (event.keycode == 13 + event.ctrlKey) or is it a variation of (event.keycode == 13 && event.keycode 17)

    Finally, where would the code go. I tried the variations in the client side afterdetailveiwopen as I just want a quick way to save the record via the keyboard

    Would be nice to here from someone who is more familiar with this.

  14. #14
    "Certified" Alphaholic
    Real Name
    Govindan Gandhi
    Join Date
    Aug 2008
    Location
    New York, NY
    Posts
    4,294

    Default Re: Javascript - convert keypress to button click

    ctrl key code is 17
    I have not tested a combination of ctrl+enter
    thanks for reading

    gandhi

    version 11 3381 - 4096
    mysql backend
    http://www.alphawebprogramming.blogspot.com
    ggandhi344@gmail.com
    Skype:ggandhi344@gmail.com
    1 914 924 5171

  15. #15
    "Certified" Alphaholic
    Real Name
    Govindan Gandhi
    Join Date
    Aug 2008
    Location
    New York, NY
    Posts
    4,294

    Default Re: Javascript - convert keypress to button click

    just a follow up
    test in my javascript folder
    ctrl+enter pressed together returns a code of 10
    thanks for reading

    gandhi

    version 11 3381 - 4096
    mysql backend
    http://www.alphawebprogramming.blogspot.com
    ggandhi344@gmail.com
    Skype:ggandhi344@gmail.com
    1 914 924 5171

  16. #16
    "Certified" Alphaholic CharlesParker's Avatar
    Real Name
    Charles Parker
    Join Date
    Dec 2012
    Location
    New Orleans, LA
    Posts
    2,117

    Default Re: Javascript - convert keypress to button click

    I think 10 is for F12

    either way I can't figure it out and by my figuring says theres a way to do this!

  17. #17
    "Certified" Alphaholic
    Real Name
    David Kates
    Join Date
    Apr 2008
    Location
    Unionville, ON
    Posts
    7,724

    Default Re: Javascript - convert keypress to button click

    For a Grid... try this... in the Javascript Functions section...

    Code:
    if (document.addEventListener){ //code for Moz
    	document.addEventListener("keydown",keyCapt,false); 
    	}else{
    	document.attachEvent("onkeydown",keyCapt); //code for IE
    }
    
    function keyCapt(e){
       if (e.keyCode === 13 && e.ctrlKey) {
    		if ({grid.Object}._detailViewIsDirty) {
    			{grid.Object}.submitDetailView();
    		}
    	}
    }

  18. #18
    "Certified" Alphaholic CharlesParker's Avatar
    Real Name
    Charles Parker
    Join Date
    Dec 2012
    Location
    New Orleans, LA
    Posts
    2,117

    Default Re: Javascript - convert keypress to button click

    David,
    that absolutely works as expected. What a treat to start my Monday morning with! Thank you. Nice job on the IE and Mozilla thing as well.


    I am pretty sure that if there was a little black book of good stuff - this snippet would be in it.

  19. #19
    "Certified" Alphaholic
    Real Name
    Larry Grupido
    Join Date
    May 2010
    Posts
    1,813

    Default Re: Javascript - convert keypress to button click

    Quote Originally Posted by -Jinx- View Post
    Code:
    var keycode = event.keyCode;
    if (keycode == 13){
    	{dialog.object}.buttonClick('LOGIN_BUTTON');
    	}

    This code works seems to work better with mobile devices.

    I have been having a problem where using ele.clicked worked on a regular browser, but it wasn't working at all on most mobile devices. But this method is not working or me in both places.

    Thank you!

    Larry

  20. #20
    "Certified" Alphaholic CharlesParker's Avatar
    Real Name
    Charles Parker
    Join Date
    Dec 2012
    Location
    New Orleans, LA
    Posts
    2,117

    Default Re: Javascript - convert keypress to button click

    larry I can't tell from your post if you mean the code that David posted or the code you quoted isn't working. For me the code David posted is working across all devices that have a keyboard and an internet browser that I can actually hold down the control key and hit enter.

  21. #21
    "Certified" Alphaholic
    Real Name
    Larry Grupido
    Join Date
    May 2010
    Posts
    1,813

    Default Re: Javascript - convert keypress to button click

    Sorry, that's what I get for hijacking a thread!

    My problem was that a script similar to this:

    $('PRESCRIPTADD.V.R1.BUTTON_SEARCH').click();

    Wasn't working for me on mobile devices. But it worked fine in any Windows browser.

    But this:

    {dialog.object}.buttonClick('LOGIN_BUTTON');

    Did work. My code had nothing to do with a button press, I was keying off a different event. But if I tried to click the button directly with click() it would not work on mobile devices, but once I switched to the buttonClick code, it worked flawlessly.

  22. #22
    "Certified" Alphaholic CharlesParker's Avatar
    Real Name
    Charles Parker
    Join Date
    Dec 2012
    Location
    New Orleans, LA
    Posts
    2,117

    Default Re: Javascript - convert keypress to button click

    Ah good to know.

  23. #23
    "Certified" Alphaholic
    Real Name
    David Kates
    Join Date
    Apr 2008
    Location
    Unionville, ON
    Posts
    7,724

    Default Re: Javascript - convert keypress to button click

    A possible reason why $('PRESCRIPTADD.V.R1.BUTTON_SEARCH').click(); was not working is that the UX Component could be rendered with a different name. You can't count on PRESCRIPTADD to be a valid, static part of the ID.

    You should use...

    $('{dialog.Object}.V.R1.BUTTON_SEARCH').click();

  24. #24
    "Certified" Alphaholic
    Real Name
    Larry Grupido
    Join Date
    May 2010
    Posts
    1,813

    Default Re: Javascript - convert keypress to button click

    I'm pretty sure I was not using the actual name, I was just giving an example here which I cut and pasted from a previous post.

    But your point is well taken - there is no guarantee the name will be the same, especially when working cross platform.

    I'll make sure I double check that next time and I'll test it in my current UX one more time, just to be sure. I'll holler back if I get more info.

    Larry

Similar Threads

  1. click a button from javascript
    By Clipper87 in forum Application Server Version 11 - Web/Browser Applications
    Replies: 27
    Last Post: 03-22-2013, 06:31 PM
  2. Returning JSON Data from remote Server using a Button's JavaScript on Click Event
    By markmoss in forum Application Server Version 11 - Web/Browser Applications
    Replies: 3
    Last Post: 03-05-2013, 04:26 PM
  3. Can I change button colour on button click in grid? If yes, please explain?
    By Suvarchala in forum Application Server Version 11 - Web/Browser Applications
    Replies: 0
    Last Post: 01-31-2012, 03:18 AM
  4. How to change button background color on button click in grid?
    By jyothi28.g in forum Application Server Version 11 - Web/Browser Applications
    Replies: 0
    Last Post: 01-30-2012, 05:24 AM
  5. Help to convert some javascript to Xbasic
    By Graham Wickens in forum Alpha Five Version 6
    Replies: 3
    Last Post: 11-23-2005, 05:29 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •