Debugging JavaScript code in ASP.NET
I am currently working with conversion of ASP Classic web
application to ASP.Net 2.0 and I have to deal with a lot of client-side script. Before, I used to insert an alert(sampleValue) to be able to view the
current value of a variable until I found out that about “debugger” keyword in
JavaScript.
Here’s how to enable client debugging in ASP.NET.
- Uncheck
the “Disable Script Debugging (Internet Explorer)“ options in Internet
Explorer.
- Create
a simple Web Form.
<%@ Page
Language="C#" AutoEventWireup="true" CodeFile="ClientScriptDebugging.aspx.cs" Inherits="ClientScriptDebugging" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
>
<head runat="server">
<title>Client-Side Debugging</title>
<script language="javascript" type="text/javascript">
<!--
function btnOk_onclick() {
var
ColorCode;
var
ColorDescription;
var
Name;
debugger;
Name = document.getElementById("txtName").value;
ColorCode = document.getElementById("drpColor").value;
for(i
= 0; j < document.getElementById("drpColor").options.length; j++)
{
if(document.getElementById("drpColor").options[j].value ==
ColorCode)
{
ColorDescription =
document.getElementById("drpColor").options[j].text;
break;
}
}
alert("Hi, " + Name + ".\n You're favorite color is
" + ColorDescription);
}
//
-->
</script>
</head>
<body>
<form id="form1"
runat="server">
<div>
<select id="Select1" name="drpColor">
<option selected="selected" value="0">Red</option>
<option value="1">Blue</option>
<option value="2">Yellow</option>
<option value="3">Green</option>
<option value="4">Orange</option>
<option></option>
</select>
<input id="btnOk" style="width: 66px" type="button"
value="OK" language="javascript" onclick="return btnOk_onclick()" />
<input id="txtName" type="text" /></div>
</form>
</body>
</html>
Once you
run the application and the compiler hits the debugger keyword, VS
will automatically breaks on this line. You can now use the rich debugging
tools of Visual Studio that we usually use when debugging server side codes.
