Hello,

I use the angular ig-grid directive to create a bound datagrid.

  <ig-grid id="mainCharacters-grid"
             data-source="commicBook.strip.MainCharacters"
             primary-key="Id"
             auto-generate-columns="false"
             width="100%">
        <columns>
            <column key="Id" header-text="ID" width="65px" data-type="number"></column>
            <column key="Name" header-text="Last Name" width="800px" data-type="string"></column>
            <column key="Gender" header-text="Gender" width="100%" data-type="string"></column>
        </columns>
        <features>
            <feature name="Sorting">
            </feature>
            <feature name="Filtering">
            </feature>
            <feature name="Updating">
                <column-settings>
                    <column-setting column-key="Id">
                        <editor-options read-only="{{gridOptions.readOnlyValue}}"></editor-options>
                    </column-setting>
                </column-settings>
            </feature>
        </features>
    </ig-grid>

I would like to set(change) the readonly on the first column based on a value in my controller. The change is triggered by button click.

<button ng-click="OnChangeReadOnlyClicked();" title="Change readonly">Change Readonly</button>

The clickevent changes the value, but the first column remains editable even though the $Scope.gridOptions.readOnlyValue is true.

The content of the controller:

(function () {
    'use strict'

    app.controller('commicBookController', controller);

    function controller($scope, dataServices) {
        var readOnly = false;

        $scope.commicBook = getCommicBook();

        $scope.gridOptions = { readOnlyValue: readOnly };

        function getCommicBook() {

            dataServices.getCommicBook(1)
            .success(function (data) {
                $scope.commicBook = data;
            })
            .error(function (error) {
                alert(error.message);
            });
        }


        $scope.OnChangeReadOnlyClicked = function () {
            readOnly = !readOnly;
            $scope.gridOptions.readOnlyValue = readOnly;
        };

    }

})();

What am I missing to make the change of the value effective, so that the first column becomes readonly?