jquery - Making actions appears in JQGrid only when a boolean is true -
i have data displayed in jqgrid, , actions column, have icons delete , edit actions. in data retrieve display in grid, have boolean, , display icons when boolean true. how done?
here piece of code of jqgrid display:
jquery("#datagrid").jqgrid({ stateoptions: getstateoptions("creation-site"), url: listurl, datatype: "json", loaderror: viewerror, colnames: ['', 'nom', 'n de dépôt geopost', 'iata', 'groupe id', 'site de rattachement', 'poste comptable', 'centre cout', 'description'], colmodel: [ {name: 'myac', width: 80, fixed: true, sortable: false, resize: false, formatter: 'actions', formatoptions: {keys: true, editbutton: true, }}, {name: 'nom', index: 'nom', editable: true, edittype: "text", sortable: true}, {name: 'geopostdepotnumber', index: 'geopostdepotnumber', editable: true, edittype: "text", sortable: true}, {name: 'iata', index: 'iata', editable: true, edittype: "text", sortable: true}, {name: 'groupeid', index: 'groupeid', editable: true, edittype: "text", sortable: true}, {name: 'siterattachement', index: 'siterattachement', editable: true, edittype: "text", sortable: true}, {name: 'postecomptable', index: 'postecomptable', editable: true, edittype: "text", sortable: true}, {name: 'centrecout', index: 'centrecout', editable: true, edittype: "text", sortable: true}, {name: 'description', index: 'description', editable: true, edittype: "text", sortable: true} ], rowlist: [10, 20, 50, 100, 500, 1000, 5000], pager: '#navgrid', sortname: 'title', sortorder: "asc", viewrecords: true, loadonce: true, gridview: true, ignorecase: true, height: 'auto', editurl: 'clientarray', caption: '<spring:message code="creationsite.title"/>' });
edit: here sample json, 2 lines:
[{"id":1,"centrecout":"211177","geopostdepotnumber":"0401","iata":"mlv","postecomptable":"77999","referentielid":5,"siterattachement":" ","nom":"ceci est un nom","networkrefid":1,"networkrefname":"fr-chr","description":"marne-la-vallee","groupeid":"chrf","manual":false}, {"id":2,"centrecout":"211174","geopostdepotnumber":"0402","iata":"ftv","postecomptable":"75998","referentielid":5,"siterattachement":" ","nom":null,"networkrefid":1,"networkrefname":"fr-chr","description":"alfortville","groupeid":"chrf","manual":false}]
the actions should disabled depending on "manual" field in json.
edit: following understood oleg's answer, added grid:
rowattr: function (rd) { if (rd.manual === false) { // verify testing correct in case return {"class": "not-editable-row"}; } },
but it's still not working.
if understand correctly enough hide column myac
conditionally directly after grid created or after set value isreadonly
:
if (isreadonly) { jquery("#datagrid").jqgrid("hidecol", "myac"); }
another common remark. i'd recommend examine value default
column on the page of documentation. see default value of edittype
, sortable
"text" , true
values use columns of colmodel
. additionally can consider change default value of colmodel
items respect of cmtemplate
(see the old answer). 1 more remark: values of index
have same value of name
in case of usage loadonce: true
. if 1 don't specify index
value of name
property used instead automatically. can reduce colmodel
code example
colmodel: [ { name: 'myac', width: 80, fixed: true, sortable: false, resize: false, formatter: 'actions', formatoptions: { keys: true, editbutton: true }, editable: false }, { name: 'nom' }, { name: 'geopostdepotnumber' }, { name: 'iata' }, { name: 'groupeid' }, { name: 'siterattachement' }, { name: 'postecomptable' }, { name: 'centrecout' }, { name: 'description' } ], cmtemplate: { editable: true }
such code can more easy read , maintained.
by way if know value of isreadonly
before grid created can use additionally
cmtemplate: { editable: !isreadonly }
the last remark: use sortorder: "asc"
option has default value. can remove option. should verify whether sortname: 'title'
correct, because don't have column 'title'
. suppose it's "cut , pasted" error.
updated: if need disable editing of rows can following
rowattr: function (rowdata) { if (rowdata.manual === false) { return { "class": "not-editable-row" }; } }, loadcomplete: function () { $(this).find("tr.not-editable-row") .find(".ui-inline-edit,.ui-inline-del") .hide(); }
the corresponding demo uses value closed
column disable editing. resulting grid looks on picture below
Comments
Post a Comment