Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 28
  1. #1
    New Coder
    Join Date
    Jul 2008
    Posts
    29
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Javascript running on an html form problem

    Hi. I have an html form at http://michelleoswell.com/opacmenu2.html. The javascript I'm using to run the form is working just fine, however I think that what it's done is make it so that you can't submit the form on pressing the enter key, which is crucial to making this form user-friendly. Can anyone help me come up with a way to make it so the form can be submitted on pressing enter in the text box or by pressing the submit button? Thanks in advance.

  • #2
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,043
    Thanks
    0
    Thanked 251 Times in 247 Posts
    Why not just set your form action to http://roc.curtis.edu/search/X and then remove onsubmit and change your Search button into a input type="submit" button? You wouldn't need javascript at all.

  • #3
    Regular Coder
    Join Date
    Apr 2012
    Location
    St. Louis, MO
    Posts
    985
    Thanks
    7
    Thanked 101 Times in 101 Posts
    The return/enter key is keyCode 13. If you use both event.which AND event.keyCode to check and see if the event is 13, you can tell the function to submit.

    Code:
        
    function (event) {
             if (event.which == 13 || event.keyCode == 13) {
                 form.submit();
             }
             else { return false;}
         }
    ^_^

    If anyone knows of a website that can offer ColdFusion help that isn't controlled by neurotic, pedantic jerks* (stackoverflow.com), please PM me with a link.
    *
    The neurotic, pedantic jerks are not the owners; just the people who are in control of the "popularity contest".

  • #4
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,043
    Thanks
    0
    Thanked 251 Times in 247 Posts
    If there is a submit button in the form, you wouldn't need to manually detect Enter key to submit the form. It will be done automatically by the browser.

  • Users who have thanked glenngv for this post:

    Moswell (04-18-2013)

  • #5
    Regular Coder
    Join Date
    Apr 2012
    Location
    St. Louis, MO
    Posts
    985
    Thanks
    7
    Thanked 101 Times in 101 Posts
    I try to avoid using submit buttons. If someone has javascript disabled, it bypasses form validation. If you use javascript to submit the form, problem (usually) solved.

    This is, of course, assuming that a server-side language like ColdFusion or ASP is not being utilized. When using one, I use both client-side and server-side validation.
    ^_^

    If anyone knows of a website that can offer ColdFusion help that isn't controlled by neurotic, pedantic jerks* (stackoverflow.com), please PM me with a link.
    *
    The neurotic, pedantic jerks are not the owners; just the people who are in control of the "popularity contest".

  • #6
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,043
    Thanks
    0
    Thanked 251 Times in 247 Posts
    If you are submitting a form, then in most cases you would have a server-side language to process the form data. If you have a static website, chances are you are not submitting any form at all.

  • #7
    Regular Coder
    Join Date
    Apr 2012
    Location
    St. Louis, MO
    Posts
    985
    Thanks
    7
    Thanked 101 Times in 101 Posts
    There are static-HTML forms that submit to cgi scripts, for email or whatnot. I've never used one, so I don't know if the hosting services that utilize those have validation, or not. (shrug)

    UPDATE: Even when a server-side solution is being used, I use both. For those who don't have javascript disabled, it saves time and some bandwidth by validating before sending to the server; then use server-side validation for those who do have js disabled.
    Last edited by WolfShade; 04-18-2013 at 05:57 PM.
    ^_^

    If anyone knows of a website that can offer ColdFusion help that isn't controlled by neurotic, pedantic jerks* (stackoverflow.com), please PM me with a link.
    *
    The neurotic, pedantic jerks are not the owners; just the people who are in control of the "popularity contest".

  • #8
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,043
    Thanks
    0
    Thanked 251 Times in 247 Posts
    They should have. Who in their right mind would offer such scripts for public usage without user input validation?

  • #9
    New Coder
    Join Date
    Jul 2008
    Posts
    29
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Thanks folks. A little more background: the reason there's javascript in this form is because I'm trying to make my library catalog do something it doesn't normally do. Without the javascript, it would just search whatever keyword the user puts in the box. With the javascript and the submit button, they hit submit (or enter) and can choose from the drop down if they want to limit to a particular material (like book or CD). Without the javascript, they can't do that limit.

    You're rarely (or never) going to see a library search page without a submit button. It's a standard thing, so I can't really get rid of it.

    As far as validation goes, there's not much to validate. They could enter any text at all in that search box and it would be acceptable. Shoot, they could enter nothing and hit submit if they so desired.

  • #10
    New Coder
    Join Date
    Jul 2008
    Posts
    29
    Thanks
    3
    Thanked 0 Times in 0 Posts
    ...or I could just change the darn "button" input to "submit" and solve the whole problem without additional javascript. Guess I've solved my problem, lol. It's always when I give up and post a question that I find the most ridiculously easy solution.

  • #11
    Regular Coder
    Join Date
    Apr 2012
    Location
    St. Louis, MO
    Posts
    985
    Thanks
    7
    Thanked 101 Times in 101 Posts
    Quote Originally Posted by Moswell View Post
    You're rarely (or never) going to see a library search page without a submit button. It's a standard thing, so I can't really get rid of it.
    Sorry. I didn't type that quite clearly. When I said that I avoid submit buttons, I meant that I use <input type="button"> instead of <input type="submit">. Then I use JS to submit the form.
    ^_^

    If anyone knows of a website that can offer ColdFusion help that isn't controlled by neurotic, pedantic jerks* (stackoverflow.com), please PM me with a link.
    *
    The neurotic, pedantic jerks are not the owners; just the people who are in control of the "popularity contest".

  • #12
    New Coder
    Join Date
    Jul 2008
    Posts
    29
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by WolfShade View Post
    Sorry. I didn't type that quite clearly. When I said that I avoid submit buttons, I meant that I use <input type="button"> instead of <input type="submit">. Then I use JS to submit the form.
    Ah, I see. Since this is a simple form I won't worry about validation, as I mentioned above.

  • #13
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,043
    Thanks
    0
    Thanked 251 Times in 247 Posts
    Quote Originally Posted by Moswell View Post
    Thanks folks. A little more background: the reason there's javascript in this form is because I'm trying to make my library catalog do something it doesn't normally do. Without the javascript, it would just search whatever keyword the user puts in the box. With the javascript and the submit button, they hit submit (or enter) and can choose from the drop down if they want to limit to a particular material (like book or CD). Without the javascript, they can't do that limit.
    All form control values including the dropdown selections would be submitted even without javascript.
    Code:
    <form action="http://roc.curtis.edu/search/X" method="get" name="search" id="search" >
    
    <input type="text" name="searcharg" id="searcharg" size="40" maxlength="75" value="" />
    <select name="m" id="m">
        <option value="j" selected="selected">Sound Recordings</option>
        <option value="c">Musical Scores</option>
          <option value="g">Video Recordings</option>   
    </select>
    <select name="SORT" id="sort">
    <option value="D" selected="selected">by relevance</option>
    <option value="DX">by date</option>
    <option value="AX">by title</option></select>
    
    <input type="submit" value="Search" />
    
    </form>
    When Search submit button is clicked on, it would submit the searcharg, m and SORT as querystring to the form action url. You don't need javascript to do that.

  • #14
    New Coder
    Join Date
    Jul 2008
    Posts
    29
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by glenngv View Post
    All form control values including the dropdown selections would be submitted even without javascript.
    Code:
    <form action="http://roc.curtis.edu/search/X" method="get" name="search" id="search" >
    
    <input type="text" name="searcharg" id="searcharg" size="40" maxlength="75" value="" />
    <select name="m" id="m">
        <option value="j" selected="selected">Sound Recordings</option>
        <option value="c">Musical Scores</option>
          <option value="g">Video Recordings</option>   
    </select>
    <select name="SORT" id="sort">
    <option value="D" selected="selected">by relevance</option>
    <option value="DX">by date</option>
    <option value="AX">by title</option></select>
    
    <input type="submit" value="Search" />
    
    </form>
    When Search submit button is clicked on, it would submit the searcharg, m and SORT as querystring to the form action url. You don't need javascript to do that.
    Sorry, that doesn't quite work since the url string that's created for the search result is different than what is needed to actually run the search. The js solution works very well, really. Long-term I'm going to be buying a product from the company that makes this search much easier, but for the next eight or so months what I've got is a decent workaround.

  • #15
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,043
    Thanks
    0
    Thanked 251 Times in 247 Posts
    Quote Originally Posted by Moswell View Post
    Sorry, that doesn't quite work since the url string that's created for the search result is different than what is needed to actually run the search.
    Then change the form field names to the correct values.


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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