alalonde / angular-scrollable-table

A fixed header table directive for AngularJS
MIT License
68 stars 48 forks source link

support Bootstrap3 and resize columns #12

Closed Gary-Li closed 10 years ago

Gary-Li commented 10 years ago

Hi Alec, thank you and your great scrollable-table! The fixed header and sort feature are very useful! Based on my project requirement, I added resizing columns feature and upgrade Bootstrap to version 3. please take a look at code, you can find a demo from http://jsfiddle.net/Gary_Li/T9Wek/. If they make sense to your project, that's would be my pleasure :)

guimou commented 10 years ago

Thanks a lot, I was struggling with adaptation for BS3, your changes work perfectly. One question though, how to get rid of the horizontal scrollbar when not needed?

alalonde commented 10 years ago

Thanks for migrating this to Bootstrap 3, it was badly needed. If you fix the always-present horizontal scrollbar I will merge. I will also create a branch for the old bootstrap 2 code.

Gary-Li commented 10 years ago

I think the horizontal scrollbar is dependent on your container, for the DEMO(http://jsfiddle.net/Gary_Li/T9Wek/), if remove the width of test-container or make it smaller, the horizontal scrollbar would be gone. BTW, the style min-width of "test-container table th" would control the how small for each column can be resize.

guimou commented 10 years ago

I don't understand your demo: when I remove the width in the test-container it removes the horizontal scrollbar but messes the header widths. From looking at how the width is calculated and doing some testing, I think the problem is that this calculation is done before populating the table. So if no vertical scrollbar is needed everything is fine. But if the dataset is too long the vertical scrollbar appears, which reduces available space by about 15px, which makes the horizontal scrollbar appear. What I tried to do is tweak the formula to reduce the calculated width of the container by 15px, but that creates other problems of course when no vertical scrollbar is needed... The good solution would be to recalculate width when vSB appears, but this is tricky. Well, for me at least!

Gary-Li commented 10 years ago

Um, I think I understood wrong about your problem. I will fix that ASAP.

Gary-Li commented 10 years ago

Hi Alec, I fixed horizontal scroll issue and some problems when user resize whole table. please let me know if anything doesn't make sense. Thanks!

guimou commented 10 years ago

Hi Gary, Seems to work well, except for a small error. Line 158 throws "ReferenceError: newWidth is not defined" (does it in your Fiddle and of course in my own code when using it). You use it if the original width of element is null, but as I don't understand exactly what you want to do, I don't know with what to replace it. Also, what is the use of lines 143-145? It's a function nested inside another one, with the same name, and that does not seem to be used. Sorry if the answer is obvious, I'm not an expert coder... Thanks.

Gary-Li commented 10 years ago

Hi guimou, the line of 158 was a mistake, I was changed variable but missed that one, thanks a lot:) and the lines 143-145, when you want to execute something only once, you can do something like that, in the function, replace itself when the function execute first, then next time to call this function the new content of function would be executed, for this case, "return length;" would be executed from second time. but it seems become not necessary since I changed some logics, I have clean the code. Thank you for your review:)

guimou commented 10 years ago

Great! Thanks a lot for educating me, I will surely use the trick instead of setting up some control var to make sure it fires once only.

crissi commented 10 years ago

So will this get merged?