I've been working on this a few days, and can't find any
answers that make sense to me.
I'm working with jQuery's autocomplete (specifically
http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/).
I created an array of employee names & id's, and used it to
populate the autosuggest. It works great. The problem is, I don't
know how to pass the contents of the autosuggest field, let along
the id associated with it. I sense there is some training lacking
on my part... it seems like the answer should be very simple but
I'm not able to see it.
As I said, the autosuggest works great, and the display is
something like:
<field>Maribelle Francisco</field> <submit
button>
Selected: Maribelle Francisco
Hidden value: 778
The "hidden value" is the employee's id. The code where this
appears looks like:
<p id="result_hidden"> </p>
The javascript above contains these directions:
if (data)
{
// put the selected text into the <p> with id
result...
$("#result").html( "Selected: " + formatted);
//...and put the associated value into the <p> with id
result_hidden
$("#result_hidden").html("Hidden value: " + data[1]);
So - what exactly do I tell my form to send over?
I can't find the Attach Code button so here it is below:
***********************************************************************************************************************************
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml">
<head>
<link type="text/css" rel="stylesheet"
href="/crtis/admin/jquery.autocomplete.css" />
<script type="text/javascript"
src="/crtis/admin/jquery.js"></script>
<script type="text/javascript"
src="/crtis/admin/jquery-autocomplete/demo/jquery.autocomplete.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
// if any anchor is clicked then show an alert
$("a").click(function(){
alert("Thanks for visiting!");
});
// enable autcomplete for the field 'input_box', taking data
from array_employee.cfm
$("#input_box").autocomplete("array_employee.cfm");
// In response to an event generated by input_box...
$('input#input_box').result(function(event, data, formatted)
{
if (data)
{
// put the selected text into the <p> with id
result...
$("#result").html( "Selected: " + formatted);
//...and put the associated value into the <p> with id
result_hidden
$("#result_hidden").html("Hidden value: " + data[1]);
}
}
);
});
</script>
<title>jQuery test</title>
</head>
<body>
<form id="form1" name="form1" method="post"
action="new_employee.cfm">
<label for="textfield"></label>
<input type="text" name="input_box" id="input_box"
value="">
<input type="hidden" name="EmployeeID" id="EmployeeID"
value="17" /><-----This is what I thought should happen -
something should go where that "17" is--->
<input type="submit" value="submit" />
</form>
<p id="result"> </p>
<p id="result_hidden"> </p>
</body>
</html>
1
Reply
AdChoices