Putting the V in MVC
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Putting the V in MVC

on

  • 5,615 views

MVC gives us total control over markup in ASP.NET. Or in other words, you better learn how to turn HTML into something pretty. Luckily, there is a great framework to help us out: jQuery UI! We will ...

MVC gives us total control over markup in ASP.NET. Or in other words, you better learn how to turn HTML into something pretty. Luckily, there is a great framework to help us out: jQuery UI! We will take a look at using jQuery UI to do exactly that. We will start with simple HTML markup and transform it into interactive widgets with very little code. jQuery UI widgets add style and behavior to otherwise drab markup without changing its semantics. We will also look at Wijmo, a new toolkit that extends jQuery UI. Wijmo brings over 30 widgets to jQuery UI from Menus to SVG Charts, 18 of which are Open Source. Both jQuery UI and Wijmo can take your Views from boring to brilliant in ASP.NET MVC. After this session you will be ready to start putting the V in MVC!

Statistics

Views

Total Views
5,615
Views on SlideShare
2,069
Embed Views
3,546

Actions

Likes
0
Downloads
25
Comments
0

9 Embeds 3,546

http://wijmo.com 2527
http://banzor.us 936
http://localhost 58
http://www.banzor.us 7
http://www.banzor.us 7
http://translate.googleusercontent.com 4
http://stage.wijmo.com 4
http://webcache.googleusercontent.com 2
https://wijmo.com 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Putting the V in MVC Presentation Transcript

  • 1. Putting the V in MVC
    Using jQuery UI & Wijmo
  • 2. about:me
    Chris Bannon
    Product Manager
    @b4nn0n
    Hello!
  • 3. The Big V
    V stands for View
    It is the “Presentation Layer”
    Responsible for the UI
    Consists of HTML
    HTML rendered via HTML Helpers
  • 4. HTML Helpers
    “Help” us create HTML
    Provide Helpers for simple elements
    TextBoxes, HyperLinks, etc.
    In the end, they just return a String
    Complex HTML Helpers can get messy
    Menu, Grid, Tree, etc.
  • 5. “If only there were a way to turn simple HTML into a rich UI…”
    ?
  • 6. Enter jQuery UI
    Widget library
    Turns HTML into interactive UI
    As easy to use as jQuery
    Pre-themed with CSS
    Works in every browser
    Falls back to semantic HTML markup
    Easily apply animation effects
  • 7. “If only there were more of these awesome jQuery UI widgets…”

  • 8. Enter Wijmo
    Extends jQuery UI (not replaces it)
    Adds features to jQuery UI widgets
    Slider, Progressbar, etc.
    Adds new widgets to jQuery UI
    Grid, Charts, Tree, etc.
    Works in every browser (even IE6)
    Themeroller-ready
    As easy to use as jQuery
    HTML5, CSS3and SVG
  • 9. The Ultimate View
    Widgets
    HTML
    jQuery!
    CSS
    Java-Script
    HTML
  • 10. In Other Words
    $(“ul”).wijmenu();
  • 11. $(“code”).show();
  • 12. Benefits of “The Ultimate View”
    Take control over your markup
    Clean & lean HTML
    Maintainable markup
    Highly interactive UI
    Easily integrates jQuery.ajax()
    Themeroller support
  • 13. Resources
    Wijmo: http://wijmo.com
    jQuery: http://jquery.com
    jQueryUI: http://jqueryui.com
    Themeroller: http://jqueryui.com/themeroller/
    Me: http://twitter.com/b4nn0n
    Thanks!
  • 14. $(this).end();
    l8r!