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.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Mar 2012
    Posts
    63
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Submitting a form with enter

    Hello all. I have a customized icon I use from "font-awesome" that I use to submit a search query. Since it's a customized font that I have to use the <i class""></i> to call, I had to create a javascript that did an "onclick" to submit the form. Problem is I also want the the javascript to work if I press enter after typing in the search. How do I make this work? Heres my code:

    HTML:
    Code:
    <form onsubmit="searchbarsubmitjs();">
    	<input type="text" id="search" class="searchclass" name="searchbarinput" placeholder="Search then press enter..." />
    <div id="searchcriteria"><span>All Contacts</span>
    	<i id="searchcriteriachevron" class="icon-chevron-down"></i>
    	<i id="searchsubmit" class="icon-chevron-right"></i>
    	<input type="submit" style="position: absolute; left: -99999px;" />
    </form>
    </div>
    Javascript/Jquery:
    Code:
    function searchbarsubmitjs() {
    		if($("#searchcriteria span").text() == "YouTube") {
    			var search_term = $('.searchclass').attr('value');
    				window.location.replace("../../youtube/results.php?q=" + search_term);
    		};
    		
    		if($("#searchcriteria span").text() == "Google") {
    			var search_term = $('.searchclass').attr('value');
    				window.open("http://www.google.com/?q=" + search_term + "&output=search");
    		};
    		
    		if($("#searchcriteria span").text() == "bing") {
    			var search_term = $('.searchclass').attr('value');
    				window.open("http://www.bing.com/search?q=" + search_term);
    		};
    		
    		if($("#searchcriteria span").text() == "Wikipedia") {
    			var search_term = $('.searchclass').attr('value');
    				window.open("http://en.wikipedia.org/wiki/Special:Search?search=" + search_term + "&go=GO");
    		};
    	};
    	
    	
    	$('#searchsubmit').click (function() {
    		searchbarsubmitjs();
    	});
    	
    	$('#searchsubmitform').submit(function() {
    		searchsubmitjs();
    	});

  • #2
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,438
    Thanks
    23
    Thanked 630 Times in 629 Posts
    Code:
    function keyevent(key) // submit key
    {
    	if (key.keyCode == 13) // 13 = enter key
    	{
    		// YOUR CODE HERE
    	}
    }

  • #3
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,142
    Thanks
    203
    Thanked 2,547 Times in 2,525 Posts
    Code:
    <input type = "text" id = "textfield" size = "20" onkeyup = "chk(event)">
    
    <script type = "text/javascript">
    
    function chk(ev) {
    var key;
    ev = ev || event;
    key = ev.keyCode;
    if (key == 13) {
    var val = document.getElementById("textfield").value;
    alert ("You pressed the Enter key\nYou have entered " + val);
    return false;
    }
    }
    
    </script>

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.


  •  

    Posting Permissions

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