Onlineatoz.net | ToolBox HTML Control HTMLSelect

ToolBox HTML Control HTMLSelect

HTML Select Web Server Control

In ASP.NET environment,This Article represents you how to work with HTML Select Control.In HTML environment, Select is an object that represents an DropDownList in an HTML form. The Select control in a HTML form contains all instance of an <select> tag.

We can Adding the items in the control by placing HTML <option>elements between the opening and closing <select> tags. You can control the appearance and behavior of the HtmlSelect control by setting the Size and Multiple properties. The Size property specifies the height (in rows) of the control. The Multiple property specifies whether more than one item can be concurrently selected in the HtmlSelect control.

When you include <select> tag into the web form, then it looks like the Dropdownlist. suppose you set the Multiple property is to true, then it looks like a listbox.To determine the selected item in a single-selection HtmlSelect control, use the SelectedIndex property to get the index of the selected item. You can then use this value to retrieve the item from the Items collection.

There are several functions available to access the HTML Select.some of its funtions are as follows,

  • document.getElementById()
  • document.getElementByName()
Select Objects collections
  • options[] -Returns an array of all the options in a dropdown list
Select Objects Properties
  • id -Sets or returns the id of a Select
  • form -Returns a reference to the form that contains the dropdown list
  • length -Returns the number of options in a dropdown list
  • multiple - Sets or returns whether or not multiple items can be selected
  • name - Sets or returns the name of a dropdown list
  • type - Returns the type of form element a dropdown list is
  • tabIndex -Sets or returns the tab order for a dropdown list
  • selectedIndex -Sets or returns the index of the selected option in a dropdown list
  • isMap -Returns whether or not an Select is a server-side Select map
  • tabIndex -Sets or returns the tab order for a dropdown list
  • dir -Sets or returns the direction of text
  • lang -Sets or returns the language code for an element
  • title -Sets or returns an element's advisory title
  • className -Sets or returns the class attribute of an element
Methods
  • add() -Adds an option to a dropdown list
  • blur() -Removes focus from a dropdown list
  • focus() -Sets focus on a dropdown list
  • remove() -Removes an option from a dropdown list

The following code snippets explains you the HTML Select in the web form.

in .aspx.cs page,

    
    void Button_Click (Object sender, EventArgs e)
      {
        
         Label1.Text = "You selected:";

         for (int i=0; i<=Select1.Items.Count - 1; i++)
         {
            if (Select1.Items[i].Selected)
               Label1.Text += "-" + Select1.Items[i].Text;
         }

      }
        

in .aspx page,

 
<form id="Form2" runat="server">
      <h3>Example </h3>
      <select id="Select1" 
              Multiple="True"
              runat="server">
         <option value="1" Selected="True"> apple</option>
         <option value="2"> orange</option>
         <option value="3"> guava </option>
      </select>
      <br><br>
      <button id="Button1"
              OnServerClick="Button_Click"
              runat="server">
         Submit
      </button>
      <br><br>
      <asp:Label id="Label1"
           runat="server"/>

   </form>

 
Related Links

Posted by: Admin
Posted on: 9/12/2011 at 7:58 PM
Categories: Asp.net
Actions: E-mail | Kick it! | DZone it! | del.icio.us
Post Information: Permalink | Comments (0) | Post RSSRSS comment feed