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 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Sep 2013
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile When Doble Click Event occured move nested list items from one div to another div

    Hi ,

    I am stucked here , can you help me on this , I have a html code like this :


    <html>
    <head>
    <script language="javascript" type="text/javascript">
    function copyText() {
    var output = document.getElementById("").innerHTML;
    document.getElementById("output").value = output;
    }
    </script>
    </head>
    <body>
    <style type="text/css">
    </style>
    <div id="main" onDblClick="copyText()" style="height:200px;width:300px;border:1px solid black;">
    <ul>
    <li id="list1">
    File
    <ul>
    <li id="new">New</li>
    <li id"Save">Save</li>
    <li id="Save As">Save As</li>
    </ul>
    </li>
    <li id="list2">
    Edit
    <ul>
    <li id="cut">Cut</li>
    <li id="copy">Copy</li>
    <li id="paste">Paste</li>
    </ul>
    </li>
    <li id="list3">
    Help
    <ul>
    <li id="about">About</li>
    </ul>
    </li>
    </ul>
    </div>
    <div id="output" style="height:200px;width:300px;border:1px solid black;">
    </div>
    </body>
    </html>




    for example , when i doubleclick on About it has to be moved from one div to another div and needs to be displayed with bold font.

    Regards ,
    Phani.

  • #2
    Regular Coder
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    375
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Clarification:

    You say it has to be moved, but the name of the function is copyText. Do you want it moved, or copied?

    And, does it matter if the structure or order of any of lists is maintained or not?

    And your title says nested lists but you example specifies only a list item. Do you only want nested lists copied/moved, or should anything double clicked upon get moved>

    If you just want to move and don't care about structure or order or whether an item is a list or an itrm:

    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script>
    function copyText(e) {
    	var clicked = e.target || e.srcElement, tn,
    	ouputul = document.getElementById("output");
    	if(!(tn = clicked.tagName) || tn === 'DIV'){return;}
    	ouputul.appendChild(clicked);
    }
    </script>
    </head>
    <body>
    <div id="main" onDblClick="copyText(event);return false;" style="min-height:200px;width:300px;border:1px solid black;">
    <ul>
    <li id="list1">
    File
    <ul>
    <li id="new">New</li>
    <li id"Save">Save</li>
    <li id="Save As">Save As</li>
    </ul>
    </li>
    <li id="list2">
    Edit
    <ul>
    <li id="cut">Cut</li>
    <li id="copy">Copy</li>
    <li id="paste">Paste</li>
    </ul>
    </li>
    <li id="list3">
    Help
    <ul>
    <li id="about">About</li>
    </ul>
    </li>
    </ul>
    </div>
    <div style="min-height:200px;width:300px;border:1px solid black;font-weight:bold;">
    <ul id="output">
    </ul>
    </div>
    </body>
    </html>
    Last edited by jscheuer1; 09-23-2013 at 12:16 PM. Reason: more clarification
    - John


  •  

    Posting Permissions

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