[RESOLVED] combo box????

**bczm8703** · Apr 5th, 2007, 06:35 AM

i would like my page to have a combo box which act something like MS word where you slect the font type and font size..

anyone has any idea how i can do it???

**mendhak** · Apr 6th, 2007, 03:58 AM

HTML has no such controls. As a result you will need to 'emulate' one. You can do this by having a textbox, and a div underneath the textbox, kept hidden. And a 'down arrow' next to the textbox. User clicks on down arrow, the div becomes visible. The div has many rows, each row displays the font to the user in the font's own style.

Keep in mind that you cannot just put any font you want there. Not all users have the same font, so you'll need to stick to a minimum few.

**bczm8703** · Apr 6th, 2007, 11:31 AM

sorry i think my question has some mis understanding..
what i realli wan is a combo box.. one that can has textbox and dropdown list feature merge together

**neeshu30** · Apr 7th, 2007, 01:43 PM

http://www.codeproject.com/aspnet/Multi_Column_Combo_Box.asp

this link should help you

**mendhak** · Apr 8th, 2007, 04:06 AM

Originally Posted by bczm8703

sorry i think my question has some mis understanding..
what i realli wan is a combo box.. one that can has textbox and dropdown list feature merge together

I don't think you understand. There is no such control in HTML. It has to be created. By you. Or you can search for an existing third party control that does this.

I also think neeshu's misunderstood your question.

**Magiaus** · Apr 8th, 2007, 05:49 PM

The frog is correct. You need this or something like it.... I've always hated that i can't make my "select" box look as nice as the browser's...

Code:

<!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>
    <title>Untitled Page</title>
</head>
<body>
    <div id="compositeDHtmlControl" style="font-size:12px;"><!--note the huge error in display heights -->
        <script language="javascript" type="text/javascript">
        <!--//
            function hover(fntDiv)
            {
                var odiv = document.getElementById(fntDiv);
                if(null == odiv) return;
                
                odiv.style.backgroundColor = "black";
                odiv.style.color = "red";
            }
            
            function unhover(fntDiv)
            {
                var odiv = document.getElementById(fntDiv);
                if(null == odiv) return;
                
                odiv.style.backgroundColor = "white";
                odiv.style.color = "black";
            }
            
            function select_font(fntBox, fontName)
            {
                var otxt = document.getElementById(fntBox);
                if(null == otxt) return;
                
                otxt.style.fontFamily = fontName;
            }
            
            function toggle_list(fntOwnerDiv)
            {
                var odiv = document.getElementById(fntOwnerDiv);
                if(null == odiv) return;
                
                if(odiv.style.display == "none")
                {
                    odiv.style.display = "block";
                }
                else
                {
                    odiv.style.display = "none";
                }
            }
        //-->
        </script>
        <input type="text" id="inputText" value="foo-BAR" style="width:90px;height:13px;"/><input type="button" id="down" value="-" style="width:10px;height:20px;" onclick="toggle_list('fontsDiv');" />
        <div id="fontsDiv" style="display:none;width:100px;border:solid 1px black;">
            <div id="font_arial" onclick="select_font('inputText','arial');toggle_list('fontsDiv');" onmouseover="hover('font_arial');" onmouseout="unhover('font_arial');" style="font-family:Arial;">Arial</div>
            <div id="font_serif" onclick="select_font('inputText','sans');toggle_list('fontsDiv');" onmouseover="hover('font_serif');" onmouseout="unhover('font_serif');" style="font-family:Serif;">Serif</div>
            <div id="font_sans" onclick="select_font('inputText','serif');toggle_list('fontsDiv');" onmouseover="hover('font_sans');" onmouseout="unhover('font_sans');" style="font-family:Sans;">Sans</div>
        </div>
    </div>
</body>
</html>

**Magiaus** · Apr 8th, 2007, 06:04 PM

Here is another less complex way. I think they both suck because the display size changes, and that is bad...

Code:

<script>
<!--//
            function select_font(fntBox, fontName)
            {
                var otxt = document.getElementById(fntBox);
                if(null == otxt) return;
                
                otxt.style.fontFamily = fontName;
            }
///-->
</script>
<select id="selbox">
    <option onmouseover="select_font('selbox','arial');" value="arial">Arial</option>
    <option onmouseover="select_font('selbox','sans');" value="sans">Sans</option>
    <option onmouseover="select_font('selbox','serif');" value="serif">Serif</option>
</select>
    <select id="selbox2"><option onmouseover="select_font('selbox2','arial');" value="arial">Arial</option><option onmouseover="select_font('selbox2','sans');" value="sans">Sans</option><option onmouseover="select_font('selbox2','serif');" value="serif" style="font-family:Sans;">Serif</option></select>

**bczm8703** · Apr 8th, 2007, 09:37 PM

mendhak a third party control will only allow non commerical use.. but mine is a commerical website...

**bczm8703** · Apr 8th, 2007, 11:10 PM

Code:

<script runat="server">
    Public ReadOnly Property Items() As ListItemCollection
        Get
            Return info2.Items
           
        End Get
    End Property

    Public ReadOnly Property SelectedItem() As ListItem
        Get
            
            If info2.SelectedIndex < 0 Then
                Return New ListItem(text2.Text, text2.Text)
            Else
                Return info2.SelectedItem
            End If
            End Get
    End Property

    Public Property SelectedIndex() As Integer
        Get
           
            Return info2.SelectedIndex
     End Get
        Set(ByVal value As Integer)
            
            If (value >= -1) And (value < info2.Items.Count) Then
                info2.SelectedIndex = value
                text2.Text = info2.Items(SelectedIndex).Text
            End If
          
        End Set
    End Property
    Public Property SelectedValue() As String
        Get
          
            Return text2.Text
            End Get
        Set(ByVal value As String)
           
            text2.Text = value
            info2.SelectedIndex = -1
            For Each oItem As ListItem In info2.Items
                If value.Length <= oItem.Text.Length Then
                    If String.Compare(oItem.Text.Substring(0, value.Length), value, True) = 0 Then
                        oItem.Selected = True
                        Exit For
                    End If
                End If
            Next
        End Set
    End Property
    Dim value2, usercon, usercom, userread, usersql
    Dim timing, timeHour, msg1
    
    Sub page_load()
        Session.Timeout = "10000"
        Dim key As String = Me.UniqueID & "_"
        info2.Attributes.Add("onclick", "selectList('" & key & "', 'info2', 'text2')")
        text2.Attributes.Add("onkeyup", "scrollList('" & key & "', 'info2', 'text2')")
        colName.Visible = True
        listItems.Visible = False
        activateSubmit.Visible = False
        tableDisplay.Visible = False
        usercon = New OleDbConnection("Provider=SQLOLEDB;Data Source=esaacc;Initial Catalog=TESSA;User Id=sa;Password=*****;")
        usercon.Open()
        If Not Page.IsPostBack Then
            timing = FormatDateTime(Now, DateFormat.ShortTime)
            timeHour = Hour(timing)
            If Not timeHour >= 12 Then
                msg1 = "Good Morning "
            ElseIf Not timeHour >= 17 Then
                msg1 = "Good Afternoon "
            Else
                msg1 = "Good Evening "
            End If
        
            If Session("username") = "" Then
                main.Visible = False
                helpLink.Visible = False
                loginFalse.Visible = True
                Button1.Text = "Login"
                Button1.Enabled = True
                greeting.Text = msg1 + "Guest"
            Else
                usersql = "select userRole from member where username ='" & Session("username") & "'"
                usercom = New OleDbCommand(usersql, usercon)
                userread = usercom.ExecuteReader()
                While userread.read()
                    If userread.GetString(0) = "administrator" Then
                        register.Text = "<a href='register.aspx'>Administrator Control Panel</a>"
                    End If
                End While
                greeting.Text = msg1 + Session("username")
                helpLink.Visible = True
                main.Visible = True
                loginFalse.Visible = False
                usercon.Close()
                userread.Close()
            End If
        End If
        
       
    End Sub
    
    Sub information(ByVal sender As Object, ByVal e As EventArgs)
        Dim dbconn, dbcomm, sql, i
        Dim schemaAdapter
        Dim schemaTable As New DataTable
        dbconn = New OleDbConnection("Provider=SQLOLEDB;Data Source=esaacc;Initial Catalog=TESSA;User Id=sa;Password=*****;")
        dbconn.Open()
        If value1.SelectedValue = "itemdesc" Then
            sql = "select distinct itemdesc from iv00101 where ITMCLSCD ='WIP/FG'and itemnmbr like 'w0%' order by itemdesc"
        ElseIf value1.SelectedValue = "itemnmbr" Then
            sql = "select distinct itemnmbr from iv00101 where itemnmbr like 'w0%' and ITMCLSCD ='WIP/FG' order by itemnmbr"
        ElseIf value1.SelectedValue = "custname" Then
            sql = "select custname from rm00101 where custnmbr like 'd%' order by custname"
        ElseIf value1.SelectedValue = "custnmbr" Then
            sql = "select custnmbr from rm00101 where custnmbr like 'd%' order by custnmbr"
        End If
        If value1.SelectedValue = "cstponbr" Then
            sql = "select distinct cstponbr from sop10100 where not cstponbr=''"
        End If
        If value1.SelectedValue = "sopnumbe" Then
            sql = "select distinct sopnumbe from sop10100 where sopnumbe like 'w0%'"
        End If
        dbcomm = New OleDbCommand(sql, dbconn)
        schemaAdapter = New OleDbDataAdapter(dbcomm)
        schemaAdapter.Fill(schemaTable)
        info2.Items.Clear()
        For i = 1 To schemaTable.Rows.Count - 1
            info2.Items.Add(schemaTable.Rows(i).Item(value1.SelectedValue).ToString)
        Next
            
        schemaTable.Dispose()
        dbconn.close()
        listItems.Visible = True
        activateSubmit.Visible = True
    End Sub
    
       
        </script>
<html>
<body >
<form id="form1" runat="server">
<asp:Panel ID="main" runat=server>
   <asp:Panel ID="colName" runat=server> <asp:RadioButtonList runat=server AutoPostBack=true ID="value1" RepeatDirection=Horizontal OnSelectedIndexChanged="information">
   <asp:ListItem Value="itemdesc">Item Description</asp:ListItem>
   <asp:ListItem Value="itemnmbr">Work Order Number</asp:ListItem>
   <asp:ListItem Value="custname">Customer Name</asp:ListItem>
   <asp:ListItem Value="custnmbr">Customer Number</asp:ListItem>
   <asp:ListItem Value="cstponbr">Customer PO</asp:ListItem>
   <asp:ListItem Value="sopnumbe">Sale Order Number</asp:ListItem>
   </asp:RadioButtonList></asp:Panel>
  
   <asp:Panel ID="listItems" runat=server>
 <asp:TextBox ID=text2 runat=server />
 <asp:DropDownList ID="info2" runat=server />

   </asp:Panel>
   <asp:Panel ID="tableDisplay" runat=server>
   <asp:Label ID="selectedName" runat=server />
        </asp:Panel>
  </asp:Panel>
<table>
<tr>
<td>
<asp:Panel ID="activateSubmit" runat=server>
   <asp:Button ID="b2" runat=server Text="Submit" OnClick="submit" CssClass="button" />
</asp:Panel>
</td>
<td><asp:Button ID="Button1" runat=server OnClick="logout" Text="Logout" CssClass="button" />
<asp:Button ID="Button2" runat=server OnClick="clear" Text="Reset All fields" CssClass="button" />
</td>
</tr>
</table>

</asp:Panel>
</form>
    
</body>
</html>

when i press the enter key on my keyboard while my cursor in is the textfield i receive this error: Object Expected on Ln92
my ln 92 is in bold

**mendhak** · Apr 10th, 2007, 04:18 PM

Not all third party controls prevent commercial use. Most likely, you will have to pay for the ones that do allow it.

Thread: [RESOLVED] combo box????

Thread Tools

Display

[RESOLVED] combo box????

Re: combo box????

Re: combo box????

Re: combo box????

Re: combo box????

Re: combo box????

Re: combo box????

Re: combo box????

Re: combo box????

Re: combo box????

Posting Permissions