All what you want to have in the part 1 of your question can be implemented with jqGrid 3.7.x. You should use both datatype: 'json' and loadonce: true parameters. The server should send all the data back. See http://stackoverflow.com/questions/3169408/jqgrid-setgridparam-datatypelocal/3170652#3170652 as an example.
What about the second part of your question. It seems to me that you try to make jqGrid too complex. I find much easier to set some controls (select/dropdown boxes, checkboxes or radio buttons) outside of the jqGrid (for example on top of the grid). If the user make changes in some of this control you should reload the grid from the server based on the new choosed parameters. See http://stackoverflow.com/questions/2928371/how-to-filter-the-jqgrid-data-not-using-the-built-in-search-filter-box/2928819#2928819 as an example. If you will try to combine this way with the loadonce: true parameter you should understend, that after the first load of grid with loadonce: true the other parameter datatype: 'json' will be changed to datatype: 'local'. So to reload the grid you should additionally set datatype: 'json' every time before reloading the grid.
UPDATED based on comments: Well. If you have some predefined data sets, you want load all from the server and then quick display the grid needed you can just define some dives and place all jqGrids (table and paging div elements) inside the corresponding additional div (one div per jqGrid). You can start loading the data to all this grids at the page loading. You makes parents divs invisible or hidden with respect of jQuery.show() and jQuery.hide() anytime when you need. Divs which should be hidden at the page start can have CSS style display:none.
Another option to create grids dinamically with cached data is following. You can remove a jqGrid with jQuery.remove() and insert a new one <table> and paging <div> element with a method like jQuery.after(). With this way you can construct jqGrid absolutely dynamiclly. If you do so you should take in consideration, that jqGrid create some additional divs over table and paging div elements. So to delete whole jqGrid with id="list" you should remove div with id="gbox_list". Alternative if you place both <table> and paging <div> in a parent div element and you can use jQuery.empty() and jQuery.html() methods on the parent div to remove or insert a new one jqGrid.
Now about displaying of radio buttons inside of jqGrid. This is possible if you will use custom formater. See http://stackoverflow.com/questions/2991267/jqgrid-editable-column-that-always-shows-a-select/2992064#2992064 as example how to display selects (dropdown boxes) inside of jqGrid. By the way I see no advantage to use radio buttons compareing with selects. Radio buttons took only more place on the page and users will have to scroll the page friquently.
Nevertheless I don't recommend you to use complex elements inside of jqGrid cells. I recommend you to demonstrate to your users "Inline Editing" feature of jqGrid. It means if user select a row or make double-click on a row (you can implement one way which prefer your users) the row will be switched in the editing mode with checkboxes, select boxes (dropdown boxes), text inputs and so on. This is a standard way. It have some advantages over "form editing" from the side of users comfort. The more you go away from the standard ways the more problems you could receive in the future. To demonstrate "inline editing" you can open http://trirand.com/blog/jqgrid/jqgrid.html and choose on the tree left "Row Editing" and then "Input Types". As a code example you can use http://stackoverflow.com/questions/2863874/jqgrid-edit-only-certain-rows-for-an-editable-column/2866685#2866685.
UPDATED 2: One more small remark. If the data on the server will be not changed friquently and you want more long time cache there on the client you can consider to use prmNames: { nd:null} parameter of jqGrid especially if you use Internet Explorer. If you do this the last HTTP GET results (inclusive jQuery.ajax requests) will be cached on the client and next ajax rwquests can load data from the local browser cache instead of sending requests to the server. If the server include any information about the allowed caching time in the response (HTTP headers) it will be automatically used on the client in jQuery.ajax.
UPDATED 3 based on the source code posted: You have some errors in the code. Here is the fixed code
var myGrid = $("#mygrid").jqGrid({
datatype: 'local',
colModel: [
{ name: 'AID', label: 'Some ID', key: true, width: 100,
editable: false, sorttype: "int" },
{ name: 'Name', width: 300, editable: false },
{ name: 'Group', width: 100, editable: false },
{ name: 'Info', width: 100, editable: false },
{ name: 'AValue', width: 100, editable: true, edittype: 'text' }
],
pager: '#mypager',
rowNum: 10,
rowList: [10, 20, 500],
viewrecords: true,
autowidth: true,
sortname: 'AID',
sortorder: 'desc'
});
myGrid.jqGrid('navGrid','#mypager',{edit:false,add:false,del:false,search:false});
var mydata = [];
for (var i = 0; i < 100; i++) {
mydata.push({AID:i,Name:"123",Group:"456",Info:"78",AValue:"8"});
}
myGrid.setGridParam({data: mydata}).trigger("reloadGrid");
You can try it here http://www.ok-soft-gmbh.com/jqGrid/Clientside.htm
UPDATED 4: The same example inclusive the client side editing is here http://www.ok-soft-gmbh.com/jqGrid/ClientsideEditing.htm. It is based on the http://www.trirand.com/blog/?page_id=393/help/losing-edited-cell-data-after-paging/ and http://stackoverflow.com/questions/3229141/losing-edited-cell-data-after-paging/.