Dirtier Dirtier - 1 year ago 62
HTML Question

How do I make a form action pass input text to a function?

Ok so here's my problem. I am making a WikiViewer using Wikipedia's API. I have a search box (input type text) where I would like to be able to type in a query and just hit 'enter' to have it return my results, rather than having an actual submit button. It needs to be an actual form bc otherwise mobile devices won't be able to just hit return/go/etc instead of having to press a button. I tried it with a 'enter' key press event, but I can't find anything like this for mobile devices and I'm pretty sure they don't even exist.

Here is my working code, without the form element.

<div class='container'>
<input type="text" name="search" placeholder="Search..." id='search'>
<input type='submit' value=''>
<div id='article'>

const ready = () => {

const getWiki = (text) => {
type: "GET",
url: "http://en.wikipedia.org/w/api.php?action=parse&format=json&prop=text&section=0&page=" + `${text}` + "&callback=?",
contentType: "application/json; charset=utf-8",
async: false,
dataType: "json",
success: (data, textStatus, jqXHR) => {
const markup = data.parse.text["*"];
const text = $('<div></div>').html(markup);
text.find('a').each(function() {
error: error => {}

$('#search').on('keypress', (e) => {
if (e.which === 13)



If anyone knows of an easier way to accomplish this without needing the form for mobile devices, I'm all ears. As always, any help would be greatly appreciated. Thanks!

Answer Source

You don't need a submit button. What I said was to create a form in order to user its default behavior to get a submit from the form:

var $searchForm = $('#search_form');

$searchForm.on('submit', function (e) {
  var searchField = e.target.search.value;
  //use your searchField to pass to the function
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='container'>
    <form id="search_form">
	<input type="search" name="search" placeholder="Search..." id='search'>
	<div id='article'>

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download