Share via


Mobile MVC framework (part 2)

Last time I showed you how to create a simple Login Form and pass the data between the View and Controller using ViewData dictionary. In this post I am going to show you how to pass a strongly typed data.

We will continue working with code sample we created last time. We are going to add a new form to the project that will display a list of items in the ListBox as well as to allow filtering the data in this ListBox by entering the filtering criteria in the TextBox. Let's add the new form to the project with the name SearchForm wich should look like that:

 

The Model 

Let's add the Products class to the project which is goind to contain the List of products and implement a few simple methods to populate the list as well as a method to filter the list by the certain criteria:

    /// <summary>

    /// Model class

    /// </summary>

    public class Products

    {

        private List<string> productList;

     

        public List<string> ProductList

        {

            get

            {

                return productList;

            }

            set

            {

                productList = value;

            }

        }

        public string ProductType { get; set; }

        public void PopulateList()

        {

            productList = new List<string>();

          productList.Add("Chicken");

            productList.Add("Bread");

            productList.Add("Tomato");

            productList.Add("Cucumbers");

            productList.Add("Butter");

            productList.Add("Cheese");

            ProductType = "Food";

        }

        public void FilterData(string filter)

        {

            if (filter != "")

            {

                IEnumerable<string> result = productList.Where<string>(s => s.ToString() == filter);

                this.productList = result.ToList<string>();

            }

            else

            {

                PopulateList();

            }

        }

    }

The next let's modify the SearchForm code file to inherit from ViewForm and implement the IView<TModel> interface. Initially I have implemented the ViewForm<TModel> class and thought that I would be able to inherit from it, but I hit the old bug in the Visual Studio form's designer that doesn't like the generics if you want to visual inheritance, so I had to resort to a few workarounds such as implement the IView<TModel> interface by the form:

    public partial class SearchForm : ViewForm, IView<Products>

    {

        public SearchForm()

        {

            InitializeComponent();

        }

        #region IView<Products> Members

        public new ViewDataDictionary<Products> ViewData

        {

            get;

            set;

        }

        #endregion

    }

Let's add the override for OnUpdateView to the form that will be called from the controller:

protected override void OnUpdateView(string key)

{

     if (key == "Category")

     {

        this.lblProductType.Text = this.ViewData.Model.ProductType;

     }

     if (key == "Products")

     {

          // Bind the product list to the listbox

          this.lstProducts.DataSource = this.ViewData.Model.ProductList;

     }

}

and add the implementation for button event handler:

private void cmdSearch_Click(object sender, EventArgs e)

{

     // Place the filter data into the ViewData

     this.ViewData["Filter"] = txtSearch.Text;

     // Notify the controller

     this.OnViewStateChanged("Search");

}

Search Controller

When creating the SearchController we will derive it from the Controller<TModel> and make an appropriate calls to the Products class:

public class SearchController : Controller<Products>

{

     public SearchController(IView<Products> view) : base(view)

     {

         // Create an intance of the Products

         Products products = new Products();

         // Populate the list

         products.PopulateList();

         // Assign the Model

         this.view.ViewData.Model = products;

         // Notify the view of the changes

         this.view.UpdateView("Products");

     }

     protected override void OnViewStateChanged(string key)

     {

         switch (key)

       {

             case "Search":

                  string filter = this.view.ViewData["Filter"].ToString();

  this.view.ViewData.Model.FilterData(filter);

                  // Notify the view of the updates

                  this.view.UpdateView("Products");

                  break;

            }

         }

      }

}

Download the project from here.

MVCDemoClient.zip

Comments

  • Anonymous
    October 14, 2008
    Your Mobile MVC framework looks great Alex! -Rob

  • Anonymous
    October 15, 2008
    Thanks, Rob :) -Alex

  • Anonymous
    October 15, 2008
    Excellent! When I read Part 1 I was wondering about support for strongly typed data, this is looking very cool. When I get some brain cycles free from looking for a job (don't get me started on the unemployment thing) I'll look at re-engineering my mobile blogging client (Diarist) to make use of it. I think Microsoft owes you a debt of thanks Alex for your many contributions to getting those of us who have been becoming disillisioned with the Compact Framework to stick with it.

  • Anonymous
    October 16, 2008
    Very nice Alex. Beautiful code.

  • Anonymous
    October 16, 2008
    Just for people who are not comfortable with passing strings when notifiying the view or the controller,

  • Anonymous
    October 20, 2008
    I see people asking "Who is the responsible for the controller instantiation?" I understand that there are no responsible for newing the controller in MVC. In the code Alex instantiates the SearchController from the Login controller, and that´s fine, the controller gets the control! Anyone here see imagine a example where we can only make that from the View?

  • Anonymous
    October 20, 2008
    AlexYakhnin在他的blog上发布了一系列关于WindowsMobileMVCFramework的文章.

  • Anonymous
    November 12, 2008
    Nestas coisas das teorias sobre a melhor forma de separar as diferentes camadas de uma aplicação, há