Link to home
Start Free TrialLog in
Avatar of griffaw
griffaw

asked on

Submit a form onclick with Jquery autocomplete

I'm using jquery autocomplete on a search form. I would like the form to submit when a result is clicked. IE: No submit button.

Current code is below.

Thanks in advance.
<script type="text/javascript">
$().ready(function() {

	function log(event, data, formatted) {
			$("<li>").html( !data ? "No match!" : "Selected: " + formatted).appendTo("#result");
		}
		
		function formatItem(row) {
			return row[0] + " (<strong>id: " + row[1] + "</strong>)";
		}
		function formatResult(row) {
			return row[0].replace(/(<.+?>)/gi, '');
		}
		
		$("#tablesearch").autocomplete("ajaxsearch.asp", {
			width: 260,
			selectFirst: true

		});




		$("#tablesearch").result(function(event, data, formatted) {
			if (data)
				$(this).parent().next().find("input").val(data[1]);
		});

	})
</script>


'here is the form

<form name="search" action="users_add.asp" method="post" autocomplete="off"><input type="text" name="tablesearch" id="tablesearch" /><input name="submit" type="submit" value="Get" /></form>

Open in new window

Avatar of leakim971
leakim971
Flag of Guadeloupe image

sorry forget my comment, bad thread...
If each result have a class : resultClass

You should be able to use something like :

(where myForm is the id of the form)
$(".resultClass").click(function() { $("form[name='search']").submit(); });

Open in new window

(where myForm is the id of the form)
$(".resultClass").click(function() { $("#myForm").submit(); });

Open in new window

Avatar of griffaw
griffaw

ASKER

leakim971:

Tried it. Didnt work. Any other thoughts?
Can I see your implementation of the proposition ?
Avatar of griffaw

ASKER

See below. I also need to populate a hidden form field named "editid". I need to pass the id rather than the label.

Thanks!
<script type="text/javascript">
$().ready(function() {

	function log(event, data, formatted) {
			$("<li>").html( !data ? "No match!" : "Selected: " + formatted).appendTo("#result");
		}
		
		function formatItem(row) {
			return row[0] + " (<strong>id: " + row[1] + "</strong>)";
		}
		function formatResult(row) {
			return row[0].replace(/(<.+?>)/gi, '');
		}
		
		$("#tablesearch").autocomplete("ajaxsearch.asp", {
			width: 260,
			selectFirst: true

		});


		$("#tablesearch").result(function(event, data, formatted) {
			if (data)
				$(this).parent().next().find("input").val(data[1]);
		});
		
		$(".resultClass").click(function() { $("#searchform").submit(); });


	})
</script>


///////form

<form name="searchform" id="searchform" action="users_add.asp" method="post" autocomplete="off"><input type="text" name="tablesearch" id="tablesearch" /><input type="hidden" name="editid" id="editid" /><input name="submit" type="submit" value="Get"/></form>

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of leakim971
leakim971
Flag of Guadeloupe image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of griffaw

ASKER

Sorry...do you mean setting the class on the form?
>Sorry...do you mean setting the class on the form?

No, you said : I would like the form to submit when a result is clicked. IE: No submit button.

So you need to set "resultClass" on each "result"
Avatar of griffaw

ASKER

Sorry if im dense...could you please post the code?