jQuery UI Date Picker control issue with .Net
JavaScript error when target field is validated using a .Net control
Aye, I do whitter on about jQuery. It’s ace. The newly released jQuery UI is pretty special too. One of the many great widgets is the Date Picker control.
I build many .net applications that require date entry, so I implement the Date Picker control often. Unfortunately, there is a problem when it is used on a field that is validated using a .Net validation control. Upon clicking on a date, I get the following error:
length is null or not an object
This only occurs when using Internet Explorer. Currently, my only solution is to edit the source code. Locate the following code in jquery-ui.js or ui.datepicker.js:
inst._input.trigger('change')
Replace it with:
if (!$.browser.msie){inst._input.trigger('change')}
This prevents the change event firing in IE.
I wouldn’t normally advocate changing source code in this manner, as it makes future upgrades tedious. Hopefully it will be addressed in a future release.
Using jQuery selectors to reference .Net controls
Overcome the problem of ids rendered differently to those declared in your code
You place a control onto your page:
<asp:Content ID="Content1" ContentPlaceHolderID="Content" Runat="Server"> <asp:TextBox Id="Firstname" Runat="Server" /> </asp:Content>
The output is rendered as:
<input name="ctl00$Content$FirstName" type="text" id="ctl00_Content_FirstName" />In the example above, the disparity in the rendered id attribute occurs because the TextBox control has been placed within a Content control, as the Page object inherits a MasterPage.
So how can you robustly reference the control using client-side JavaScript, regardless where the control resides? Using jQuery it’s fairly trivial:
var $firstname = $("[id$=FirstName]");
This little snippet makes use of the jQuery attributeEndsWith selector, as documented here. Bare in mind that an array is returned, as any control with an id that ends in FirstName will be selected.
Consume .Net Web service using jQuery
Avoid using the Microsoft client library. Instead use jQuery.
The JavaScript functionality that is injected into .Net pages seems limited when compared to jQuery.
Whilst looking for a way to use jQuery instead of the stock Microsoft client library, I came across this excellent article.
There doesn’t seem to be too much on Web about this subject. Maybe most .Net developers stick to Microsoft tools, but I like using jQuery for all my client scripting, and would rather not use more than one library. So as it look me a while to get example code working, I’ve included my efforts.
CodeIgniter and Ajax
Using jQuery to manipulate data returned by controller method
I’ve been asked to create a dashboard for many devices across our network. To display real-time information on each component, I’m thinking of using Web services, and AJAX. Like most aspects of coding, using a framework to do all the heavy lifting, rather than developing your own, is a sensible approach.
So today I took a look at jQuery, a JavaScript framework. I have to admit, I’m pretty impressed. It did not take me long to come up with some example code, that degrades well when JavaScript is disabled in the browser.