quill-better-table
quill-better-table copied to clipboard
soccerloway
Alignment for table
First, I wrapped table with a scrollable div to show intact table, and the width of scrollable div was 100 percent. Second, to achieve that, it must change the layout styles and change the algorithm for table operations. The complexity will increase. I think alignment for table is hard to achieve in this repo, but is possible.
The main problem I see with the alignment is with column-width-tool when I center the table the tool breaks.
@MuhammedAlkhudiry Yes. Since the column-width calculation depend on locations of domNode.getBoundingClientRect(), the alignment changes will make calculation errors.
do you know any other API (to change the size of an element by dragging)?, I believe It's worth rebuilding the tool just to make it like Word and Google Docs,
see this https://www.brainbell.com/javascript/making-resizable-table-js.html this is perfect. also, this may help https://www.brainbell.com/javascript/download/demo-resizable.html this is good article https://medium.com/the-z/making-a-resizable-div-in-js-is-not-easy-as-you-think-bda19a1bc53d
this is for an editor https://www.froala.com/wysiwyg-editor/v2.0/examples/resize-table Sorry, if you are already searched and saw these.
@MuhammedAlkhudiry thanks for your detailed reply~ quill-better-table uses colgroup and col html5 tags to control the width of columns, these tags are specialized for managing attributes of table columns.
Actually, I mean the calculations of most operations(like: merge, unmerge, select, insert, delelte) depend on the locations(got by domNode.getBoundingClientRect()) of DOM. The alignment changes will change the locations of DOM.
I think that it need to modify the location calculations for support alignment.
see this https://www.brainbell.com/javascript/making-resizable-table-js.html this is perfect. also, this may help https://www.brainbell.com/javascript/download/demo-resizable.html this is good article https://medium.com/the-z/making-a-resizable-div-in-js-is-not-easy-as-you-think-bda19a1bc53d
this is for an editor https://www.froala.com/wysiwyg-editor/v2.0/examples/resize-table Sorry, if you are already searched and saw these.
I replaced your tool (sorry :() with this method https://www.brainbell.com/javascript/making-resizable-table-js.html and removed the colgroup, and It's working even if the table is centered or in the right. but col-tool is used in the operations menu so I need to deal with this
You are welcome:) That's cool. It looks like you have made the table module more powerful~ I will seriously consider your suggests.
see this https://www.brainbell.com/javascript/making-resizable-table-js.html this is perfect. also, this may help https://www.brainbell.com/javascript/download/demo-resizable.html this is good article https://medium.com/the-z/making-a-resizable-div-in-js-is-not-easy-as-you-think-bda19a1bc53d this is for an editor https://www.froala.com/wysiwyg-editor/v2.0/examples/resize-table Sorry, if you are already searched and saw these.
I replaced your tool (sorry :() with this method https://www.brainbell.com/javascript/making-resizable-table-js.html and removed the colgroup, and It's working even if the table is centered or in the right. but col-tool is used in the operations menu so I need to deal with this
@KMLX28 can you share your code sir on how you implemented it?
