How to set struts2jquery Grid column names from JSON result of action

I have a Struts 2 action returning a JSON result.

{"columns":["coupon","CM","CM+1","CM+2","CM+3"],"couponList":[{"coupon":3.0,"CM":"88.2323","CM+1":"89.45","CM+2":"132.3128125","CM+3":"32.82"},{"coupon":3.5,"CM":"25","CM+1":"3125","CM+2":"333","CM+3":"5"}],"Caption":"30 Yr Fixed"}

I am able to populate the grid with the data. How do I populate the column names and caption using the "columns", "Caption" property returned in the JSON result?

I am using the S2Jquery tag library. @JSP

    <%@taglib prefix="s" uri="/struts-tags"%>
    <%@taglib prefix="sj" uri="/struts-jquery-tags"%>
    <%@taglib prefix="sjg" uri="/struts-jquery-grid-tags"%>
    <link rel="stylesheet" href="../css/jqgrid_gcpm.css">
    <link rel="stylesheet" href="../css/gcp.css">
<sj:head />

<s:url id="actionurl" action="testAction">
    <s:set var="caption" value="Caption" />
</s:url>

<sjg:grid id="gridtable" caption="%{caption}" dataType="json"
    href="%{actionurl}" pager="false" gridModel="couponList"
    rowNum="-1" rownumbers="false" altRows="true" autowidth="true"
    resizable="true" shrinkToFit="true">
    <sjg:gridColumn name="coupon" index="coupon" title="Coupon"
        sortable="false" width="30" />
    <sjg:gridColumn name="CM" title="CM" sortable="false"
        formatter="htmlFormatter" />
    <sjg:gridColumn name="CM+1" title="CM+1"
        sortable="false" formatter="htmlFormatter" />
    <sjg:gridColumn name="CM+2" title="CM+2"
        sortable="false" formatter="htmlFormatter" />
    <sjg:gridColumn name开发者_StackOverflow社区="CM+3" title="CM+3"
        sortable="false" formatter="htmlFormatter" />
</sjg:grid>

<script type="text/javascript">
    function htmlFormatter(cellValue, opts, rowObject) {
        if (cellValue == null) {
            return '';
        }
        else {
            return cellValue;
        }
    }
</script>

I had the same problem and my solution was:

var myfirstrow = {description:"1"};
$("#cashReceiptLines").jqGrid('addRowData',"1", myfirstrow);

This is my grid

<sjg:grid
id="cashReceiptLines"
caption="Cash receipt lines"
gridModel="cashReceiptLines"
rowNum="15"
width="860"
dataType= "local"
rownumbers="true">
<sjg:gridColumn name="description" index="description" title="Description"/>
</sjg:grid>

Alex Vicente Chacón Jiménez alex.chacon@software-colombia.com