Dot Net Thoughts

Last few days I was(am) busy with one pure ASP.Net application(why its pure because we are not using any 3rd party controls, ajax nothing. Everything is postbacking ). Today I got a weird bug from one of my QC team saying when ever they presses ENTER button, focus is on any textbox, it popups Help window from our application. In our application, end users can open the Help window, by clicking on some help images icons provided in the application. These images are displayed using ASP Image button controls (If you are using ASP Image controls this problem will not occur, but in our application, we need to disable it some scenarios, so can’t use ASP Image). After searching I found the issue with the default button property of ASP.Net, which helps us to submit the form using Enter Key. In my page ASP.Net considering the Help image button as default button for the Page. We can set the default button to our submit button using various methods. Set the default button property of the FORM, or create a Panel control over the controls and set the default button property of the Panel.

<form id="form1" runat="server" defaultbutton="cmdSubmit">
<asp:Panel runat="server" ID="plMain" DefaultButton="cmdSubmit">

Form tag also supports “defaultfocus” this property allows to focus to control, on Page Load.

<form id="form1" runat="server" defaultbutton="cmdSubmit" defaultfocus="txtUser">

If you are using Master Pages, there will be some slight difference because, the Form tag will not be available in the content Pages. It can fix using code behind, using FindControl method.

(Page.Master.FindControl("Form1") as HtmlForm).DefaultButton = this.cmdSubmit.UniqueID;

Also you can do something like this

Page.Master.Page.Form.DefaultButton = cmdSubmit.UniqueID;

Happy Coding

In asp.net, it allows to create only one <FORM> tag. If you put more than one <FORM> tag it will generate an error. But some times we require multiple form tags and submit buttons. Because <FORM> tag in asp.net always submit the form to the page itself.

Here is some code in javascript, it will submit the form using javascript.

function submitform()
{
document.forms[0].action = "mynewaspxpage.aspx";
document.forms[0].submit();
}

This function will set the action to mynewaspxpage.aspx and submit the form. Normally this option required for submitting forms automatically.

I already posted some code to add and read values from dropdown lists using Javascript. Sometimes we require to reset the items to zero or need to clear the items in the dropdown list. Here is a simple code snippet which will reset the dropdown items.

function clearDropdown(dropdown)
{
var mycombo =document.getElementById(dropdown);
mycombo.options.length = 0;
return(false);
}

And you can use this function like this

<button onclick="javascript:clearDropdown('myoptions')">Reset Options</button>

Where myoptions is the dropdown to clear.

If you are using list tags, like OL, LI, UL etc, there is limited control on the UI, like it will render only like 1, disc etc. Sometimes the we require bulletedlists to be look nice. Here is simple way to modifying the OL and UL tags with custom icons. The list-style-image property in CSS used to replace the existing UL and OL tags marker with an Image.

ol
{
list-style-image: url("newImage.gif");
}

And you can change it dynamically using Javascript.

var links = document.getElementsByTagName("UL");
for(var i=0; i <= links.length - 1; i++)
{
links[i].style.listStyleImage="url(plus.gif)";
}

This code will search all the UL tags and assign images for them.

If your writing cross-browser web applications, it is nessary to detcect Browser name and version. Because some of the javascript code like forms[] and controls[] will not work in all browsers, and document.getElementById() will not work in old version browsers.

Here is the code to detect browser name and version.

var browser=navigator.appName
var version= parseFloat(navigator.appVersion)
alert("You are running " + browser +" and your browser version is " + version);

This will popup an alert box with browser name and version.

Normally if you include any ActiveX control in an HTML file and browse it using MS Internet Explorer(ActiveX only works in MS IE) it gives you warning about the ActiveX control. Here is a way to avoid this warning problem.

1) Create a .js file and insert the activeX control properties using javascript document.write method

document.write('<OBJECT CLASSID="CLSID:0713E8A2-850A-101B-AFC0-4210102A8DA7" ID="TreeView1" STYLE="HEIGHT: 400px; LEFT: 50px; WIDTH: 300px">');
document.write('<PARAM NAME="LineStyle" VALUE="0">');
document.write('<PARAM NAME="Style" VALUE="7">');
document.write('<PARAM NAME="Appearance" VALUE="1">');
document.write('<PARAM NAME="BorderStyle" VALUE="1">');
document.write('<PARAM NAME="Indentation" VALUE="250">');
document.write('</OBJECT>');

2) Insert the code in the body part in the HTML file.

<script language="Javascript" src="treeview_activex.js" mce_src="treeview_activex.js"></script>

The above code will create a Treeview activeX control, in an HTML page. You can also use Adobe flash and MS Windows Media player activeX controls using the same method.