Empty column names populating

matenwego

Alright so I'm using Spring 3 MVC with JQuery and trying to dynamically add column names and the data from ajax calls.

Here's the code:

HomeController:
[code]
@Controller
public class HomeController {

private static final Logger logger = LoggerFactory
.getLogger(HomeController.class);


@RequestMapping(value = "/", method = RequestMethod.GET)
public String home(Locale locale, Model model) {
logger.info("Welcome home! the client locale is " + locale.toString());

return "home";
}

@RequestMapping(value="/doajax.html", method=RequestMethod.GET)
public @ResponseBody String doAjax(){
String JSONString = "{\"RPT_TRANSACTION\":{\"COLUMNS\":[\"REQ_ID\",\"PO_ID\",\"TRANS_ID\",\"TRANS_DT\",\"TRANS_VALUE\",\"TRANS_AFF_ID\",\"PROC_RETRIEVAL_NUM\",\"PROC_REFERENCE_NUM\",\"PROC_AUTH_CODE\",\"PROC_UDF01\",\"PROC_UDF02\",\"CVV_CODE\",\"AVS_CODE\",\"SERV_ACT_NAME\",\"TRANS_STATUS_NAME\",\"ADDR_ID\",\"ADDR_ADDRESS\",\"ADDR_ADDRESS2\",\"ADDR_CITY\",\"ADDR_ZIP\",\"STATE_CODE\",\"CNTRY_ISO_A2\",\"CUST_ID\",\"CUST_FNAME\",\"CUST_LNAME\",\"CURR_CODE_ALPHA\"],\"DATA\":[]}}";
JSONObject json = (JSONObject)JSONSerializer.toJSON(JSONString);
String str = "{ \"sEcho\": 2 ," +
" \"iTotalRecords\": 2," +
" \"iTotalDisplayRecords\": 2," +
" \"DATA\": " + json.getJSONObject("RPT_TRANSACTION").getJSONArray("DATA")
.toString() +
"}";
logger.info(str);
return str;
}

@RequestMapping(value="/doajaxcol.html", method=RequestMethod.GET)
public @ResponseBody String doAjaxCol(){
String JSONString = "{\"RPT_TRANSACTION\":{\"COLUMNS\":[\"REQ_ID\",\"PO_ID\",\"TRANS_ID\",\"TRANS_DT\",\"TRANS_VALUE\",\"TRANS_AFF_ID\",\"PROC_RETRIEVAL_NUM\",\"PROC_REFERENCE_NUM\",\"PROC_AUTH_CODE\",\"PROC_UDF01\",\"PROC_UDF02\",\"CVV_CODE\",\"AVS_CODE\",\"SERV_ACT_NAME\",\"TRANS_STATUS_NAME\",\"ADDR_ID\",\"ADDR_ADDRESS\",\"ADDR_ADDRESS2\",\"ADDR_CITY\",\"ADDR_ZIP\",\"STATE_CODE\",\"CNTRY_ISO_A2\",\"CUST_ID\",\"CUST_FNAME\",\"CUST_LNAME\",\"CURR_CODE_ALPHA\"],\"DATA\":[]}}";
JSONObject json = (JSONObject)JSONSerializer.toJSON(JSONString);
JSONArray allColumns = json.getJSONObject("RPT_TRANSACTION")
.getJSONArray("COLUMNS");
List columns = new ArrayList();
for (int i = 0; i < allColumns.size(); i++) {
columns.add(allColumns.getString(i));
}
String str = "[";
for(String s : columns){
str += "{\"sTitle\":" + "\"" + s + "\"}";
if( columns.indexOf(s) != columns.size() - 1){
str +=",";
}
}
str += "]";
logger.info(str);
return str;
}
}
[/code]


home.jsp:
[code]


Home

@import "/demo_table.css";




var contextPath = "<%= request.getContextPath() %>";
$(document).ready(function() {
var columns = "";
$.ajax({
"dataType" : 'text',
"type" : "GET",
"url" : contextPath + "/doajaxcol.html",
"async" : false,
"success" : function(data) {
columns = data;
}
});
//alert(columns);
$('#table_id').dataTable({
"sScrollY" : "400px",
"aoColumns" : columns,
"bProcessing" : true,
"sAjaxSource" : contextPath + "/doajax.html",
"sAjaxDataProp" : "DATA",
"fnServerData" : function(sSource, aoData, fnCallback) {
$.ajax({
"dataType" : 'json',
"type" : "GET",
"url" : sSource,
"data" : aoData,
"success" : fnCallback
});
}
});
});
function fnShowHide(iCol) {
/* Get the DataTables object again - this is not a recreation, just a get of the object */
var oTable = $('#table_id').dataTable();

var bVis = oTable.fnSettings().aoColumns[iCol].bVisible;
oTable.fnSetColumnVis(iCol, bVis ? false : true);
}











[/code]

The problem I'm having is when I load the page the columns aren't being displayed and are actually creating about 200ish empty column titles. I know there has to be a way for this to work. Just need a little help. Thanks in advance.

Ricardo.