This might be a little off topic and pointless to ask, but even if you do get the list sortable UI to work since it's not actually editing the tiddler its self, just moving around DOM elements isn't it just going to un-sort its self every time you have to reload the document?
On Saturday, March 2, 2013 12:00:21 AM UTC-8, Adam Sneller wrote: > > I am trying to generate an unordered list (HTML) using Eric Shulman's > TodoList template. I then want to make this sortable with the jQueryUI, so > that I can manually reorder items via drag and drop. > > I'm having trouble creating the html from MatchTags... and of course > jQuery doesn't want to fire either. > > Here's the link to the jQuery widget: > http://jqueryui.com/sortable/ > > This code is inside a Todolist tiddler: > > <html> > <style> > #sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; } > #sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; > font-size: 1.4em; height: 18px; } > #sortable li span { position: absolute; margin-left: -1.3em; } > </style> > <ul id="sortable"> > </html> > <<matchTags {{"<html><li></html><<tiddler CheckboxToggleTag with: Done > [[To Do]] %0\>\> %0<html></li></html>"}} "" sort:title To Do OR Done>> > <html></ul></html> > <script> > jQuery(function() { > jQuery( "#sortable" ).sortable(); > jQuery( "#sortable" ).disableSelection(); > }); > </script> > > This code is in MarkupPostHead: > > <link rel="stylesheet" href=" > http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css"; /> > <link rel="stylesheet" href="/resources/demos/style.css" /> > > And the jQueryUI-1.10.1 library is in its own tiddler, tagged with > systemConfig. > > Oh by-the-way (for anyone who could use this) I was able to get the > Sortable widget to work in a separate tiddler, on a static unordered list. > Here's the code: > > <html> > <style> > #sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; } > #sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; > font-size: 1.4em; height: 18px; } > #sortable li span { position: absolute; margin-left: -1.3em; } > </style> > <ul id="sortable"> > <li class="ui-state-default"><span class="ui-icon > ui-icon-arrowthick-2-n-s"></span>Item 1</li> > <li class="ui-state-default"><span class="ui-icon > ui-icon-arrowthick-2-n-s"></span>Item 2</li> > <li class="ui-state-default"><span class="ui-icon > ui-icon-arrowthick-2-n-s"></span>Item 3</li> > <li class="ui-state-default"><span class="ui-icon > ui-icon-arrowthick-2-n-s"></span>Item 4</li> > <li class="ui-state-default"><span class="ui-icon > ui-icon-arrowthick-2-n-s"></span>Item 5</li> > <li class="ui-state-default"><span class="ui-icon > ui-icon-arrowthick-2-n-s"></span>Item 6</li> > <li class="ui-state-default"><span class="ui-icon > ui-icon-arrowthick-2-n-s"></span>Item 7</li> > </ul> > </html> > <script> > jQuery(function() { > jQuery( "#sortable" ).sortable(); > jQuery( "#sortable" ).disableSelection(); > }); > </script> > > > I appreciate any input—thanks! > -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/tiddlywiki?hl=en. For more options, visit https://groups.google.com/groups/opt_out.
