24 November 2008

jQuery

jQuery is a lightweight open source java-script library (only 15kb in size) that in a relatively short span of time has become one of the most popular libraries on the web.

A big part of the appeal of jQuery is that it allows you to elegantly (and efficiently) find and manipulate HTML elements with minimum lines of code. jQuery supports this via a nice "selector" API that allows developers to query for HTML elements, and then apply "commands" to them. One of the characteristics of jQuery commands is that they can be "chained"
together - so that the result of one command can feed into another. jQuery also includes a built-in set of animation APIs that can be used as commands. The combination allows you to do some really cool things with only a few keystrokes.

For example, the below java-script uses jQuery to find all <div> elements within a page that have a CSS class of "product", and then animate them to slowly disappear:

$("div.product").slideUp('slow').addClass("removed");


As another example, the java-script below uses jQuery to find a specific <table> on the page with an id of "datagrid1", then retrieves every other <tr> row within the datagrid, and sets those <tr> elements to have a CSS class of "even" - which could be used to alternate the background color of each row:


$("#datagrid1 tr:nth-child(even)").addClass("even");


[Note: both of these samples were adapted from code snippets in the excellent jQuery in Action book]

Providing the ability to perform selection and animation operations like above is something that a lot of developers have been begging for years. Such simplicity has never been offered before by any other development environment or library.

As a result even Microsoft has accepted this technology and they have already began shipping their Visual Studio 2008 package with jQuery preinstalled and with full support for it including intellisense. According to Scott Gu (Microsoft Developer, Blogger) - Microsoft is even working on adding new features and bug fixes to the jQuery Library.

22 November 2008

How to Set MaxLength of a Multiline TextBox

Ever tried setting up the maxlength property of a ASP.NET Multiline TextBox and ended up finding out that its doesn't work at all!! HEre's a simple solution using Javascript..
You can use the below script to set up the maxlength of a Multiline TextBox or even a HTML TextArea Tag:

<script type="text/javascript" language="javascript">

function ismaxlength(obj){
var mlength=obj.getAttribute? parseInt(obj.getAttribute("maxlength")) : ""
if (obj.getAttribute && obj.value.length>mlength)
obj.value=obj.value.substring(0,mlength)
}
</script>

Inside any textarea you wish to add a "maxlength" attribute to, simply do the following:

<textarea maxlength="40" onkeyup="return ismaxlength(this)" ></textarea>
or
<asp:TextBox ID="txt1" runat="server" maxlength="40" onkeyup="return ismaxlength(this)" />

The part in green is what you should add, with "40" obviously being the maximum number of characters accepted by this textarea.
Note: In ASP.NET setting up the maxlength might not work. Hence you should replace the textbox with a textarea and run it as a server control using runat="server"

21 November 2008

Hide/Show Div Elements Using JavaScript

JavaScript can be used to bring interactivity to you web pages by performing client side scripting. Using the style property of an HTML element, the element can be hidden or shown to the user based upon the required condition. For Example:

<script>
function setDiv(id)
{
if(document.getElementById(id).value==0)
{
document.getElementById('myDiv').style.display='none';
}
else
{

document.getElementById('myDiv').style.display='block';
}
}
</script>

This function can be called on any event of another HTML element as:

<select id="mySelect" name="mySelect" onchange="setDiv(this.id)">
<option>Select one</option>
<option value="0">Hide</option>
<option value="1">Show</option>
</select>

<div id="myDiv" name="myDiv" style="display:none;">
<span>Hi......!!!!!!! </span>
</div>

You can place any thing inside the myDiv element. Further more buy using some jQuery you can even add some animation effects.

18 November 2008

Using T-SQL to Simplify Coding

A sign of a good web developer is determined by his knowledge of SQL. Generally speaking if you know SQL well (be it SQL Server or MySQL) chances are that most of your coding will be reduced dramatically saving you lots of time and also increasing website performance.
Take for example if you wanted to change the status of a registered user from Active to De active or vice verse on the click of a single button and you are using a int field for it in the database( 0 and 1). Now as a novice what I used to do is run a SELECT query and get the user status field. Then compare the status in client side scripting language, and then again run a Update query to change the user status.
But as i studied more on SQL i found out that this could be done just by using a single query/stored procedure and only passing the id of the user to the query as follows(for SQL Server):

Create Procedure changeStatus
@ID integer
BEGIN
Declare @status integer
Select @status= status from UserTable where UserId=@ID
if @status=1
Update UserTable set status=0 where UserId=@ID
ELSE
Update UserTable set status=1 where UserId=@ID
END
END

So you see this has saved me a lot of time and coding. Also modification also becomes easy. Hence if you still think that SQL knowledge is not that important for Development; its time to wake up and brush up on YOUR SQL SKILLS!!!!!!

15 November 2008

What is Web 2.0?

Ever since i started with Web Development, I have been constantly coming across this WEB2.0 word..be it websites, blogs or online pop ups. I neglected it for a long time until finally decided to read about it.
Well here's a few things i found out about WEB 2.0
1. Its not a technology or Web Standard. It's just a way of how new Web Applications are developed.
2. Most of the Web 2.0 buzz has been related to Google Technology as its constantly making big progress towards making Web Applications more and more like desktop apps.
3.Web 2.0 is quite an old term and has been regularly re-phrased.
4. Use of technology such as AJAX, Silverlight, Flash etc.
They have some good stuff written about WEB 2.0 on Wikipedia. You might want to see for learning more.
So this WEB 2.0 term really doesn't mean much to us developers as long as we keep our imaginations flying and showing our creative work....May be as i write this blog post some extra minded people may even be talking about WEB 3.0, 4.0 ,5.0 ......