How to pass data between view to another viewmodel?

Question

Im using Boilerplatejs and asp.net mvc2 in one of my projects. I have a autocompleting search box in one of the boilerplate views. and i wanted to send the selected "userId"(from the suggestions of the search box) to a viewmodel of another module and give an ajax call to my controller's action method using that "userId" as a parameter and then fetch some specific information to that user and finally display it in that particular module's view.

Here is my autocomplete script

$(document).ready(function () {
    $('#name-list').autocomplete({
        source: function (request, response) {
            $.ajax({
                url: "/Home/Searchuser",
                data: { searchText: request.term, maxResults: 10 },
                dataType: "json",
                success: function (data) {

                    response($.map(data, function (item) {
                        return {
                            value: item.DisplayName,
                            avatar: item.PicLocation,
                            rep: item.Reputation,
                            selectedId: item.UserUniqueid
                        };
                    }))
                }
            })
        },
        select: function (event, ui) {


            return selectedId; // **here im returning the required userId**
        }
    }).data("autocomplete")._renderItem = function (ul, item) {
        var inner_html = '<a><div class="list_item_container"><div class="image"><img src="' + item.avatar + '"></div><div class="label"><h3> Reputation:  ' + item.rep + '</h3></div><div class="description">' + item.label + '</div></div></a><hr/>';
        return $("<li></li>")
                .data("item.autocomplete", item)
                .append(inner_html)
                .appendTo(ul);
    };


});

My problem is how to catch this returned userId from the other module's viewmodel? So then i can make an ajax call to the Actionmethod and retrieve necessary information. Can anybody help me?

Answer 1

I think you should use URL controller here. Once the user selects a particular userprofile from the search box, you may get the application to navigate to the profile page of the user. Something like:

Boiler.UrlController.goTo("user/"+ user.id);

Now your user profile component should listen to the

controller.addRoutes({
    'user/{id}' : new UserComponent(context),
});

It is always good to be able to address your business objects via URLs. This enhances the ability to bookmark and keep browser history.