Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Jun 2002
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Angry Editable Dropdowns

    I am looking for a way to make a Dropdown box editable by the user. I found some code but it does not allow the user to just click on the box and begin editing the content. It currently allows the user to select one of the selected indexes and then begin to edit. Can anyone help me with this. Here is the code that I have:
    Thanks in advance. This code may help someone else as well.

    <head>
    <script LANGUAGE="JavaScript" >
    <!-- Begin
    var o = null;
    var isNN = (navigator.appName.indexOf("Netscape")!=-1);

    function beginEditing(menu){
    finish();

    if(menu[menu.selectedIndex].value == "editable"){
    o = new Object();
    o.editOption = menu[menu.selectedIndex];
    o.editOption.old = o.editOption.text;
    o.editOption.text = "";
    menu.blur();
    window.focus();
    document.onkeypress = keyPressHandler;
    document.onkeydown = keyDownHandler;

    }
    function keyDownHandler(e){
    var keyCode = (isNN)?e.which:event.keyCode;
    return (keyCode!=8 || keyPressHandler(e));
    }
    function keyPressHandler(e){
    var option = o.editOption;
    var keyCode = (isNN)?e.which:event.keyCode;
    if(keyCode==8 || keyCode==37)
    option.text = option.text.substring(0,option.text.length-2)+" ";
    else if(keyCode==13){
    finish();
    } else if(keyCode!=0)
    option.text = option.text.substring(0,option.text.length-1) + String.fromCharCode(keyCode) + " ";
    return false;
    }
    function finish(){
    if(o!=null){
    option = o.editOption;
    if(option.text.length > 1)
    option.text = option.text.substring(0,option.text.length-1);
    else
    option.text = option.old;
    document.onkeypress = null;
    document.onkeydown = null;
    o = null;
    }
    }
    }

    function getvalue()
    {
    //alert("hi");
    editable ="cbodetails" ;
    alert(document.frmMisload.elements[editable].options[document.frmMisload.elements[editable].selectedIndex].text);

    document.frmMisload.txtoption.value = document.frmMisload.cbodetails.options[document.frmMisload.cbodetails.selectedIndex].text;
    }

    //-->
    </script>

    <title>New Page </title>

    </head>

    <body bgcolor="#FFFFFF" text="#003399" link="#CC9900" vlink="#666699" alink="#CC3399">
    <form name="frmMisload" action="drop.htm" method="post">
    <select name="cbodetails" onChange="beginEditing(this);" size=1>
    <option></option>
    <option value="editable">edit</option>
    <option value="choice0">choice0</option>
    <option value="choice1">choice1</option>
    <option value="choice2">choice2</option>
    </select>
    <input type="hidden" name="txtoption">
    <input type="submit" value="go" onclick="return getvalue();">
    </form>
    </body>
    </html>

  • #2
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts

  • #3
    New to the CF scene
    Join Date
    Jun 2002
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I cannot use third party components at UPS unless they are on our grid of components or software.

  • #4
    New Coder
    Join Date
    Sep 2002
    Location
    Northern Virginia
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    so let's say i want to use this code with IE instead of Netscape. how should the netscape code change to fit IE? I am not really sure since i use IE only and have not had to deal with Netscape.

    Dan


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •