Test your Frontend JavaScript Code

A unit is a small section of code. Unit testing means you test that bit of code to make sure it functions properly. This increases confidence in your code.

Unit tests are important when many people work on the same codebase. If one engineer changes code in one part of the project, you want to ensure that the rest of the project still works.

Unit tests are especially important in dynamically typed languages such as JavaScript, since there is no compiler to catch common problems.

Below are the some of the articles written by Matt how we can test the JavaScript code:

1) JavaScript unit testing: guiding principles and common excuses By Matt Harrington

2) How to write JavaScript unit tests with Mocha By Matt Harrington

3) JavaScript unit testing: using the Chutzpah test runner in Visual Studio By Matt Harrington

4) Using Mocha JS, Chai JS and Sinon JS to Test your Frontend JavaScript Code

Hope this will help !!!

Jay Ganesh


AngularJS vs KnockoutJS

Eli Weinstock-Herman has created serie of articles to explain difference of AngularJS and KnockoutJS.

The thing is, Knockout and AngularJS are attempting to solve two different problems. One is simply an MVVM binding framework, the other is a SPA-in-a-box solution. So instead of trying to directly compare the two frameworks.

Here are the capabilities discussed:

Data binding – bind HTML elements to JavaScript data models
Validation – validation of raw inputs by applying rules for fields or model properties
Serialization – easy method for serializing models to POST to server-side APIs
Templating – define HTML templates for re-usable complex collections of HTML
Modules + DI – keep my javascript files separate, help me order them properly, manage dependencies for me
Automated Testing – Exploring unit testing and possibilities for higher level testing
SPA Routing/History – make it easy for me to route between views in a single page app, with history/deep linking

Read Full Articles: http://blogs.lessthandot.com/index.php/WebDev/UIDevelopment/angularjs-vs-knockout-introduction-1/

Happy Programming !!!

Jay Ganesh

How to set/get DropDownList value using jQuery

Let see the example.

Set DropDownList

$('#<%= mydropdownlist.ClientID %>').val("thevalue");

Just make sure the value in the options tags matches the value in the val method.

Get DropDownList

$('#<%= mydropdownlist.ClientID %>').val();

Hope this will help !!!

Jay Ganesh

Multiple Ways To Access Asp.Net TextBox Control Using jQuery

Let’s take an example of textbox control.

<asp:TextBox runat="server" ID="txtName" />

When ASP.NET renders server side controls it gives them unique client ids which are different from their server ids and if you check view source of your ASP.NET page

you will find ids familiar to following.

<input type="text" id="ctl00_ContentPlaceHolder1_txtName" name="ctl00$ContentPlaceHolder1$txtName" />

This id can be even more lengthy if you are using Master pages in your ASP.NET website. So how you can access these controls in JQuery. There are some options

available using which we can select the above textbox control.

1) Using ClientID

$('#<%= txtName.ClientID %>')

Note : you can only use it in .aspx pages, not in external .js files.

2) Using attribute selectors

$('[id$=txtName]') /* id which ends with the text 'txtName' */
$('[id*=txtName]') /* id which contains the text 'txtName' */

3) Using CssClass

Highly recommended. Because selectors using classes are clean and uncomplicated. In case you are wondering, CssClass for .net controls is the same as class for traditional html controls.

<asp:TextBox runat="server" ID="txtName" CssClass="myclass" />

4) Use ClientIDMode=”Static”

This is introduced in .NET Framework 4.0, on the control so that it’s ID will stay unchanged.

<asp:TextBox runat="server" ID="txtName" ClientIDMode="Static"  />

Hope this will help !!!

Jay Ganesh