开发者

Making HTML Table sortable and selectable

开发者 https://www.devze.com 2022-12-10 18:38 出处:网络
I have a very specific requirement for a Prototype based JS / HTML script (or something that doesn\'t interfere with Prototype) that can add the following functionality to a normal, multi-column HTML

I have a very specific requirement for a Prototype based JS / HTML script (or something that doesn't interfere with Prototype) that can add the following functionality to a normal, multi-column HTML table:

  • Re-order rows using drag and drop and send changes to a Javascript handler function (not a "sortable table" function to order by fields, but a manual re-ordering of individual rows)

  • The re-ordering feature can be disabled/enabled using a Javascript command, when it is turned off, the rows can not be moved

  • Select one or multiple rows using Ctrl and shift keys + click,开发者_开发问答 send current selection to JS handler function on each change

Maybe somebody knows something like this and can save me a lot of time searching through the Interwebs or programming it myself. If I find anything, I'll post it here.


Scriptaculous's Sortables could work for you, but it's worth noting that sortables does not work on tables outside of Firefox.

To enable/disable sorting by javascript, use the create/destroy functions. You can also use the onUpdate callback to serialize the sortable and send it off to some url for processing.

// Enable sorting.
sortable.create( 'some-table-id', {tag: 'tr', onUpdate: your_callback_function} )

// Disable sorting.
sortable.destroy( 'some-table-id' )

I doubt this enable you to do the multi-select you're looking for, but it should get you most of the way.

  • Scriptaculous home page
  • Sortable documentation
  • Sortable.create documentation, including information about how the onUpdate callback works.


Jquery has some nice table features. I'm sure you'll find something you need over there. Just jquery.com or google it.

0

精彩评论

暂无评论...
验证码 换一张
取 消