Show - Hide Elements using JQuery

We can use the following scripts for show / hide elements.
Hide Element
Through CSS -> $(selector).css("display","none")
Through function -> $(selector).hide()

Show Element
Through CSS -> $(selector).css("display","")
Through function -> $(selector).show()

Sample

Markup
<span class = "blue">First</span><br />
<span class = "red">Second</span><br />
<span class = "blue">Third</span><br />
<span class = "blue">Fourth</span><br />
<span class = "green">Fifth</span><br />

Scripts
CSS usage
if ($(".red").is(":visible"))
{
$(".red").css("display", "none");
}
else
{
$(".red").css("display", "");
}


Prototype function
if ($(".red").is(":visible"))
{
$(".red").hide();
}
else
{
$(".red").show();
}

Happy Scripting...

JSLint – The Java Script Validator

JSLint is a Code Quality tool which makes our java script to be well formed.
JSLint takes a JavaScript source and scans it. If it finds a problem, it returns a message describing the problem and an approximate location within the source. The problem is not necessarily a syntax error, although it often is. JSLint looks at some style conventions as well as structural problems. It does not prove that your program is correct. It just provides another set of eyes to help spot problems.
What it does,

• Missing semicolons at the end of a line.
• Missing curly braces in if, for, while, etc.
• Code that is never run because of a return, throw, continue, or break.
• Case statements in a switch that do not have a break statement. And more…

Using this tool, you can check all your JavaScript source code for common mistakes without actually running the script or opening the web page.


JSLint provides an online tool in which we can validate the scripts without installing any tool.

JSLint Reference document


JSLint plug-in for Visual Studio
JSLint.VS is Add-In for Visual Studio that provides errors in JavaScript during compiling enabling you to spend less time in browser catching bugs and typos.
For more details about the JSLint.VS, Click here

Happy Learning…

Useful Cheat Sheets

Cheat sheet is just a pocket reference. We can have the summary about the technology like Regular Expression, SQL Server, HTML & CSS etc. in a single sheet. Get the Cheat Sheets .

Happy Learning....

.NET Framework 4 & Extensions Poster

.NET Framework 4 & Extensions Poster
Click here to get the .NET Framework 4 & Extension's Namespace details.

Happy Learning...

Microsoft Exam test application

Microsoft Exam test application. Try and seek knowledge..

Are You Certifiable

Column Moving in Infragistics Grid

Infragistics provides an interesting feature in UltraWebGrid called Column moving. This feature can be done either on Server side or Client Side.
You can implement this column moving by including the following statement in UltrawebGrid’s Initialize Layout event.

Private Sub UltraWebGridClaimants_InitializeLayout(ByVal sender As Object, ByVal e As Infragistics.WebUI.UltraWebGrid.LayoutEventArgs) Handles UltraWebGridClaimants.InitializeLayout
With UltraWebGridClaimants.DisplayLayout
.XmlLoadOnDemandType = Infragistics.WebUI.UltraWebGrid.XmlLoadOnDemandType.Synchronous
.StationaryMargins = Infragistics.WebUI.UltraWebGrid.StationaryMargins.Header
.AllowColumnMovingDefault = Infragistics.WebUI.UltraWebGrid.AllowColumnMoving.OnClient
.Browser = Infragistics.WebUI.UltraWebGrid.BrowserLevel.Xml
End With

Also you can prevent some columns to not being movable. For this add the following script functions in your script file

// Prevent column moving for "Select" column.
function onBeforeColumnMove(grid, columnId)
{
if(columnId != undefined)
{
var column = igtbl_getColumnById(columnId);
if(column.Key == "Select")
return true;
}
}
// Prevent column moving for "Select" column.
function onColumnDrag(grid, columnId, targetColumnId)
{
if(targetColumnId != undefined)
{
var column = igtbl_getColumnById(targetColumnId);
if(column.Key == "Select")
return true;
}
}

And call these functions in appropriate events on Initialize Layout.

Private Sub UltraWebGridClaimants_InitializeLayout(ByVal sender As Object, ByVal e As Infragistics.WebUI.UltraWebGrid.LayoutEventArgs) Handles UltraWebGridClaimants.InitializeLayout
With UltraWebGridClaimants.DisplayLayout
.XmlLoadOnDemandType = Infragistics.WebUI.UltraWebGrid.XmlLoadOnDemandType.Synchronous
.StationaryMargins = Infragistics.WebUI.UltraWebGrid.StationaryMargins.Header
.AllowColumnMovingDefault = Infragistics.WebUI.UltraWebGrid.AllowColumnMoving.OnClient
.Browser = Infragistics.WebUI.UltraWebGrid.BrowserLevel.Xml
.ClientSideEvents.BeforeColumnMoveHandler = "onBeforeColumnMove"
.ClientSideEvents.ColumnDragHandler = "onColumnDrag"
End With

Happy Coding….