0

I am trying to see if/how I can possibly use the jQuery UI Droppable plugin to drop an object into a nicEdit container at a specific cursor location.

I saw a similar question regarding pasting html code at a nicEdit cursor location here.

Using the jQuery UI Droppable shopping card demo, I want to be able to select an item from the products area and drop it into the Shopping Cart area. However, instead of the drop event populating the example div:

<div id="cart">
<h1 class="ui-widget-header">Shopping Cart</h1>
<div class="ui-widget-content">
    <ol>
        <li class="placeholder">Add your items here</li>
    </ol>
</div>

I want to drop the object into a textarea associated with the nicEdit control. In other words, I want to drag an icon/object on the page and drop into the nicEdit textarea at the active cursor location. Dropping the icon will populate some predefined html to be inserted at the cursor location in the nicEdit textarea object.

Any suggestions are appreciated.

Community
  • 1
  • 1
Gunnar
  • 661
  • 1
  • 11
  • 29

1 Answers1

1

I think you will find part of the answer here: http://pastebin.com/sj8QA4xx. It shows how to insert content at the current cursor location in a nicEdit editor. I am using that code successfully to insert pre-defined text from a library into a nicEdit, in response to button clicks. I don't know about the drag-and-drop part - if the is still receiving events after nicEdit is activated, perhaps you could intercept those and tie it into this code. Good luck!

Gordon Kramer
  • 11
  • 1