Revision history [back]

click to hide/show revision 1
initial version

answered 2015-02-05 17:28:18 +0800

cyiannoulis gravatar image cyiannoulis

Okay. To be able a component to receive onDrop events should be a 'droppable' component. The problem is that the textbox does not support directy this functionality. So, you have to wrap it inside another droppable component like a Panel (Listbox, Grid and most other components support this feature also).

Here is a working example:

<?page title="Drop Test" contentType="text/html;charset=UTF-8"?>
<zk> 
<vlayout>
    <label draggable="true" droppable="true">Drag me into the textbox </label> 

    <panel onDrop="dropped(event.dragged)" droppable="true" width="50%" border="normal">
        <panelchildren>
            <div align="center">
                <textbox id="globalSearch" width="100%" placeholder="drag here your question" />
            </div>
        </panelchildren>    
    </panel>

</vlayout>

<zscript><![CDATA[
    public void dropped(Component dragged) {
        if (dragged instanceof Label)
            globalSearch.setValue( ((Label)dragged).getValue() );
    }
]]></zscript>
</zk>

Hope that helps

Costas

Okay. To be able a A component to receive onDrop events should be a 'droppable' component. to be able to receive onDrop events. The problem is that the textbox does not support directy this functionality. So, you have to wrap it inside another droppable component like a Panel (Listbox, Grid and most other container components support this feature also).feature).

Here is a working example:

<?page title="Drop Test" contentType="text/html;charset=UTF-8"?>
<zk> 
<vlayout>
    <label draggable="true" droppable="true">Drag me into the textbox </label> 

    <panel onDrop="dropped(event.dragged)" droppable="true" width="50%" border="normal">
        <panelchildren>
            <div align="center">
                <textbox id="globalSearch" width="100%" placeholder="drag here your question" />
            </div>
        </panelchildren>    
    </panel>

</vlayout>

<zscript><![CDATA[
    public void dropped(Component dragged) {
        if (dragged instanceof Label)
            globalSearch.setValue( ((Label)dragged).getValue() );
    }
]]></zscript>
</zk>

Hope that helps

Costas

Okay. A component should be a 'droppable' to be able to receive onDrop events. The problem is that the textbox does not support directy this functionality. So, you have to wrap it inside another droppable component like a Panel (Listbox, Grid and most other container components support this feature).

Here is a working example:

<?page title="Drop Test" contentType="text/html;charset=UTF-8"?>
<zk> 
<vlayout>
    <label draggable="true" droppable="true">Drag me into the textbox </label> 

    <panel onDrop="dropped(event.dragged)" droppable="true" width="50%" border="normal">
        <panelchildren>
         <div align="center">
             <textbox id="globalSearch" width="100%" placeholder="drag here your question" />
         </div>
        </panelchildren>  
    </panel>

</vlayout>

<zscript><![CDATA[
    public void dropped(Component dragged) {
        if (dragged instanceof Label)
            globalSearch.setValue( ((Label)dragged).getValue() );
    }
]]></zscript>
</zk>

Hope that helps

Costas

Okay. A component should be a 'droppable' to be able to receive onDrop events. The problem is that the textbox does not support directy this functionality. So, you have to wrap it inside another droppable component like a Panel (Listbox, Grid and most other container components support this feature).

Here is a working example:

<?page title="Drop Test" contentType="text/html;charset=UTF-8"?>
<zk> 
<vlayout>
    <label draggable="true" droppable="true">Drag draggable="true">Drag me into the textbox </label> 

    <panel onDrop="dropped(event.dragged)" droppable="true" width="50%" border="normal">
       <panelchildren>
        <div align="center">
            <textbox id="globalSearch" width="100%" placeholder="drag here your question" />
        </div>
       </panelchildren> 
    </panel>

</vlayout>

<zscript><![CDATA[
    public void dropped(Component dragged) {
        if (dragged instanceof Label)
            globalSearch.setValue( ((Label)dragged).getValue() );
    }
]]></zscript>
</zk>

Hope that helps

Costas

Okay. A component should be a 'droppable' to be able to receive onDrop events. The problem is that the textbox does not support directy directly this functionality. So, you have to wrap it the textbox inside another droppable component like a Panel (Listbox, Grid and most other container components support this feature).

Here is a working example:

<?page title="Drop Test" contentType="text/html;charset=UTF-8"?>
<zk> 
<vlayout>
    <label draggable="true">Drag me into the textbox </label> 

    <panel onDrop="dropped(event.dragged)" droppable="true" width="50%" border="normal">
       <panelchildren>
        <div align="center">
            <textbox id="globalSearch" width="100%" placeholder="drag here your question" />
        </div>
       </panelchildren> 
    </panel>

</vlayout>

<zscript><![CDATA[
    public void dropped(Component dragged) {
        if (dragged instanceof Label)
            globalSearch.setValue( ((Label)dragged).getValue() );
    }
]]></zscript>
</zk>

Hope that helps

Costas

A component should be 'droppable' to be able to receive onDrop events. The problem is that the textbox does not support directly this functionality. So, you have to wrap the textbox inside another droppable component like a Panel (Listbox, Grid and most other container components support this feature).

Here is a working example:

<?page title="Drop Test" contentType="text/html;charset=UTF-8"?>
<zk> 
<vlayout>
    <label draggable="true">Drag draggable="true" style="cursor: pointer;">Drag me into the textbox </label> 
</label>

    <panel onDrop="dropped(event.dragged)" droppable="true" width="50%" border="normal">
       <panelchildren>
        <div align="center">
            <textbox id="globalSearch" width="100%" placeholder="drag here your question" />
        </div>
       </panelchildren> 
    </panel>

</vlayout>

<zscript><![CDATA[
    public void dropped(Component dragged) {
        if (dragged instanceof Label)
            globalSearch.setValue( ((Label)dragged).getValue() );
    }
]]></zscript>
</zk>

Hope that helps

Costas

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More