25 June, 2010

Save and Display YouTube Videos on ASP.NET Website

Save and Display YouTube Videos on ASP.NET Website: "
About two months ago, a member in the asp.net forums asked a question
regarding similar issue. For this purpose, I have prepared short article that
shows how you can achieve this using ASP.NET Repeater (or similar) control, a
database table with three columns and few code-lines to make this work.

As we already know, YouTube shares the HTML <object /> which can be
embedded in any web site by simple copy/paste of the html for each video
file.

A sample example of the html for embedding YouTube video is as follows


   1: <object width='640' height='385'>
   2: <param name='movie' value="http://www.youtube.com/v/jpiU5Y8luOQ&hl=en_US&fs=1&"></param>
   3: <param name='allowFullScreen' value='true'></param>
   4: <param name='allowscriptaccess' value='always'></param>
   5: <embed src="http://www.youtube.com/v/jpiU5Y8luOQ&hl=en_US&fs=1&" 
   6:        type='application/x-shockwave-flash' 
   7:        allowscriptaccess='always' 
   8:        allowfullscreen='true' 
   9:        width='640' 
  10:        height='385'>
  11: </embed>
  12: </object>

There are three standard <params> and the embed tag which is important
to make this work properly. Anyway, you should not concern much about this
because you will use a standard format of this HTML object example that will be
generated automatically in your website. You should pay attention a bit more on
the format of the YouTube URL link, which is as follows:

http://www.youtube.com/v/<video-file-id>&hl=en_US&fs=1

where hl is the hosted language and
fs if is 1 will allow the full screen button
to shows up, 0 will disallow.

We can leave the hl and fs query string
parameters by default. The only part in the url string we should care about is
the <video-file-id>.

Someone would ask, why paying attention to the ID of the video, when user can
simply paste the link in a ASP.NET text box and just display it as it is. Well,
the problem is that user can enter url while he/she was searching in related
items or even in different cases when the youtube link does not have the same
format, which cannot be embedded as it is, so we need to get the video id and
put it in a url link with standard format. Usually, the URLs instead of showing
/v/<video-id>, these are shown as v=<video-id> which does not show
correctly the video link when embedded to the html object shown previously.


Let’s start with the ASP.NET part.

First of all, drag and drop ASP.NET Repeater control from the Data Controls.
Also you will need SqlDataSource, but of course, you may use any other data
sources or even bind the data control even programmatically in code-behind.

Here is the sample ASPX code I have created so far:
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id='Head1' runat="server">
<title></title>
</head>
<body>
<form id='form1' runat="server">
<div>
<asp:TextBox ID='TextBox1' runat='server' Width="461px"></asp:TextBox>
<asp:Button ID='btnAddLink'
runat='server' Text='Add Link' onclick="btnAddLink_Click" />           
</div>
<asp:Repeater ID='Repeater1' runat='server' DataSourceID="SqlDataSource1">
<ItemTemplate>
<object width='480' height="385"><param name='movie'
 value='<%#DataBinder.Eval(Container.DataItem, 'url') %>'></param>
<param name='allowFullScreen' value="true"></param>
<param name='allowscriptaccess' value="always"></param>
<embed src='<%#DataBinder.Eval(Container.DataItem, 'url') %>' type='application/x-shockwave-flash' 
 allowscriptaccess='always' allowfullscreen='true' width='480' height="385">
</embed>
</object>
<br />   
</ItemTemplate>
</asp:Repeater>
<asp:SqlDataSource ID='SqlDataSource1' runat='server'
ConnectionString='<%$ ConnectionStrings:MySampleDBConnectionString %>'
SelectCommand="SELECT [url], [description], [id] FROM [YouTubeVideos]">
</asp:SqlDataSource>
</form>
</body>
</html>


Short explanation:

1. I have created one TextBox which will be used to enter the YouTube URL
link (in any format which comes from the YouTube video service)
2. Button
which will be used for inserting the link into database.
3. There is
Repeater control with ItemTemplate containing the HTML tags for embedding the
video with <%# DataBinder.Eval(Container.DataItem, “url”) %> which will
contain the URL tag retrieved from database.
4. SqlDataSource with
ConnectionString pointing to MS SQL Server database where connection string is
in the Web.config file. You can create new connection string using the
SqlDataSource Wizards or by typing it manually (if you are experienced to do
that so).

If you have noticed in the SqlDataSource, there is a SelectCommand which
selects three columns ([url], [description] and [id]) from table with name
[YouTubeVideos]. Here is the SQL Script to create the sample database table
which I am using in this article:
CREATE TABLE YouTubeVideos --creates table where we will save YouTube Videos
(
id int not null primary key identity(1,1),
url varchar(1000) not null,
[description] text
)



The last thing, which we always leave it for the end, is the C#.NET /
VB.NET code.



Here we have the code behind the Add Link Button click event, method to
extract the ID of the video using Regular Expression and method to check for
Duplicate videos in DB.

First, do not forget to add the following directives
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
using System.Text.RegularExpressions;


- Function to get the YouTube Video ID

private string GetYouTubeID(string youTubeUrl)
{
//RegEx to Find YouTube ID
Match regexMatch = Regex.Match(youTubeUrl, '^[^v]+v=(.{11}).*',
RegexOptions.IgnoreCase);
if (regexMatch.Success)
{
return 'http://www.youtube.com/v/' + regexMatch.Groups[1].Value +
"&hl=en&fs=1";
}
return youTubeUrl;
}

I have found this method on the following website: here

The code behind the Add Link button click event is as follows:
protected void btnAddLink_Click(object sender, EventArgs e)
{
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings['MySampleDBConnectionString'].ToString());
string url = TextBox1.Text;
if (url.Contains('youtube.com'))
{
string ytFormattedUrl = GetYouTubeID(url);

if (!CheckDuplicate(ytFormattedUrl))
{
SqlCommand cmd = new SqlCommand('INSERT INTO YouTubeVideos ([url]) VALUES ('' + ytFormattedUrl + '')', con);
using (con)
{
con.Open();
int result = cmd.ExecuteNonQuery();
if (result != -1)
{
Repeater1.DataBind();
}
else { Response.Write('Error inserting new url!'); }
}
}
else { Response.Write('This video already exists in our database!'); }
}
else
{
Response.Write('This URL is not a valid YOUTUBE video link because it does not contain youtube.com in it');
}
}

and at end, I have created method to check whether the video exists or
not
public bool CheckDuplicate(string youTubeUrl)
{
bool exists = false;
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings['MySampleDBConnectionString'].ToString());           
SqlCommand cmd = new SqlCommand(String.Format('select * from YouTubeVideos where url='{0}'',youTubeUrl), con);

using (con)
{
con.Open();
SqlDataReader dr = cmd.ExecuteReader();
dr.Read();
exists = (dr.HasRows) ? true : false;               
}

return exists;
}

Mainly, thats it.

You can format the apperance of the html inside the Repeater control, which
is very flexible for customized HTML.
Download the complete source code:
C#.NET or VB.NET

[Cool Tool] Assembly minifier tool

[Cool Tool] Assembly minifier tool: "
If you are using Silverlight controls from the Telerik suite, you’re going to love this.
Telerik provide a new free tool to help reduce the size of your Silverlight xap. The Telerik Assembly Minifier can be found here:
http://minifier.telerik.com/
From the website: “Telerik Assembly Minifier is a tool that lets you extract only the controls’ classes and resources you need to use in your application development, thus significantly reducing the size of the assemblies. Using the Assembly Minifier you will achieve significantly better loading time when the Silverlight XAP files containing the minified (optimized) assemblies are to be loaded on the client side.”
Note: this apply to Telerik assemblies only (for now).

I decided to give it a try and create a fresh new Silverlight 4 app then insert a Telerik GridView in a page. VS automatically adds reference to these assemblies:
  • Telerik.Windows.Data.dll
  • Telerik.Windows.Controls.Input.dll
  • Telerik.Windows.Controls.GridView.dll
  • Telerik.Windows.Controls.dll

That’s 645KB (compressed) added in your xap file, ouch!

Now let’s add a CoverFlow and a Scheduler controls in my app. This adds 2 more assemblies in the resulting xap:
  • Telerik.Windows.Controls.Scheduler.dll
  • Telerik.Windows.Controls.Navigation.dll

That’s an additional 413KB in the xap.

At that point my xap file is 1.2MB, and my app is quite empty, most of the size is coming from the Telerik assemblies. Great features comes with a price, right ?

Now let’s try the Assembly Minifier tool.
Go to http://minifier.telerik.com/ and upload the Telerik assemblies used in your app.

Then I select the controls to be extracted (GridView, CoverFlow and Scheduler here):

Now I can click on the “Extract” button to download the compressed assemblies and reference them in my app (I removed the originals first).
After recompiling my xap is now 845KB, that’s 32% off.
So finally for my very specific test (empty Silverlight 4 app with 3 Telerik controls: GridView, CoverFlow and Scheduler) I get this result:
xap file size
Before
After
1.2MB
845KB
[32% gain]
Overall this is good, as always Telerik innovate in new tools and it’s nice to see them answering concern like xap files size. But to me the whole process to manually choose your controls and manually upload and manually replace dll is totally inefficient for now. The tool is still beta (and free!) so I do not complain, I just hope to see more features and a better integration in VS later. In a perfect world a VS add-in would do the job automatically when I build in release mode.
Note the tool is working properly, but the way to replace your dll in VS is not (always grab the old replaced dll). You can find some tips to fix it but it is definitely painful for now. Hope VS will provide an easier way to handle this in the future, or maybe Telerik to create a VS addin or something...
Waiting for that you’ll find great help here:
http://www.telerik.com/community/forums/silverlight/assembly-minifier.aspx
"

24 June, 2010

Testing Email Sending

Testing Email Sending: "
Recently I learned a couple of interesting things related to sending emails. One doesnt relate to .NET at all, so if youre a developer and you want to easily be able to test whether or not emails are working correctly in your application without actually sending them and/or installing a real SMTP server on your machine, pay attention. You can grab the smtp4dev application from codeplex, which will listen for SMTP emails and log them for you (and will even pop-up from the system tray to notify you when it receives them) but it will never send them. Heres what the notification looks like:
image
The other interesting tidbit about emails that is specific to .NET is that the MailMessage class is IDisposable. I never realized that before, but I noticed it while reading through the Ben Watsons C# 4 How To book I picked up at TechEd last week (which is done cookbook style and has a ton of useful info in it). Looking at the MailMessages Dispose() method in Reflector reveals that it only really matters if youre working with AlternateViews or Attachments (this.bodyView is also of type AlternateView):
image
All the same, you should get in the habit of wrapping your calls to MailMessage in a using() { } block. Heres some sample code showing how I would typically work with MailMessage:
Bad Example (dont cut and paste and use):
string fromAddress = "nobody@somewhere.com";



string toAddress = "somebody@somewhere.com";



string subject = "Test Message from IDisposable";



string body = "This is the body.";



var myMessage = new MailMessage(fromAddress, toAddress, subject, body);






var myClient = new SmtpClient("localhost");



myClient.Send(myMessage);




And heres how that code would look once its properly set up using IDisposable / using:


Good Example (use this one!):




string fromAddress = "nobody@somewhere.com";



string toAddress = "somebody@somewhere.com";



string subject = "Test Message from IDisposable";



string body = "This is the body.";






using(var myMessage = new MailMessage(fromAddress, toAddress, subject, body))



using(var myClient = new SmtpClient("localhost"))



{



myClient.Send(myMessage);                



}






Note also that SmtpClient is also IDisposable, and that you can stack your using() statements without introducing extra { } when you have instances where you need to work with several Disposable objects (like in this case).


Note that if you run Code Analysis in VS2010 (not sure which version you have to have right click on a project in your solution explorer and look for Analyze Code) you will get warnings for any IDisposable classes youre using outside of using statements, like these:


image




Summary


Sometimes things you dont expect to be Disposable are. Its good to run some code analysis tools from time to time to help find things like this. Visual studio has some nice static analysis built into some versions, or you can use less expensive tools like Fx Cop or Nitriq.

16 June, 2010

How to Answer a Stupid Interview Question the Right Way

How to Answer a Stupid Interview Question the Right Way: " By

Have you ever been asked a stupid question during an interview; one that seemed to have no relation to the job responsibilities at all? Tech people are often caught off-guard by these apparently irrelevant questions, but there is a way you can turn these to your favor. Here is one idea.

While chatting with a couple of folks between sessions at SQLSaturday 43 last weekend, one of them expressed frustration over a seemingly ridiculous and trivial question that she was asked during an interview, and she believes it cost her the job opportunity. The question, as I remember it being described was, “What is the largest byte measurement?”. The candidate made up a guess (“zetabyte”) during the interview, which is actually closer than she may have realized. According to Wikipedia, there is a measurement known as zettabyte which is 10^21, and the largest one listed there is yottabyte at 10^24.

My first reaction to this question was, “That’s just a hiring manager that doesn’t really know what they’re looking for in a candidate. Furthermore, this tells me that this manager really does not understand how to build a team.” In most companies, team interaction is more important than uber-knowledge. I didn’t ask, but this could also be another geek on the team trying to establish their Alpha-Geek stature. I suppose that there are a few, very few, companies that can build their businesses on hiring only the extreme alpha-geeks, but that certainly does not represent the majority of businesses in America.

My friend who was there suggested that the appropriate response to this silly question would be, “And how does this apply to the work I will be doing?” Of course this is an understandable response when you’re frustrated because you know you can handle the technical aspects of the job, and it seems like the interviewer is just being silly. But it is also a direct challenge, which may not be the best approach in interviewing. I do have to admit, though, that there are those folks who just won’t respect you until you do challenge them, but again, I don’t think that is the majority.

So after some thought, here is my suggestion: “Well, I know that there are petabytes and exabytes and things even larger than that, but I haven’t been keeping up on my list of Greek prefixes that have not yet been used, so I would have to look up the exact answer if you need it. However, I have worked with databases as large as 30 Terabytes. How big are the largest databases here at X Corporation?” Perhaps with a follow-up of, “Typically, what I have seen in companies that have databases of your size, is that the three biggest challenges they face are: A, B, and C. What would you say are the top 3 concerns that you would like the person you hire to be able to address?…Here is how I have dealt with those concerns in the past (or ‘Here is how I would tackle those issues for you…’).”

Wait! What just happened?! We took a seemingly irrelevant and frustrating question and turned it around into an opportunity to highlight our relevant skills and guide the conversation back in a direction more to our liking and benefit. In more generic terms, here is what we did:

  1. Admit that you don’t know the specific answer off the top of your head, but can get it if it’s truly important to the company. Maybe for some reason it really is important to them.
  2. Mention something similar or related that you do know, reassuring them that you do have some knowledge in that subject area.
  3. Draw a parallel to your past work experience.
  4. Ask follow-up questions about the company’s specific needs and discuss how you can fulfill those.

This type of thing requires practice and some forethought. I didn’t come up with this answer until a day later, which is too late when you’re interviewing. I still think it is silly for an interviewer to ask something like that, but at least this is one way to spin it to your advantage while you consider whether you really want to work for someone who would ask a thing like that. Remember, interviewing is a two-way process. You’re deciding whether you want to work there just as much as they are deciding whether they want you.

There is always the possibility that this was a calculated maneuver on the part of the hiring manager just to see how quickly you think on your feet and how you handle stupid questions. Maybe he knows something about the work environment and he’s trying to gauge whether you’ll actually fit in okay. And if that’s the case, then the above response still works quite well.

14 June, 2010

jQuery Globalization Plugin from Microsoft

jQuery Globalization Plugin from Microsoft: " By Scott from ASP.Net Weblogs

Last month Scott blogged about how Microsoft is starting to make code contributions to jQuery, and about some of the first code contributions Microsoft working on: jQuery Templates and Data Linking support.
On June 11, Microsoft released a prototype of a new jQuery Globalization Plugin that enables you to add globalization support to your JavaScript applications. This plugin includes globalization information for over 350 cultures ranging from Scottish Gaelic, Frisian, Hungarian, Japanese, to Canadian English.  We will be releasing this plugin to the community as open-source.
You can download our prototype for the jQuery Globalization plugin from our Github repository:
http://github.com/nje/jquery-glob
You can also download a set of samples that demonstrate some simple use-cases with it here.

Understanding Globalization

The jQuery Globalization plugin enables you to easily parse and format numbers, currencies, and dates for different cultures in JavaScript. For example, you can use the Globalization plugin to display the proper currency symbol for a culture:
image
You also can use the Globalization plugin to format dates so that the day and month appear in the right order and the day and month names are correctly translated:
image
Notice above how the Arabic year is displayed as 1431. This is because the year has been converted to use the Arabic calendar.
Some cultural differences, such as different currency or different month names, are obvious. Other cultural differences are surprising and subtle. For example, in some cultures, the grouping of numbers is done unevenly. In the "te-IN" culture (Telugu in India), groups have 3 digits and then 2 digits. The number 1000000 (one million) is written as "10,00,000". Some cultures do not group numbers at all. All of these subtle cultural differences are handled by the jQuery Globalization plugin automatically.
Getting dates right can be especially tricky. Different cultures have different calendars such as the Gregorian and UmAlQura calendars. A single culture can even have multiple calendars. For example, the Japanese culture uses both the Gregorian calendar and a Japanese calendar that has eras named after Japanese emperors. The Globalization Plugin includes methods for converting dates between all of these different calendars.

Using Language Tags

The jQuery Globalization plugin uses the language tags defined in the RFC 4646 and RFC 5646 standards to identity cultures (see http://tools.ietf.org/html/rfc5646). A language tag is composed out of one or more subtags separated by hyphens. For example:
Language Tag Language Name (in English)
en-AU English (Australia)
en-BZ English (Belize)
en-CA English (Canada)
Id Indonesian
zh-CHS Chinese (Simplified) Legacy
Zu isiZulu
Notice that a single language, such as English, can have several language tags. Speakers of English in Canada format numbers, currencies, and dates using different conventions than speakers of English in Australia or the United States.  You can find the language tag for a particular culture by using the Language Subtag Lookup tool located here:  http://rishida.net/utils/subtags/
The jQuery Globalization plugin download includes a folder named globinfo that contains the information for each of the 350 cultures. Actually, this folder contains more than 700 files because the folder includes both minified and un-minified versions of each file.
For example, the globinfo folder includes JavaScript files named jQuery.glob.en-AU.js for English Australia, jQuery.glob.id.js for Indonesia, and jQuery.glob.zh-CHS for Chinese (Simplified) Legacy.

Example: Setting a Particular Culture

Imagine that you have been asked to create a German website and want to format all of the dates, currencies, and numbers using German formatting conventions correctly in JavaScript on the client. The HTML for the page might look like this:
image
Notice the span tags above. They mark the areas of the page that we want to format with the Globalization plugin. We want to format the product price, the date the product is available, and the units of the product in stock.
To use the jQuery Globalization plugin, we’ll add three JavaScript files to the page: the jQuery library, the jQuery Globalization plugin, and the culture information for a particular language:
image
In this case, I’ve statically added the jQuery.glob.de-DE.js JavaScript file that contains the culture information for German. The language tag “de-DE” is used for German as spoken in Germany.
Now that I have all of the necessary scripts, I can use the Globalization plugin to format the product price, date available, and units in stock values using the following client-side JavaScript:
image
The jQuery Globalization plugin extends the jQuery library with new methods - including new methods named preferCulture() and format(). The preferCulture() method enables you to set the default culture used by the jQuery Globalization plugin methods. Notice that the preferCulture() method accepts a language tag. The method will find the closest culture that matches the language tag.
The $.format() method is used to actually format the currencies, dates, and numbers. The second parameter passed to the $.format() method is a format specifier. For example, passing “c” causes the value to be formatted as a currency. The ReadMe file at github details the meaning of all of the various format specifiers: http://github.com/nje/jquery-glob
When we open the page in a browser, everything is formatted correctly according to German language conventions. A euro symbol is used for the currency symbol. The date is formatted using German day and month names. Finally, a period instead of a comma is used a number separator:
image
You can see a running example of the above approach with the 3_GermanSite.htm file in this samples download.

Example: Enabling a User to Dynamically Select a Culture

In the previous example we explicitly said that we wanted to globalize in German (by referencing the jQuery.glob.de-DE.js file). Let’s now look at the first of a few examples that demonstrate how to dynamically set the globalization culture to use.
Imagine that you want to display a dropdown list of all of the 350 cultures in a page. When someone selects a culture from the dropdown list, you want all of the dates in the page to be formatted using the selected culture.
image
Here’s the HTML for the page:
image
Notice that all of the dates are contained in a <span> tag with a data-date attribute (data-* attributes are a new feature of HTML 5 that conveniently also still work with older browsers). We’ll format the date represented by the data-date attribute when a user selects a culture from the dropdown list.
In order to display dates for any possible culture, we’ll include the jQuery.glob.all.js file like this:
image
The jQuery Globalization plugin includes a JavaScript file named jQuery.glob.all.js. This file contains globalization information for all of the more than 350 cultures supported by the Globalization plugin.  At 367KB minified, this file is not small. Because of the size of this file, unless you really need to use all of these cultures at the same time, we recommend that you add the individual JavaScript files for particular cultures that you intend to support instead of the combined jQuery.glob.all.js to a page. In the next sample I’ll show how to dynamically load just the language files you need.
Next, we’ll populate the dropdown list with all of the available cultures. We can use the $.cultures property to get all of the loaded cultures:
image
Finally, we’ll write jQuery code that grabs every span element with a data-date attribute and format the date:
image
The jQuery Globalization plugin’s parseDate() method is used to convert a string representation of a date into a JavaScript date. The plugin’s format() method is used to format the date. The “D” format specifier causes the date to be formatted using the long date format.
And now the content will be globalized correctly regardless of which of the 350 languages a user visiting the page selects.  You can see a running example of the above approach with the 4_SelectCulture.htm file in this samples download.

Example: Loading Globalization Files Dynamically

As mentioned in the previous section, you should avoid adding the jQuery.glob.all.js file to a page whenever possible because the file is so large. A better alternative is to load the globalization information that you need dynamically.
For example, imagine that you have created a dropdown list that displays a list of languages:
image
The following jQuery code executes whenever a user selects a new language from the dropdown list. The code checks whether the globalization file associated with the selected language has already been loaded. If the globalization file has not been loaded then the globalization file is loaded dynamically by taking advantage of the jQuery $.getScript() method.
image
The globalizePage() method is called after the requested globalization file has been loaded, and contains the client-side code to perform the globalization.
The advantage of this approach is that it enables you to avoid loading the entire jQuery.glob.all.js file. Instead you only need to load the files that you need and you don’t need to load the files more than once.
The 5_Dynamic.htm file in this samples download demonstrates how to implement this approach.

Example: Setting the User Preferred Language Automatically

Many websites detect a user’s preferred language from their browser settings and automatically use it when globalizing content. A user can set a preferred language for their browser. Then, whenever the user requests a page, this language preference is included in the request in the Accept-Language header.
When using Microsoft Internet Explorer, you can set your preferred language by following these steps:
  1. Select the menu option Tools, Internet Options.
  2. Select the General tab.
  3. Click the Languages button in the Appearance section.
  4. Click the Add button to add a new language to the list of languages.
  5. Move your preferred language to the top of the list.
image
Notice that you can list multiple languages in the Language Preference dialog. All of these languages are sent in the order that you listed them in the Accept-Language header:
Accept-Language: fr-FR,id-ID;q=0.7,en-US;q=0.3
Strangely, you cannot retrieve the value of the Accept-Language header from client JavaScript. Microsoft Internet Explorer and Mozilla Firefox support a bevy of language related properties exposed by the window.navigator object, such as windows.navigator.browserLanguage and window.navigator.language, but these properties represent either the language set for the operating system or the language edition of the browser. These properties don’t enable you to retrieve the language that the user set as his or her preferred language.
The only reliable way to get a user’s preferred language (the value of the Accept-Language header) is to write server code. For example, the following ASP.NET page takes advantage of the server Request.UserLanguages property to assign the user’s preferred language to a client JavaScript variable named acceptLanguage (which then allows you to access the value using client-side JavaScript):
image
In order for this code to work, the culture information associated with the value of acceptLanguage must be included in the page. For example, if someone’s preferred culture is fr-FR (French in France) then you need to include either the jQuery.glob.fr-FR.js or the jQuery.glob.all.js JavaScript file in the page or the culture information won’t be available.  The “6_AcceptLanguages.aspx” sample in this samples download demonstrates how to implement this approach.
If the culture information for the user’s preferred language is not included in the page then the $.preferCulture() method will fall back to using the neutral culture (for example, using jQuery.glob.fr.js instead of jQuery.glob.fr-FR.js). If the neutral culture information is not available then the $.preferCulture() method falls back to the default culture (English).

Example: Using the Globalization Plugin with the jQuery UI DatePicker

One of the goals of the Globalization plugin is to make it easier to build jQuery widgets that can be used with different cultures.
We wanted to make sure that the jQuery Globalization plugin could work with existing jQuery UI plugins such as the DatePicker plugin. To that end, we created a patched version of the DatePicker plugin that can take advantage of the Globalization plugin when rendering a calendar. The following image illustrates what happens when you add the jQuery Globalization and the patched jQuery UI DatePicker plugin to a page and select Indonesian as the preferred culture:
image
Notice that the headers for the days of the week are displayed using Indonesian day name abbreviations. Furthermore, the month names are displayed in Indonesian.
You can download the patched version of the jQuery UI DatePicker from our github website. Or you can use the version included in this samples download and used by the 7_DatePicker.htm sample file.