Search jQuery

jQuery Forum

Using jQuery

Majid Lot..

datatables inside tab with a theme

in Using jQuery • 6 years ago

Hi,

I have a problem using a jquery datatable inside a tab, here is what I did :

<link rel="stylesheet" href="css/jquery-ui-1.10.4.css">
<link rel="stylesheet" href="css/jquery-ui-Redmond.css">
<script src="js/jquery-1.10.2.js"></script>
<script src="js/jquery-ui-Redmond.js"></script>
<script src="js/jquery.cookie.js"></script>
<script>
$(function() {
$("#tabs").tabs({
activate: function (e, ui) {
$.cookie('selected-tab', ui.newTab.index(), { path: '/' });
},
active: $.cookie('selected-tab')
});
});
</script>
<div id="tabs">
<ul>
<li><a href="/Grouping/listSAIAdminsAgency.do">SAI Admins</a></li>
<li><a href="/Grouping/listSAIAdminsIFenv.do">Environments</a></li>
<li><a href="/Grouping/listSAIAdminsIFtype.do">Transfer Types</a></li>
</ul>
</div>

listSAIAdminsAgency.do is a server side action that forward to a jsp file called : listSAIAdmins.jsp :

<H1><bean:message key="tablecaption.adminList" /></H1>
<div id="saiAdminList" >
<table id="saiAdminListTable" class="display" width="90%" border="0" >
<thead>
<tr>
<th><bean:message key="label.name" /></th>
<th><bean:message key="label.emailAddress" /></th>
</tr>
</thead>
<tbody>
<logic:iterate id="admin" name="adminList">
<tr>
<td><bean:write name="admin" property="fName"/> <bean:write name="admin" property="lName"/></td>
<td><bean:write name="admin" property="email"/></td>
</tr>
</logic:iterate>
</tbody>
</table>
</div>
<script type="text/javascript" src="js/enhance.js"></script>
<script type="text/javascript">
enhance({
loadScripts: [
'js/jquery-1.10.2.js',
'js/jquery.dataTables -1.10.3.js',
'js/onload.listSAIAdmins.js',
'js/jquery.cookie.js',
'js/loadhelp.js'
],
loadStyles: [
'css/jquery-ui-1.10.4.css',
'css/jquery.dataTables -1.10.3.css',
'css/jquery-ui-Redmond.css'
]
});
</script>

and this is the result :

http://s29.postimg.org/jg5o05fd3/sai_Admin.png

Thanks, your help is appreciated.

Replies(7)

jakecigar

Re: datatables inside tab with a theme

6 years ago

You have a CSS problem. It looks like your table is being centered. Use your web inspector to see where the space comes from.

JΛ̊KE

Majid Lot..

Re: datatables inside tab with a theme

6 years ago

I found out that there is :

width="90%" and style="width: 90%;"

when I delete style="width: 90%;" from the inspector, the left and right spaces disapear,

But don't know where style="width: 90%;" come from .

jakecigar

Re: datatables inside tab with a theme

6 years ago

On the right you get several views (in chrome). If you select Styles, you get to see where it came from.

JΛ̊KE

Majid Lot..

Re: datatables inside tab with a theme

6 years ago

I have already looked in the style, did not see anything that has that width.

jakecigar

Re: datatables inside tab with a theme

6 years ago

I see that it’s in the HTML, not the CSS. Is it from the data tables plugin?

JΛ̊KE

Majid Lot..

Re: datatables inside tab with a theme

6 years ago

Here is what I found, but it does not say which file it is located :

It works fine when I comment from the inspector this :

width: 90%;

}

 but
  I don't know where to locate this element.style .

please
  your help is appreciated.

Thanks

jakecigar

Re: datatables inside tab with a theme

6 years ago

All the pictures in the world will not help. When you make a demo or share a link, we can take a look,

JΛ̊KE

Top Reply

Response title

Attachments

jQuery Forum

datatables inside tab with a theme

Replies(7)

Re: datatables inside tab with a theme

Re: datatables inside tab with a theme

Re: datatables inside tab with a theme

Re: datatables inside tab with a theme

Re: datatables inside tab with a theme

Re: datatables inside tab with a theme

Re: datatables inside tab with a theme

Statistics

Tags

Actions