Any idea ?
On Aug 28, 2:47 pm, Ady <[email protected]> wrote:
> I got stuck into problem since 2 days. Here we have drug and drop and
> we want to do clone items from right box to left. If i use draggable,
> it works, but all droped items is no more possible to delete after
> drop ???
>
> If i use both sortable, there is not posible to clone (sortible dont
> support clone) ???
>
> How can i resolve this. is it bug or am i doing something wrong.
> Gol is to have "read only" items in right side with possibility to
> drag and drop to left side and after to manipulate left list with sort
> and delete.
> Tnx in advance
>
> <!doctype html>
> <html lang="en">
> <head>
>
> <style type="text/css">
> .playlist
> {
> width: 400px;
> background-color: #999;
> float:left;
> clear: both;
>
> }
>
> .browser
> {
> width: 400px;
> background-color: #999;
> float:left;
> clear: both;
>
> }
>
> .main-item
> {
> width: 400px;
> background-color: #999;
> float:left;
> clear: both;
>
> }
>
> .move-item {
> cursor: move;
> background-color: #CCC;
> width: auto;
> float: left;}
>
> .name-item {
> cursor: text;
> width: auto;
> float: left;}
>
> .delete-item {
> cursor: pointer;
> background-color: #666;
> width: auto;
> float: right;}
>
> </style>
>
> <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
> <script type="text/javascript" src="jquery-ui-1.7.2.custom.min.js"></
> script>
>
> <script type="text/javascript">
> $(function() {
> // ---------------------------------------------------------------
> $(".delete-item").click(function(){
> $(this).parent().remove(); // delete row eith tr
> class delete-item
> });
> // ---------------------------------------------------------------
> $(".playlist").sortable({ // playlist sorter
> });
> // ---------------------------------------------------------------
> $(".browser").sortable({ // browser drager
> connectWith: ".playlist",
> helper: 'clone',
> });
> // ---------------------------------------------------------------
> // $(".browser").draggable({
> // connectToSortable: '.playlist',
> // helper: 'clone',
> // });
> // ---------------------------------------------------------------});
>
> </script>
>
> </head>
> <body>
>
> <table width="800" border="1" align="center">
> <tr>
> <td width="50%">
> <div class="playlist">
>
> <div class="main-item">
> <div class="move-item"> ||| </div>
> <div class="name-item">Bla bla 1</div>
> <div class="delete-item"> X </div>
> </div>
>
> <div class="main-item">
> <div class="move-item"> ||| </div>
> <div class="name-item">Bla bla 2</div>
> <div class="delete-item"> X </div>
> </div>
>
> </div>
> </td>
> <td width="50%">
>
> <div class="browser">
>
> <div class="main-item">
> <div class="move-item"> ||| </div>
> <div class="name-item">Bla bla 4</div>
> <div class="delete-item"> X </div>
> </div>
>
> <div class="main-item">
> <div class="move-item"> ||| </div>
> <div class="name-item">Bla bla 5</div>
> <div class="delete-item"> X </div>
> </div>
>
> </div>
>
> </td>
> </tr>
> </table>
> <br>
> </body>
> </html>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
