Correct way to Allow Adding of a New Row but disable editing of a single column

State See Verified Answer
Replies 5 replies
Subscribers 14 subscribers
Views 1578405 views
Users 0 members are here

igGrid

435

Kunal posted over 11 years ago

I have a unique requirement:

My current jQuery grid works fine. Currently I have editing enabled (Features => updating). Anyhow, I have to disable editing of a specific column once added. So basically, if someone add's a record they should be able to enter "Col A, B, C, D". However if they edit, only Columns A, B, and D should be editable.

Changing the column properties for updating to Read-Only for the column also affects adding a new row. Is there any way around this?

Parents

No Data

Reply

23953

Verified Answer

Offline Martin Pavlov posted over 11 years ago

Hi,

You can easily accomplish this in cell update mode by handling the igGridUpdating.editCellStarting event and check the ui.rowAdding parameter. Here is the code:


features: [{
    name: "Updating",
    mode: "cell",
    editCellStarting: function (evt, ui) {
        if ((ui.rowAdding == false) && (ui.columnKey == "Name")) {
            return false;
        }
    }
}]

For update mode row you should handle igGridUpdating.editRowStarted, check the ui.rowAdding and show/hide the column editor by using the igGridUpdating.editorForKey API.

Here is the code:


features: [
    {
        name: "Updating",
        mode: "row",
        editRowStarted: function (evt, ui) {
            if (ui.rowAdding == false) {
                var editor = $("#grid1").igGridUpdating("editorForKey", "Name");
                $(editor).igEditor("hide");
            }
            else
            {
                var editor = $("#grid1").igGridUpdating("editorForKey", "Name");
                $(editor).igEditor("show");
            }
        }
    }
]

Hope this helps,

Martin Pavlov

Infragistics, Inc.

Children

55

Offline Andrew Murphy posted over 4 years ago in reply to Martin Pavlov

Hello - I am trying to get this to work for the cell editing, and I cannot get it to function. I have verified that the handler I assigned for event editCellStarting does get fired, and it does return false. I have used the debugger in Chrome to verify this. But it still allows the edit box to appear and be able to change the values in the grid. I am using Cell Edit model with MVC. Any thoughts on why the editing would still proceed?

In Controller (MVC)

GridUpdating updating = new GridUpdating();

//Add client event that gets fired after call updated ended. This will allow to enable the save button to function
updating.ClientEvents.Add("editCellStarting", "HandleGridCellUpdatedStart(evt,ui);");

//Javascript

function HandleGridCellUpdatedStart(evt, ui)
{
//Purpoe: This gets called when Infragistics grid is starting to get updated

// alert('starting to update a cell');

if ((ui.rowAdding == false) && (ui.columnKey == "PartnerName"))
{

//if not adding a row and the partner Name is trying to be updated, return right away
return false;
}
Cancel
Reply

Cancel
435

Kunal posted over 11 years ago in reply to Martin Pavlov

Hi Martin,

Thanks for the reply, I think this will work, but I'm updating some code that is constructing the grid and its various properties in MVC e.g.:

ColumnUpdatingSetting fnSettings = new ColumnUpdatingSetting();
fnSettings.ColumnKey = "FirstName";
fnSettings.EditorType = ColumnEditorType.Text;
fnSettings.Required = true;

Of course when the page renders all this is rendered as javascript, I guess my question is, If we enabled the Updating feature via MVC/Razor can specific update functionality be altered after the grid has rendered. I don't think we can.

It seems like, if I want this conditional edit functionality I will have to move my grid / feature construction to javascript completely so I can gain control. I can't create a GridModel in MVC and then conditionally alter properties via Javascript correct?
Cancel
Reply

Cancel