Wednesday, May 2, 2007

Select Items of a html Select

As you all know in asp .net when we define a dropdown list it is converted to a html select.

<asp:DropDownList id="ddlNewsLetter" runat="server"></asp:DropDownList>

Now in html…

Its look like this

<select name="GcbsUC:ddlNewsLetter" id="GcbsUC_ddlNewsLetter">
<option value="1">July 11, 2006</option>
<option value="2">June 14, 2006</option>
<option value="3">May 14, 2006</option>
<option value="4">April 9, 2006</option>
<option value="5">March 16, 2006</option>
<option value="6">February 19, 2006</option>
</select>

In C# code i have populated the dropdown list with a counter and a data…

Well if we what to select a perticular dropdown item from the list… how we do it…

Option

1 . document.getElementById(‘ControlName’).selectedIndex = ‘ourvalue’; [here ourvalue must be an integer and between a range of the options.length.

2. document.getElementById(‘ControlName’).value = “ourknownvalue”;

[here ourknownvalue can be 6 that is <option value="6">February 19, 2006</option>]

3. well can can always loop through the items and do what ever we like with the property

    document.test.test2.options[0].value
    document.test.test2.options[2].text

Here is an example


var ddlNewsLetter = document.getElementById('ddlNewsLetter');
if(ddlNewsLetter!=null)
{
for(var i=0; i < ddlnewsletter.options.length; i++)
{
if(ddlnewsletter.options[i].text == strnewsletterdate)
{
ddlnewsletter.options[i].selected = true;
break;
}
}
}