hm...
multiple IDs are definetly not valid.
But I think you could easily replace the part:
$("#additem").click(function(){
$('ul.items')
.append('<li id="newitem">new item</li>')
.SortableAddItem(document.getElementById('newitem'));
});
with something like this:
var myi = 1;
$("#additem").click(function(){
$('ul.items')
.append('<li class="newitem-"'+myi+'>new item</li>')
.SortableAddItem( $('li.newitem-'+myi) );
myi++;
});
(not tested, just an idea)
or perhaps you could create the new .Sortable directly:
$("#additem").click(function(){
$('ul.items')
.append('<li class="sortableitem">new item</li>')
.Sortable(
{
accept : 'sortableitem',
helperclass : 'sorthelper',
activeclass : 'sortableactive',
hoverclass : 'sortablehover',
opacity: 0.8,
fx: 200,
axis: 'vertically',
opacity: 0.4,
revert: true
}
)
});
this should do the trick...
(again, not tested)
On 12 Nov., 12:57, asle <[EMAIL PROTECTED]> wrote:
> Thanks webrocker,
> sorry for my frustration. I solved this myself and saw your reply
> which was exactly what solved it. In the sortable plugin you can
> declare a new object as a .Sortable. I was a bit lost about "listen"
> and "live query". Still a couple of things I am not sure about:
> - I think you need the .ready part but this script is at the bottom so
> I guess not
> - The id="newitem" is adde to every new element. That is really not
> correct to have a lot of elements with the same id?
>
> But for any others frustrated this does the following with the
> sortable plugin
> (http://interface.eyecon.ro/docs/sort):
>
> - makes .Sortable objects of list items
> - adds a new item to the list
> - the new item is also sortable
>
> Sometimes I make things so complicated when they are not :-)
>
> <span id="additem">New item</span>
> <ul class="items">
> <li class="sortableitem">Item 1</li>
> <li class="sortableitem">Item 2</li>
> <li class="sortableitem">Item 3</li>
> <li class="sortableitem">Item 4</li>
> </ul>
> <script type="text/javascript">
> $(document).ready(
> function() {
> $('ul.items').Sortable(
> {
> accept : 'sortableitem',
> helperclass : 'sorthelper',
> activeclass : 'sortableactive',
> hoverclass : 'sortablehover',
> opacity: 0.8,
> fx: 200,
> axis: 'vertically',
> opacity: 0.4,
> revert: true
> }
> )
> }
> );
>
> $("#additem").click(function(){
> $('ul.items')
> .append('<li id="newitem">new item</li>')
> .SortableAddItem(document.getElementById('newitem'));
> });
> </script>
>
> On Nov 12, 8:41 am, webrocker <[EMAIL PROTECTED]> wrote:
>
> > hi,
> > I would try and re-declare the .Sortable object after you've appended
> > the content and see if that works.
> > This would mean that the .Sortable object works only on elements
> > present inside the ul the moment the object is "given".
> > Prior to this I would have a look at the generated source after you've
> > clickedthe #additem to see if the .append works as you expected it.
>
> > On 12 Nov., 02:39, asle <[EMAIL PROTECTED]> wrote:
>
> > > Where do I go for help on this. Anyone?
