Say Hello to Project jQMvc

After my previous post about jQuery Mobile and ASP.Net MVC, I found myself using jQM in a project. Now, it would be a shame if I didn’t share the goodies I built for MVC with jQM.

So, I give you Project jQMvc. Really, it’s a collection of HTMLHelper extensions that build on jQM. With jQMvc you’ll be able to build full HTML5 compatible and mobile ready views but with the lovely MVC behind it at all times. Let me show you some of the things it can do.

Lists, a lot of them

In the project there a several types of lists, with and without searching. Thanks to jQM, it’s a treat! And really useful.

The below code,

@using jQM
@model IEnumerable

@{
    ViewBag.Title = "Unordered List With Search";
}

@Html.UnorderedListWithSearchFilter(Model)

And a little bit of sauce from the controller will give you,

jQMvc List with Search Preview

Buttons, all sorts of them

@using jQM

@{
    ViewBag.Title = "Buttons";
}

@Html.ActionButton("Hi. I am a simple button.", "Index", "Home")

@Html.ActionButton("Hey! Look, I am a settings kind'a button.", "Index", "Home", ButtonIcon.gear)

@Html.ActionButton("Unlike others, I have route values.", "Router", "Home", new { id = "value" })

The code above will create a neat little stack of different kinds of button.

So that’s it for now. As the project grows, I will be sure to update with the neat things that will go into jQMvc.

Advertisements

2 Comments on “Say Hello to Project jQMvc”

  1. […] Say Hello to Project jQMvc – Kowsheek Mahmood shares a collection of HtmlHelper extension methods which help when building a jQuery Mobile web application using ASP.NET MVC […]

  2. […] for jQuery Say Hello to Project jQMvc « Code Trek Overview of oData Protocol for Windows Phone – CodeGuru YouTube – SRT Solutions presents […]


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s