This article does a great job at showing you a simple example of how to use local browser web storage in conjunction with ASP.NET web methods to save and retrieve the data from a server side database. Even if you aren’t interested in using this functionality in an application you have now, it’s worth reading to know what HTML5 brings to the table as far as storing your data down at the client.
Great article to check out!
Ajax-based data loading using jQuery.load() function in ASP.NET – Hajan Selmani takes a back to basics look at using jQuery to load partial chunks of HTML from a page using Ajax and insert them into the current page, providing a nice way of lighting up a web application with an ‘Ajax’ feel whilst easily maintaining non-ajax support.
I have been doing some work lately with jQuery, WCF, HTML5 and ASP.NET and it’s been actually pretty fun challenging and fun. I’ve gotten to tinker with quite a few new technologies that I hadn’t used before and really got to sink my teeth into jQuery and some of the cool new features that HTML5 has to offer (like local storage and offline capabilities).
When starting out with my recent project I had to pull from various resources to learn what these tools were capable of and how I could fit them all together. And while it doesn’t get into the HTML5 aspects of my project this article on creating a simple task list with ASP.NET, WCF and jQuery would have been very helpful to me in the beginning.
While the article is only Part 1 in a series, I think it will get you going in the right direction and will show you some of the power that you have on the client with the new jQuery data templates. I must say that with the introduction of these templates you can truly offload a large amount of your logic down to the client which will provide for a much better (and faster) user experience.
Anyway, check out the article. It’s short, to the point and offers the source code as a download too!
A while back I had a need to dynamically re-size an iFrame’s height and found a solution using a jQuery plug-in called autoHeight. What I later found was that this solution provided poor results with Internet explorer when my iFrame’s contents were fairly large and frequently changing (i.e. via navigation inside the iFrame).
It took quite a bit of tinkering but I was able to come up with a solution that works (and works well) in IE, Firefox, Safari and Chrome. It still uses jQuery but doesn’t depend on a plug-in. Here’s the code in case you’re looking for the same thing:
First, the iFrame…
<iframe src="Page1.htm" id="MyFrame" frameborder="0" marginheight="0" marginwidth="0" width="800px" height="100px" scrolling="no"></iframe> |
Next, the JavaScript to resize it…
<script type="text/javascript"> function sizeFrame() { jQuery("#MyFrame", top.document).css({ height: 0 }); var heightDiv = jQuery("#MyFrame", top.document).contents().find('body').attr('scrollHeight'); jQuery("#MyFrame", top.document).css({ height: heightDiv }); } jQuery(function() { sizeFrame(); jQuery("#MyFrame").load(sizeFrame); }); </script> |
This line is needed to initially initialize the height so that it works in Safari and Chrome. Without this line the window will never shrink to fit smaller content, it will just retain the last biggest height.
jQuery("#MyFrame", top.document).css({ height: 0 }); |
© 2013 Don Kitchen · Proudly powered by WordPress & Green Park 2 by Cordobo.
Valid XHTML 1.0 Transitional | Valid CSS 3
