Jump to content

text field with dropdown menu turn to radio?


xcoderx

Recommended Posts

ok the following code is a text with dropdown list with select option, what i want for it to do is add radio button to the dromdown area so that i could fetch the category from database in it. anyone could help do this?

 

<!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>Textbox Dropdown Combination Example</title>
<style type="text/css">
    .select-free
    {
        position: absolute;
        z-index: 10; /*any value*/
        overflow: hidden; /*must have*/
        width: 247px; /*must have for any value*/ /*width of area +5*/
    }
    .select-free iframe
    {
        display: none; /*sorry for IE5*/
        display: /**/ block; /*sorry for IE5*/
        position: absolute; /*must have*/
        top: 0px; /*must have*/
        left: 0px; /*must have*/
        z-index: -1; /*must have*/
        filter: mask(); /*must have*/
        width: 3000px; /*must have for any big value*/
        height: 3000px /*must have for any big value*/;
    }
    .select-free .bd
    {
        padding: 11px;
    }
</style>

<script language="javascript" type="text/javascript">

    function DropDownTextToBox(objDropdown, strTextboxId) {
        document.getElementById(strTextboxId).value = objDropdown.options[objDropdown.selectedIndex].value;
        DropDownIndexClear(objDropdown.id);
        document.getElementById(strTextboxId).focus();
    }
    function DropDownIndexClear(strDropdownId) {
        if (document.getElementById(strDropdownId) != null) {
            document.getElementById(strDropdownId).selectedIndex = -1;
        }
    }

</script>

</head>
<body style=" background-color: Gray;">

    <form name="form1" method="post" action="Textbox-Dropdown-Combination.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTgzOTg5MTA2MGRkYDO3TT6TY2F83LQma/HS7O1jRzA=" />
</div>

    <div>Enter text or select an option from the dropdown
<div style="position: relative;">
    <!--[if lte IE 6.5]><div class="select-free" id="dd3"><div class="bd" ><![endif]-->
    <input name="TextboxExample" type="text" maxlength="50" id="TextboxExample" tabindex="2"
        onchange="DropDownIndexClear('DropDownExTextboxExample');" style="width: 242px;
        position: absolute; top: 0px; left: 0px; z-index: 2;" />
    <!--[if lte IE 6.5]><iframe></iframe></div></div><![endif]-->
    <select name="DropDownExTextboxExample" id="DropDownExTextboxExample" tabindex="1000"
        onchange="DropDownTextToBox(this,'TextboxExample');" style="position: absolute;
        top: 0px; left: 0px; z-index: 1; width: 265px;" >
        <option value="Value for Item 1" title="Title for Item 1">Item 1</option>
        <option value="Value for Item 2" title="Title for Item 2">Item 2</option>
        <option value="Value for Item 3" title="Title for Item 3">Item 3</option>
    </select>
<script language="javascript" type="text/javascript">
	DropDownIndexClear("DropDownExTextboxExample");
</script>
</div>
    </div>
    </form>
</body>

</html>

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.