views:

124

answers:

3

Hi, I'm new to web development and i'm starting with a MVC project. I have a view to create a new Service. In this view, i need to have a button to show a dialog with client names (i also would like to implement filters and paging in this dialog). Once the user selects a client from the dialog, i need to populate some combo boxes in the Service View with info relative to that particular client. How can i accomplish this? If there any demo code or tutorial i can get my hands on to learn this?

Thanks in advance for any tip.

+1  A: 

I recommend reading Pro ASP.NET MVC Framework By Steven Sanderson.

Phil Haack's, Steven Sanderson's and Stephen Walther's blog are also good resources.

Clark
+2  A: 

Whoa, that's a lot to answer in a single question.

I think you need to go through the NerdDinner sample first to get yourself familier with the MVC framework.

After that jQuery will be your friend. Essentially you can create a dialog with a jQuery call and use jQuery Ajax calls to your controller to get and filter data.

A good reference for jQuery is at jQuery.com

griegs
A: 

(griegs i couldn't comment on your answer because the post is too long)

I'm using TailSpin Travel as bible for now.

I have a doubt that maybe you can clarify.

Edit View

(...)
<div id="clientSearch">
        <%= Html.DropDownList("clientId", Model.Clients, Model.Clients)%>

        <div class="resultsWrapper">
            <div class="results">
                 <% Html.RenderPartial("clientDetails", Model); %>
            </div>
        </div>
</div>
(...)

Client Details partial View

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<EyePeak.ViewModel.Service.EditServiceViewModel>" %>
    <% if(Model.SelectedClient != null) { %>
    <tr>
        <%Html.LabelFor(model => model.SelectedClient.Name);%>
        <%= Html.DropDownList("clientAddresses", Model.SelectedClient.Addresses.Select(i => new SelectListItem { Value = i.Id.ToString(), Text = i.Name}))%>
    </tr>
<% } %>

Controler:

(...)

    public ActionResult New()
    {
        var service = new EyePeak.Data.Model.Service();

        return View("Edit", this.GetEditViewModel(service));
    }

(...)

     public ActionResult SearchClientAddresses(string clientID)
     {
         var selectedClient = this._clientService.GetClient(Convert.ToInt32(clientID));

         var model = new EditServiceViewModel
         {
            SelectedClient=selectedClient
         };

         return PartialView("clientDetails", model);
     }

jQuery:

Sys.Application.add_load(

function()
{
   $("#clientId").bind("change", showClientInfo);
}
);

function showClientInfo()
{
   var id = $("#clientId").val();

   $("#clientSearch .results table").fadeOut();
   $("#clientSearch .results").slideUp("medium", function() {
       $.ajax(
                {
                    type: "GET",
                    url: "/Service/SearchClientAddresses",
                    data: "clientID=" + escape(id),
                    dataType: "html",
                    success: function(result) {
                        var dom = $(result);
                        $("#clientSearch .results").empty().append(dom).slideDown("medium");
                    }
                });
            });
}

My question is: Do i have to create a new EditServiceViewModel only with the Client information to pass it to the partial view? Can't i update my current ViewModel and pass it to the Partial view?

I'll need to create more partial views along the way in this particular view, so I'll need to create a viewmodel for each?

Maybe i didn't understood the concept well.

Thanks again for your help.

João Passos