[Solved] How to disable a field on edit but allow entry for new rows

[Carey]

Hello,

Using the MVC Grid, I have a column used as part of a primary key (not ideal) but what I need is to be able to disable it on Edit operations because we don;t want it to be changed, BUT allow entry for new row inserts on it so we can add new rows.


Thanks,

Carey

[Nohinn]

function onEdit(e) {
    var indexCell = $(e.cell).index();
    if($('#' + e.currentTarget.id).find('.t-grid-header th:eq(' + indexCell + ')').text() == "COLUMNNAMEHERE" && e.mode == "edit") {
        var grid = $('#' + e.currentTarget.id).data('tGrid');
        grid.cancelCell(e.cell);
    }
}

That should do the trick

[Nohinn]

Javascript code enhanced:

function onEdit(e) {
    var indexCell = $(e.cell).index();
    var grid = $('#' + e.currentTarget.id).data('tGrid');
    if(grid.columns[indexCell].title == "COLUMNNAMEHERE" && e.mode == "edit") {
        grid.cancelCell(e.cell);
    }
}

[Carey]

Hello,

I added the client event to my grid:

...
.ClientEvents(e =>
           {
               e.OnRowSelect("Grid_OnRowSelect");
               e.OnEdit("onEdit");
           })
...
<script type="text/javascript">

    function onEdit(e) {
        debugger;
        var indexCell = $(e.cell).index();
        var grid = $('#' + e.currentTarget.id).data('tGrid');
        if (grid.columns[indexCell].title == "Param Name" && e.mode == "edit") {
            grid.cancelCell(e.cell);
        }
    }

</script>

However, I am using server binding mode and I am wondering if this event ever gets called as I have placed it in debug mode and it does not call this method when you use the built in edit button on the grid.

The Cell remains editable...


Thanks,

Carey

[Nohinn]

Oh sorry, as you did not specify you were using server binding I gave you this solution.
I'm afraid you cannot work with those events on server binding.

Could you please tell me (and to other people) which editing mode are you using?

[Carey]

Oops, sorry my bad, forgot to tell you I was using that.  I am using the in line edit mode.  I was thinking I could have to build a custom popup window with it's own form as well but seemed like a lot of work to edit one field.  The inline mode works fine for adding new rows though, it just because of the database design that we can't allow the changing of the one field.

[Nohinn]

You could try this, I'm not sure if it will work 100% ok:

$(document).ready(function(){
    if($('.t-grid-edit-row').length > 0) {
        var action = $('.t-grid-edit-row').find('form').attr('action');
        if(action.indexOf('edit') != -1) {
             var indexCol = $('.t-grid-header').find('th:contains("COLUMNTITLE")').index();
             var content = $('.t-grid-edit-row').find('table > tbody').find('td:eq(' + indexCol + ')').find('input').val();
             $('.t-grid-edit-row').find('table > tbody').find('td:eq(' + indexCol + ')').find('input').hide();
             $('.t-grid-edit-row').find('table > tbody').find('td:eq(' + indexCol + ')').find('input').before(content);
        }
    }
});

As I say I'm not sure, you should try, by the way I'm assuming you will not be showing any combo, etc. on that column just an input field that's why on the last two lines of the if statement I'm searching for an input. If that's not the case adapt it to your requirements.

[Carey]

Awesome!! That worked perfectly :-)


Thanks,

Carey