dividing jqgrid dialog (form edit dialog) into two layouts

Question

I have jqgrid that has 23 headers. It has edit dialog with a form too.

The problem is from 23 headers, 2 headers are non-editable and the remaining is editable. When I click edit, it will show a long form (with one column) with 21 rows.

Can I change the layout to a form with two columns and every column has half of my total rows?

Answer 1

In your colModel code you can define a rowpos (to reorder rows) and a colpos (to provide a column) properties. This excerpt is from the jqGrid wiki page on common rules:

<script>
jQuery("#grid_id").jqGrid({
...
   colModel: [ 
      ... 
      {name:'price', ..., formoptions:{elmprefix:'(*)', rowpos:1, colpos:2....}, editable:true },
      ...
   ]
...
});
</script>

So you can define half of your fields as being in colpos : 2. I've tested this solution and it works.