dhtmlxgrid and Spring form inputs

Suite and Optimus Suite 5
#1

I am trying to create dhtmlxgrid over HTML table like so:

  var grid = new dhtmlXGridFromTable('feesTableId');
  grid.enableColumnAutoSize(true);
  grid.enableResizing("false,false,false,false,false");
  grid.setEditable(false);

The problem is my html table is tied to Spring form tags:

  <table style="border: solid 1px black;width:794px" id="feesTableId">
     <thead>
        <tr style="background-color:#F6DE55;color:black;">
           <th style="padding:6px;border-bottom:solid 1px black;">Due Date</th>
           <th style="padding:6px;border-bottom:solid 1px black;">Name</th>
           <th style="padding:6px;border-bottom:solid 1px black;">Fee Amount</th>
           <th style="padding:6px;border-bottom:solid 1px black;">Apply</th>
           <th style="padding:6px;border-bottom:solid 1px black;">Recurring</th>
        </tr>
     </thead>
     <tbody>
        <c:forEach items="${dtAgreement.fees}" var="fee" varStatus="fStatus">
           <tr>
          ...  
              <td style="padding:6px;">
                 <div style="width:72px;">
                    <form:input path="fees[${fStatus.index}].feeAmount" cssStyle="width:60px;"/>
                 </div>
              </td>
              <td style="padding:6px;">
                 <div style="width:68px;">
                    <form:select path="fees[${fStatus.index}].apply" cssStyle="width:60px;">
                       <form:option value="true" label="Yes"/>
                       <form:option value="false" label="No"/>
                    </form:select>
                 </div>
              </td>
          ...

When the page renders, neither input no select box cannot be accessed: they are on the page, but I cannot change the values in either one.
Anybody have any ideas why this might be happening?

#2

Try to call dhtmlxGrid initialization script on body’s onload event:

...

function doInitGrid(){
//init grid here
}