I'm working on a project that involves creating an interface for a dictionary database. I was able to create a simple search bar that could pull out the correct information. Afterwards, I was able to implement an Autocomplete feature for the textbox using jQuery. Now, I'm having problems with the search function. If I submit the form, it does redirect to the appropriate script, but it does not send the text box value to the script.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>JQuery autocomplete example with database accessing</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style type="text/css">
input.submit {
width:30px;
height:30px;
cursor:pointer;
background-image:url('../search-button.jpg');
</style>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
$(function() {
$( "#searchbox" ).autocomplete({
source: "data.php",
minLength: 1
});
});
</script>
</head>
<body bgcolor="#E6E6FA">
<div style="background-color:#d4e7b2;text-align:left">
<form action="../test.php" method="get" style="margin-left:1cm;">
<div class="ui-widget">
<input id="searchbox"/>
<input class="submit" type="submit" value="" style="position:absolute;margin:0px 0 0 0px;"/>
</div>
</form>
<br>
</div>
</body>
</html>
The Autocomplete is working splendidly, but pressing the search button results in the page redirecting to "/test.php?" with no defined GET variables.
Any and all help is greatly appreciated!