SPAutoComplete Get Selected Value

Mar 9, 2012 at 1:47 PM

I need to get the value of an SPAutoComplete input field so I can pass it to another field. I'm using a blur function, which works if the user types in a new value then blurs the field, however if the user enters a few characters then selects the rest of the value from the dropdown the blur function only gets the value of the text that the user typed, not the value that the SPAutoComplete inputs to the field.

For example: if I type "Disc" and select from the dropdown "Discussion" the $("input#testfield").val() would be "Disc". Is there another jQuery method I should use or is there something built into SPServices that would solve this problem? Thank you!

Mar 9, 2012 at 3:09 PM

Instead of relying on a DOM event, you could fire your code during the PreSaveAction() method that is ran when a form is saved.

Here's a good link with some more info on that. It's only fitting that Marc wrote it. ;~)



Mar 9, 2012 at 3:21 PM
Thank you, Matt, that is a nice solution but unfortunately it does not meet my requirements. What I need to do is immediately match the selected value against another value on the page so if there is a problem the user can fix it before submitting the form. I have all of that code working well but if the user selects a value from SPAutoComplete, it doesn't pass the full value as I said above. I tried doing a click function of the next form field but if the user doesn't click the other field than the solution breaks.

Sent from my iPhone
Mar 9, 2012 at 4:23 PM

What's awesome about the PreSaveAction() is you can prevent the form from being submitted if your values don't match.  Here's a crude example:

function PreSaveAction() {

	if ( column1 !== column2 ) {
		//Add error to the DOM, throw an alert, whatev...
		//Returning false prevents submission.
		return false;

	//All is good in the hood...
	return true;



Mar 12, 2012 at 1:45 AM


Did Matt's suggestions help you get this working or are you still having problems?


Mar 12, 2012 at 2:34 AM
His suggestion was very helpful but I'm still really looking for the immediate action on blur. Your SPAutoComplete generates a UL with the ID being the name of the field. I was able to successfully call a click function for the LI's of the UL and subsequently get the text of the LI. That was simple but the problem is that I also need the blur function in case the user inputs a completely new value and the blur function will always fire. I.E. if the user inputs a new value it fires, which is good, but if the user selects a value from the UL it also fires but then the click function subsequently fires, causing the same function to execute twice. I didn't get much past that point before the end of the week so I haven't figured out if I can code some sort of exception but that's where I'm at now.
Mar 14, 2012 at 4:02 PM
Edited Mar 14, 2012 at 4:02 PM

How about binding to the click on the LIs which contain the options *and* the blur event for the input?


Mar 19, 2012 at 3:48 PM

Another thought would be to bind to the change event for the input element. If you test to see if the value has in fact changed before you do your thing, I would think it would work well.