Si dovrebbe definire una classe CSS manichino come
.unsortable{}
quindi chiamare sortableRows
metodo jqGrid sostituzione di default items: '.jqgrow'
parametro con
jQuery("#list").jqGrid('sortableRows', { items: '.jqgrow:not(.unsortable)'});
Ora si deve solo aggiungere la classe "non ordinabile" per le righe , che non vuoi permettere di essere ordinabile. Lasciateci avere nelle righe della griglia con id 'C28011' e 'C28015'. Poi per farlo è possibile utilizzare setRowData
metodo jqGrid
oppure chiamare addClass
metodo jQuery
direttamente:
jQuery("#list").setRowData ('C28011', false, 'unsortable');
jQuery("#C28015",jQuery("#list")[0]).addClass('unsortable');
AGGIORNATO (aggiungere un esempio di codice): Dopo aver letto del tuo commento Penso che sarebbe meglio se io postare qui un esempio di codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head">
<title>Demonstration of disabling sortableRows on some jqGrid rows</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/redmond/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-3.6.5/css/ui.jqgrid.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-3.6.5/js/i18n/grid.locale-en.js"></script>
<script type="text/javascript" src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-3.6.5/js/jquery.jqGrid.min.js"></script>
<style type="text/css">
#sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
#sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.4em; height: 18px; }
#sortable li span { position: absolute; margin-left: -1.3em; }
.unsortable {}
</style>
<script type="text/javascript">
//<![CDATA[
jQuery(document).ready(function() {
jQuery("#sortable").sortable({ items: 'li:not(.unsortable)'});
jQuery("#sortable").disableSelection();
jQuery("#sortrows").jqGrid({
datatype: 'local',
colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'],
colModel:[
{name:'id',index:'id', width:55},
{name:'invdate',index:'invdate', width:90},
{name:'name',index:'name asc, invdate', width:100},
{name:'amount',index:'amount', width:80, align:"right"},
{name:'tax',index:'tax', width:80, align:"right"},
{name:'total',index:'total', width:80,align:"right"},
{name:'note',index:'note', width:250, sortable:false}
],
rowNum:10,
width:700,
rowList:[10,20,30],
pager: '#psortrows',
sortname: 'invdate',
viewrecords: true,
sortorder: "desc",
caption:"Sortable Rows Example"
});
jQuery("#sortrows").jqGrid('sortableRows', { items: '.jqgrow:not(.unsortable)'});
var myData = [
{id: "11", invdate: "2007-10-06", name: "Client 1", amount: "600.00", tax:"120.00", total: "720.00", note: "not sortable"},
{id: "9", invdate: "2007-10-06", name: "Client 1", amount: "200.00", tax:"40.00", total: "240.00", note: "not sortable"},
{id: "5", invdate: "2007-10-05", name: "Client 3", amount: "100.00", tax:"0.00", total: "100.00", note: "not sortable"},
{id: "7", invdate: "2007-10-05", name: "Client 2", amount: "120.00", tax:"12.00", total: "134.00", note: "no tax at all"},
{id: "6", invdate: "2007-10-05", name: "Client 1", amount: "50.00", tax:"10.00", total: "60.00", note: ""},
{id: "4", invdate: "2007-10-04", name: "Client 3", amount: "150.00", tax:"0.00", total: "150.00", note: "no tax"}
];
for (var i = 0; i < myData.length; i++) {
jQuery("#sortrows").addRowData(myData[i].id, myData[i]);
}
jQuery("#sortrows").setRowData ('11', false, 'unsortable');
jQuery("#sortrows").setRowData ('9', false, 'unsortable');
jQuery("#5",jQuery("#sortrows")[0]).addClass('unsortable');
});
//]]>
</script>
</head>
<body>
<div class="demo">
<ul id="sortable">
<li class="ui-state-default unsortable"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 1 (not sortable)</li>
<li class="ui-state-default unsortable"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 2 (not sortable)</li>
<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 3 (sortable)</li>
<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 4 (sortable)</li>
<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 5 (sortable)</li>
<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 6 (sortable)</li>
<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 7 (sortable)</li>
</ul>
</div>
<table id="sortrows"></table>
<div id="psortrows"></div>
</body>
</html>
In questo codice che uso al dall'inizio funzionalità ordinabile standard di jQuery per consentire gli elementi sorta solo selezionati. Di quanto faccia lo stesso all'interno di jqGrid. Puoi vedere questo esempio lavorando qui http://www.ok-soft-gmbh.com/jqGrid/sortableRows.htm. Quindi, l'aggiunta di una classe fittizia "unsortable" a una riga segue la disattivazione della funzionalità "ordinabile". Rimozione di questo interruttore di classe "ordinabile" su. Puoi farlo in qualsiasi momento per righe di griglia selezionate o per tutti (jQuery("tr",jQuery("#list")[0]).addClass('unsortable');
).
L'unica cosa che non si dovrebbe dimenticare: si dovrebbe chiamare setRowData
o addClass
dopo che i dati aggiunti nella griglia, ad esempio, all'interno di loadComplete
funzione del jqGrid.
AGGIORNATO 2: Vedere the answer che descrive come disattivare l'ordinamento per righe specifiche della griglia.Usa possibilità esistenti nelle versioni più recenti di jqGrid e jQuery UI.
Grazie. Mi piace il tuo approccio poiché fa tutto con una sola riga di codice, ma sacrifica la granularità delle righe indipendenti di Oleg. –