Question

I have a geo collection that contains items like: [state name] [city], [state] [country]

A text box is available for a user to begin typing, and a jQuery autocomplete box fills displays possible options.

The URL structure of the post request will depend on which was selected from the collection above, ie www.mysite.com/allstates/someterms (if a country is selected) www.mysite.com/city-state/someterms (if a city, state is selected) www.mysite.com/[state name]/someterms (if a state is selected)

These are already defined in my routes.

I was initially going to add some logic on the controller to determine the appropriate URL structure, but I was thinking to simply add that as an additional field in the geo table, so it would be a property of the geo collection.

Here is my jQuery function to display the collection details when, fired on keypress in the textbox:

    $(function () {
        $("#txtGeoLocation").autocomplete(txtGeoLocation, {
            source: function (request, response) {
                $.ajax({
                    url: "/home/FindLocations", type: "POST",
                    dataType: "json",
                    selectFirst: true,
                    autoFill: true,
                    mustMatch: true,
                    data: { searchText: request.term, maxResults: 10 },
                    success: function (data) {
                        response($.map(data, function (item) {
                            return { label: item.GeoDisplay, value: item.GeoDisplay, id: item.GeoID }
                        }))
                    }
                })
            },
            select: function (event, ui) {
                alert(ui.item ? ("You picked '" + ui.item.label + "' with an ID of " + ui.item.id)
                    : "Nothing selected, input was " + this.value);
                document.getElementById("hidLocation").value = ui.item.id;
            }
        });
    });

What I would like is to have structure the URL based on an object parameter (seems the simplest). I can only seem to read the parameters on "selected", and not on button click.

How can I accomplish this?

Thanks.

Was it helpful?

Solution

To resolve this, I removed the select: portion from the Javascript, and added the selected object parameters in the MVC route sent to my controller.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top