Button Issue with BjQueryUI

Button Issue with BjQueryUI

jnorrisjnorris Posts: 25Questions: 0Answers: 0
edited June 2011 in TableTools
Hi All,

I am looking at adding TableTools to the DataTables in an application I'm working on, but the jquery UI L&F only gets applied to the tables that are contained within a jquery ui tab. If the table is just on a page in a div then the original buttons with images appear. The behavior is consistent in all of the jsp pages containing a DataTable definition. All the tables are setup exactly the same in the initialization code other than the number of columns in the table and the datasource.

I'm using DataTables 1.8.0, TableTools 2.0.1, jQuery 1.6.1 and jQueryUI 1.8.13. TableTools is being added to the DataTables using "oTableTools":{} with the swf path and button definitions.

I can live with either L&F on the buttons but not both in the same application. Anyone have any suggestions?

Thanks,
Jim

Replies

  • jnorrisjnorris Posts: 25Questions: 0Answers: 0
    The other thing to note that the application is running in IE8 and the behavior is the same for all browser compatibility settings. I also tested in FF5 with the same results.
  • allanallan Posts: 61,431Questions: 1Answers: 10,048 Site admin
    Interesting one. Are you able to give us a link please, that would really help with identifying what the problem is? If you comment out TableTools does it work as expected? This example shows that it should be possible to have tables with jQuery UI theming inside other controls: http://datatables.net/release-datatables/examples/api/tabs_and_scrolling.html .

    Allan
  • jnorrisjnorris Posts: 25Questions: 0Answers: 0
    Hi Allan,

    My test app is behind our firewall so I can't provide a link. It is the data tools buttons that show up with the jquery ui L&F when the datatable is contained in a jquery ui tab and show up with the non jquery ui buttons when the datatable is in just a div in a form, so commenting out TableTools won't prove anything. This behavior is repeatable on several different JSP pages where everything else works including the button operation in both cases.

    I'm going to create some straight html versions and see what the effect there is. I'll let you know what the results are.

    Jim
  • jnorrisjnorris Posts: 25Questions: 0Answers: 0
    Hi Allan,

    I created a simple html page with a two tab section at the top, one with a datatable with tabletools and a div below that containing a second datatable with tabletools. The datatools button in the one in the tab have the jqueryui L&F while the second one has the default button images. The flash buttons do not work though. I can zip that up and send it to you if you want. I don't see any way to upload a file in the forum ...

    Jim
  • allanallan Posts: 61,431Questions: 1Answers: 10,048 Site admin
    My e-mail address is in the header at the top of the DataTables source file. I'd be interested to see what is happening, so yes please, do send the files over.

    Allan
  • jnorrisjnorris Posts: 25Questions: 0Answers: 0
    Hi Allan,

    I sent you the files as requested. BTW, the buttons also have the jquery ui L&F when the table is in an accordian.

    Jim
  • allanallan Posts: 61,431Questions: 1Answers: 10,048 Site admin
    Hi Jim,

    Excellent - thanks very much for the files - makes it much easier! It looks like it's just a CSS priority order in your specific set up. To get the jQuery UI styling on your "outer" table you can add the classes "ui-widget ui-widget-content" to the element with an id of "panel3". Another way would be to remove my CSS styles that you don't want :-)

    Allan
  • jnorrisjnorris Posts: 25Questions: 0Answers: 0
    Thanks Allan,

    I figured it must be something pretty simple but being mostly a back-end developer CSS is not my strong point so I didn't see anything obvious.

    Jim
  • allanallan Posts: 61,431Questions: 1Answers: 10,048 Site admin
    I wouldn't have called that one obvious :-). I spotted it by looking at the CSS priority order in Webkit's Inspector (Firebug would work as well) - and also not being able to think of anything else that would explain it!

    Allan
This discussion has been closed.