Loading ...
Sorry, an error occurred while loading the content.
 

DragAndDrop bug!!!? HELP!!

Expand Messages
  • Hugo
    Try this: 1)Create an html select with 6 or more options, but make the select size 3 or a value smaller than the total options (size= 3 ). 2)Give each option a
    Message 1 of 2 , Oct 30, 2006
      Try this:

      1)Create an html select with 6 or more options, but make the select
      size 3 or a value smaller than the total options (size="3").

      2)Give each option a unique id (<option id="dd1")

      3)Create a DDProxy for each option in the select (new
      YAHOO.util.DDProxy("dd1");)

      4)Test it! All options should be draggable, but ONLY the ones
      initially visible in the select really are, after scrolling the select
      to see the other options, dragging doesn't work on them. Tested with
      0.11.4.

      Any ideas??


      ================== begin code ==========================

      <html>
      <head>

      <!-- Namespace source file -->
      <script type="text/javascript" src="build/yahoo/yahoo.js"></script>

      <!-- Dependency source files -->
      <script type="text/javascript" src="build/dom/dom.js"></script>
      <script type="text/javascript" src="build/event/event.js"></script>

      <!-- Drag and Drop source file -->
      <script type="text/javascript" src="build/dragdrop/dragdrop.js" ></script>
      <script type="text/javascript"
      src="build/animation/animation.js"></script>

      <script language="javascript">
      function init()
      {
      new YAHOO.util.DDProxy("dd1");
      new YAHOO.util.DDProxy("dd2");
      new YAHOO.util.DDProxy("dd3");
      new YAHOO.util.DDProxy("dd4");
      new YAHOO.util.DDProxy("dd5");
      new YAHOO.util.DDProxy("dd6");
      }
      YAHOO.util.Event.addListener(window, 'load', init);

      </script>
      </head>
      <body>
      <select id="testselect" name="testselect" size="3">
      <option id="dd1" value="1">option 1</option>
      <option id="dd2" value="2">option 2</option>
      <option id="dd3" value="3">option 3</option>
      <option id="dd4" value="4">option 4</option>
      <option id="dd5" value="5">option 5</option>
      <option id="dd6" value="6">option 6</option>
      </select>
      </body>
      </html>
    • Derek
      im quite surprised DD is even possible on select options... i havent tested this so take it with a grain of salt. you might try creating the DD objects BEFORE
      Message 2 of 2 , Oct 31, 2006
        im quite surprised DD is even possible on select options... i havent
        tested this so take it with a grain of salt. you might try creating
        the DD objects BEFORE you set the select size to less than the total
        options.

        some peusdo-code

        createEl('select')
        do{
        createDD(optEl)
        }while()

        selectEl.size = 3;


        FYI, since IE using COM objects for form elements, i wouldnt expect
        this to work at all in IE (assuming you care about IE)


        --- In ydn-javascript@yahoogroups.com, "Hugo" <hugo102@...> wrote:
        >
        > Try this:
        >
        > 1)Create an html select with 6 or more options, but make the select
        > size 3 or a value smaller than the total options (size="3").
        >
        > 2)Give each option a unique id (<option id="dd1")
        >
        > 3)Create a DDProxy for each option in the select (new
        > YAHOO.util.DDProxy("dd1");)
        >
        > 4)Test it! All options should be draggable, but ONLY the ones
        > initially visible in the select really are, after scrolling the select
        > to see the other options, dragging doesn't work on them. Tested with
        > 0.11.4.
        >
        > Any ideas??
        >
        >
        > ================== begin code ==========================
        >
        > <html>
        > <head>
        >
        > <!-- Namespace source file -->
        > <script type="text/javascript" src="build/yahoo/yahoo.js"></script>
        >
        > <!-- Dependency source files -->
        > <script type="text/javascript" src="build/dom/dom.js"></script>
        > <script type="text/javascript" src="build/event/event.js"></script>
        >
        > <!-- Drag and Drop source file -->
        > <script type="text/javascript" src="build/dragdrop/dragdrop.js"
        ></script>
        > <script type="text/javascript"
        > src="build/animation/animation.js"></script>
        >
        > <script language="javascript">
        > function init()
        > {
        > new YAHOO.util.DDProxy("dd1");
        > new YAHOO.util.DDProxy("dd2");
        > new YAHOO.util.DDProxy("dd3");
        > new YAHOO.util.DDProxy("dd4");
        > new YAHOO.util.DDProxy("dd5");
        > new YAHOO.util.DDProxy("dd6");
        > }
        > YAHOO.util.Event.addListener(window, 'load', init);
        >
        > </script>
        > </head>
        > <body>
        > <select id="testselect" name="testselect" size="3">
        > <option id="dd1" value="1">option 1</option>
        > <option id="dd2" value="2">option 2</option>
        > <option id="dd3" value="3">option 3</option>
        > <option id="dd4" value="4">option 4</option>
        > <option id="dd5" value="5">option 5</option>
        > <option id="dd6" value="6">option 6</option>
        > </select>
        > </body>
        > </html>
        >
      Your message has been successfully submitted and would be delivered to recipients shortly.