Search
Blogging from Sydney | Australia
Some past thoughts
« Electronic Voting's Issues | Main | Google Wave killed to focus on the Aussie NBN? »
Saturday
Sep252010

jQuery - Freedom?!

Yes it should have been discovered sooner. But now that it has been...jQuery+jQueryUI is sheer brilliance.

I can immediately see this freeing me from the demands of stakeholders - I can just give them the ThemeRoller tool (since like most developers, I tend to have a terrible sense of UI design) and tell them to choose how they want the site to look and get them to send me the URL or files back. (Of course the hard part has always been getting the site to work and keeping it alive and secured from DDoS/XSS/CSRF and other attacks, but now I don't have to worry about things like the style of datepickers!)

So why is it so good? Simply put - an excellent pluggable framework for Javascript that unlocks the power of JS, gives the developer great flexibility, and provides better cross-browser support than I probably ever could!

An example related to my current work, building an ASP.NET MVC2 site on .NET 3.5 (c'mon people, .NET 4.0 has been out for a while now).

All I need to do is include in the Site.Master file something like:

<link href="<%= Url.Content("~/Content/jquery-ui-1.8.5.custom.css")%>" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery-1.4.2.min.js") %>"></script>

<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery-ui-1.8.5.custom.min.js")%>"></script>

obviously the actual URLs may be different depending on your project setup, the above come out to something like ../../Scripts/jquery-1.4.2.min.js, but that depends on the context of the request.

Whenever the stakeholders decide to redesign part of the site - it's update 3 files/references and voila! Whenever performance and security fixes come down the pipeline, same quick update! And in web development, it's all about taking DRY to the limit =)

So for an actual example, let's try making a datepicker:

  1. Add the javascript for the datepicker itself, for a basic Aussie date format:

    <script type="text/javascript">
      $(document).ready(function () {
          $(".datepicker").datepicker({
              dateFormat: 'dd/mm/yy',
        });
    });
    </script>

  2. Add the "datepicker" class to the relevant div or input type="text" area

    <input type="text" id="releaseDate" class="datepicker"/>


Of course for full details of what's possible, see the jQuery DatePicker page. http://docs.jquery.com/UI/Datepicker

But remember I said ASP.NET MVC2 ?
That's something like (simplified):

<div class="editor-field">
       <%: Html.TextBoxFor(model => model.Title) %>
</div>

i.e. using auto-generated view code (literally right-click on a controller ActionResult and click "Add View") which uses lambda expressions to reference model attributes, or something like that.

The key point is MVC2 abstracts the HTML using the built-in (and extensible) HTML helper classes. Seems like it's time to write one of those to take advantage of jQuery!

Update 5:29PM - An excellent post by Steve Michelotti covers this very well:
http://geekswithblogs.net/michelotti/archive/2010/02/05/mvc-2-editor-template-with-datetime.aspx

References (17)

References allow you to track sources for this article, as well as articles that were written in response to this article.
  • Response
    An exceptionally wonderful writing. We're truly grateful for your writing. You will discover lots of strategies after viewing ones post. My spouse and i ended up being accurately looking for. Thank you regarding such post along with make sure you thanks. Good do the job It was surely interesting personally to ...
  • Response
    Response: essay proof reader
    JQuery - Freedom is for me something quite new, but it is also interesting. These blogs are worthy of attention. Thank you.
  • Response
    Response: vimax bohong
    Peter Schmidt - Blog - jQuery - Freedom?!
  • Response
    Response: amazon.com
    This is a great motivational thing I must look out for. Thanks for the share.
  • Response
    Peter Schmidt - Blog - jQuery - Freedom?!
  • Response
    Response: UK Models Review
    Peter Schmidt - Blog - jQuery - Freedom?!
  • Response
    I am slanted to learn jquery is a direct result of its effortlessness. In j Query the library is alluded either by .js document exhibit in your undertaking envelope. I would love to incorporate the blocksit.js which truly deals with the HTML components into squares and presents them into a decently ...
  • Response
    Response: necklaces
    Peter Schmidt - Blog - jQuery - Freedom?!
  • Response
    I am so much happy because of the blog is providing very helpful information to all the viewers. Many people are using to improve the good education and improve writing skills also.
  • Response
    It's really not an easy task to run this language in all kinds of applications. I must thank you for your brief explanation. I really feel a bit difficult in running the script when it shows many errors. For all kinds of business platforms Enterprise Resource Planning (ERP) Software System is ...
  • Response
    This is the reason that better education an able the person to adjust with environment and solve the problem of life. And we see that an educated person lead a better and happy life than uneducated or illiterate people, because he know that how to face the issue of the practical ...
  • Response
    http://7659.refinancemortgage.science/
  • Response
    Jquery form is the most moving and sophisticated programming which is been using now widely in every projects by organizations. It's a pleasuer to gothrough here the script and the description. Being a learner i follow each of the instruction here and make my project possible.
  • Response
    Response: Hraz
    Strong blog. I acquired several nice info. I?ve been keeping a watch on this technology for a few time. It?utes attention-grabbing the method it retains totally different, however many of the primary components remain a similar. have you observed a lot change since Search engines created their own latest purchase in ...
  • Response
    I found a great...
  • Response
    I found a great...
  • Response
    Response: Trisha Tenerife
    Trisha Tenerife

Reader Comments

There are no comments for this journal entry. To create a new comment, use the form below.

PostPost a New Comment

Enter your information below to add a new comment.

My response is on my own website »
Author Email (optional):
Author URL (optional):
Post:
 
Some HTML allowed: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>