0

my question refers to http://goo.gl/f0Boc The code works fine for me, but now I want to enable/disable the "Edit-Button" when the value in a cell is "Yes" or "No".

In this example is written:

// you can use getCell or getRowData to examine the contain of

// the selected row to decide whether the row is editable or not

I need an explanation how I could change the code so that the code runs with jqGrid('getCell',rowid,'cellContent')?

What I need is if cellContent is "Yes" then disable "Edit-Button".

Thanks in advance for your efforts,

best regards

Stephan

<script type="text/javascript">
$(function(){ 
  $("#list").jqGrid({ 
    url:'example.php', 
    datatype: 'xml',
    mtype: 'GET',
    colNames:['User ID','Name', 'Firstname','CDS-ID','E-mail','Password', 'Registration
                  Date','Account Activated', 'Account Activation Date', 'Role'],
    colModel :[ 
               {name:'idUser_registration', index:'idUser_registration', width:55,
                  editable:true, editoptions{readonly:true},search:true}, 
...
               {name:'account_activated', index:'account_activated', width:150, align:'right',
                      edittype:'checkbox',editoptions: { value:"Yes:No" }, editable:true, 
                          search:true}, 
... ],
    pager: '#pager',
    rowNum:10,
    rowList:[10,20,30],
    sortname: 'idUser_registration',
    sortorder: 'asc',
    viewrecords: true,
    gridview: true,
    caption: 'My grid',
    editurl: 'example2.php',
    beforeSelectRow: function(rowid) {
                       var selRowId = $(this).getGridParam('selrow'),
                       celValue = $(this).getCell('getCell', selRowId, 'list_account_activated'),
                       tr = $("#"+rowid);
// you can use getCell or getRowData to examine the contain of
// the selected row to decide whether the row is editable or not
                       if (selRowId !== rowid && !tr.hasClass('not-editable-row')) {
// eneble the "Edit" button in the navigator
                       $("#edit_" + this.id).removeClass('ui-state-disabled');
                       $("#del_" + this.id).removeClass('ui-state-disabled');
                       } 
                      else {
// unselect previous selected row
// disable the "Edit" and "Del" button in the navigator
                       $("#edit_" + this.id).addClass('ui-state-disabled');
                       $("#del_" + this.id).addClass('ui-state-disabled');
                       }
return true; // allow selection or unselection
},
loadComplete: function() {
                          // just one example how to mark some rows as non-editable is to add
                          // some class like 'not-editable-row' which we test in beforeSelectRow
                          $("tr.jqgrow:even",this).addClass('not-editable-row');
                          }
}).jqGrid('navGrid','#pager',
{}, //options
{closeAfterEdit:true,mtype:'GET',editCaption: "Activate
Account",height:400,reloadAfterSubmit:true },
{reloadAfterSubmit:false}, // del options
{} // search options
);
$("#edit_").click(function() {
var gr = jQuery("#list").jqGrid('getGridParam','selrow');
if( gr != null ) jQuery("#list").jqGrid('editGridRow',gr,{}); 
});
$("#del_").click(function(){
var gr = jQuery("#list").jqGrid('getGridParam','selrow');
if( gr != null ) jQuery("#list").jqGrid('delGridRow',gr,{mtype:'GET',reloadAfterSubmit:true});
});
}); 
</script>
4

1 回答 1

0

I modified the referenced demo for you. The main part of the code is the following

onSelectRow: function (rowid) {
    var thisId = $.jgrid.jqID(this.id),
        isCompleted = $(this).jqGrid("getCell", rowid, "isCompleted");

    // you can use getCell or getRowData to examine the contain of
    // the selected row to decide whether the row is editable or not
    if (isCompleted !== "Yes") {
        // eneble the "Edit" button in the navigator
        $("#edit_" + thisId).removeClass('ui-state-disabled');
        $("#del_" + thisId).removeClass('ui-state-disabled');
    } else {
        // unselect previous selected row
        // disable the "Edit" and "Del" button in the navigator
        $("#edit_" + thisId).addClass('ui-state-disabled');
        $("#del_" + thisId).addClass('ui-state-disabled');
    }
}

You can see new demo here.

于 2013-03-30T22:35:34.607 回答