Select to view content in your preferred language

How do I limit what is entered in the textbox when using a search widget?

5293
23
Jump to solution
07-15-2015 08:28 AM
ChrisSergent
Regular Contributor III

We want to verify that only valid addresses are entered into a contact form. All valid addresses come from our Web Address Locator. How do I validate each address to ensure that it is an address that we have in our system? Otherwise I want to block the user from sending the information. In other words I only want items from the autocomplete allowed for entry.

Here is the form: Contact Information Update

0 Kudos
23 Replies
ChrisSmith7
Frequent Contributor

Chris,

I have had to do stuff like this outside of the ArcGIS JS API in .NET. Just to give you an idea if you're using .NET and SQL Server...

Basically, it's autocomplete with validation. We used a .NET handler (.ashx - HTTP Handlers and HTTP Modules Overview). As the user types, a stored procedure in SQL would be called to pull a list of matched recommendations based on their search string. It's similar to how this person is doing it here:

autocomplete - auto complete textbox using jquery UI in vb.net - Stack Overflow

They are using in-line SQL, though (yuck) - but you get the idea. As for the validation, I would be careful interrupting the user while they are typing, but maybe add a notification to the page and highlight the field, or something like that, then disable the form submit button until they enter a valid, autocompleted value. The link I gave - it doesn't look like they are doing any validation.

Here's some info on preventing free text:

jquery - Autocomplete disallow free text entry? - Stack Overflow

Source looks to support multiple types, including the .NET handler so long as it returns JSON.

http://api.jqueryui.com/autocomplete/#option-source

Here's info on returning JSON from a .NET handler:

How to implement jquery autocomplete with JSON rsponse from ashx | The ASP.NET Forums

In summary, it looks like you could use the jQuery UI widget, then, source it to a .NET handler that calls a proc as the user types, which then returns a JSON object. If you go that route, you'll need jQuery base, then JQuery UI on top of that.

ChrisSmith7
Frequent Contributor

Here's a JS Fiddle example I put together showing you how to prevent free text (defacto validation):

Edit fiddle - JSFiddle

I'm simply using an array of values for the source - you'll have to replace with the ashx!

ChrisSergent
Regular Contributor III

I tried to enter my name, but I wanted it to invalidate that once I did; might need to extend it if I go .NET based on a button click event to see if an item is in the list.

0 Kudos
ChrisSergent
Regular Contributor III

I am going to try to do it with just JavaScript for now, but this is some excellent information.

0 Kudos