Download and unzip the contents of the archive to any convenient location. 
The package contains the following folders:

- [demo] - Contains the demo files.
- [css] - Contains the themes shipped with the product. For more detail on theming refer to jQuery Mobile web site

In addition to the themes file, there is one more file in the [themes] folder - ui.jqgrid-mobile.css. This is the one and only Css file jqGrid needs. Just add it after you add the reference to the jQuery Mobile theme in your HTML file containing jqGrid for PHP.

<link rel="stylesheet" type="text/css" href="css/default/jquery.mobile.css" />
<link rel="stylesheet" type="text/css" href="css/ui.jqgrid-mobile.css" />

- [js] - The javascript files of jqGrid (and the needed libraries). You need to include them in your html page.

The first file is "jquery.js" - this is the official jQuery library on which jqGrid is built upon.
The second file you need is the jquery.mobile.js javascript file. 
The third file you need is the i18n (localization) javascript file. Depending on the language you need, just pick one from the js folder.
The last one is the jqGrid javascript code itself, located in "js/jquerymobile.jqGrid.min.js"

The final result you will have in an HTML page containing jqGrid would be something similar to that:

<!DOCTYPE html> 
<html> 
<head> 
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
	<title>My First  jqGrid Mobile Grid</title> 
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet"  href="css/themes/jquery.mobile.css" />
	<link rel="stylesheet"  href="css/themes/ui.jqgrid-mobile.css" />

	<script src="js/jquery.js"></script>
	<script src="js/jquery.mobile.js"></script>
	<script language="javascript" src="js/i18n/grid.locale-en.js"></script>
	<script language="javascript" src="js/jquerymobile.jqGrid.min.js"></script>
	<script language="javascript">
	$(document).bind('pagecreate',function(){
	// Your code here
	});
	</script>
</head>
<body> 
	<div data-role="page" class="type-interior">
		<table id='grid'></table>
		<div id='pager'></div>
	<script language="javascript">
		jQuery('#grid').jqGrid({
			"hoverrows":false,
			"viewrecords":true,
			"jsonReader":{"repeatitems":false,"subgrid":{"repeatitems":false}},
			"gridview":true,
			"loadonce":true,
			"url":"datav.json",
			"scrollPaging":true,
			"autowidth":true,
			"footerrow": true,
			"userDataOnFooter": true,
			"rowNum":20,
			"rowList" : [20,40,60],
			"sortname":"OrderID",
			"height":200,
			"datatype":"json",
			"colModel":[
				{"name":"OrderID","index":"OrderID","sorttype":"int","key":true,"width":80,"editable":true},
				{"name":"OrderDate","index":"OrderDate","sorttype":"datetime","formatter":"date","formatoptions":{"srcformat":"Y-m-d H:i:s","newformat":"m/d/Y"},"editable":true},
				{"name":"ShipName","index":"ShipName","sorttype":"string","editable":true},
				{"name":"Freight","index":"Freight","sorttype":"numeric","editable":true, "formatter": "number"}
			],
			"loadError":function(xhr,status, err){ 
				try {
					jQuery.jgrid.info_dialog(jQuery.jgrid.errors.errcap,'<div class="ui-state-error">'+ xhr.responseText +'</div>', jQuery.jgrid.edit.bClose,
					{buttonalign:'right'});
				} catch(e) { 
					alert(xhr.responseText);} 
			},
			"pager":"#pager"
		});
	</script>
	</div>
</body>
</html>

That is all.