Issue with dataTable growing large.

newGuy

I have searched the forums, and tried many things, but to no avail. I will try to describe this best as possible, and code is below.

When the page loads, there is no data and the table looks fine. Now, the problem is, when the user enters a search parameter, and submits, the table gets processed fine, but when it draws, its width is HUGE. In addition, the scrollbar doesn't appear through the AJAX call as well, only if we have data populated before the AJAX call.

This only happens on the return from the AJAX call, but for the past few days, I can not track it down.
Am I missing something obvious with the dataTable setup somewhere?

[code]
<%@ page language="java" contentType="text/html; charset=UTF-8"%>

<%@ include file="/portlet/@ENV_PO_PORTAL_NAME@/layout/init.jsp" %>





var table;
jQuery(document).ready(function() {
jQuery('#metaData').dataTable( {
"sPaginationType": "full_numbers" ,
"sScrollY": "400px",
"bAutoWidth": true,
"sAjaxDataProp": "data"
} );

} );

var fieldErrors = false;
function searchKey(searchFlag) {
var actionUrl = '/@ENV_PO_PORTAL_NAME@/portlet_action/@ENV_PO_PORTAL_NAME@/metadatatag';
var keyName = document.getElementById('searchMetadataTag').value;
validateField(keyName);
if(!fieldErrors)
{
var action;
if(searchFlag)
{
action = "searchKey";
}

jQuery.ajax({
type: "POST",
url: actionUrl,
async: false,
data: { keyName: keyName,action: action},
dataType: "json",
error: function(e) {
alert("Failure: " + e);
fieldErrors = false;
},
success: function(data)
{
if(data != null && typeof data != 'undefined')
{
table = jQuery('#metaData').dataTable();
table.fnClearTable();
for(var i=0; i

fbas

You can constrain it in the X direction with sScrollX, or if you set a width in your table

[code]
jQuery(document).ready(function() {
jQuery('#metaData').dataTable( {
"sPaginationType": "full_numbers" ,
"sScrollY": "400px",
"sScrollX": "600px",
"bAutoWidth": true,
"sAjaxDataProp": "data"
} );

} );
[/code]

[code]

[/code]

or in your css "display" class