How to add user defined events while editing record using external template using AngularJS

[Gomtesh]

I have to handle events while editig grid record using external template for that i have added one method EditClick() in template for editing and i have to get call in controller because i have do some other functionality and return result to template itself


HTML code is::
 <div ng-controller="DemoController">
      <div id="DemoGrid" ng-model="InstructionTable" ej-grid e-datasource="data"
                                         e-editsettings="editSettings" e-toolbarsettings="toolbarSettings" e-columns="columns">
     </div>
</div>

<script id="template" type="text/x-jsrender" >
    <div>
        <table cellspacing="10">
            <tr>
                    <td style="text-align: left">
                    <input  value="{{: SrNo}}" class="e-field e-ejinputtext valid" style="width: 116px; height: 28px" />
                </td>
            </tr>
            <tr>
                <td style="text-align: left">
                    <input   value="{{: Instruction}}" class="e-field e-ejinputtext valid"  style="width: 116px; height: 28px" />
                </td>              
            </tr>
            <tr>
                <td>
                    <div class="btn-group">
                        <button class="btn btn-primary" e-click="EditClick()" e-ejbutton ng-click="EditClick()"><i class="fa fa-check"></i>&nbsp;Save</button>
                    </div>
                </td>
            </tr>
        </table>
    </div>
</script>
</div>

Controoller code is:::

App.controller('DemoController', function ($scope) {
var columns = [
                       { field: "SrNo", isPrimaryKey: true, headerText: "Order ID", textAlign: ej.TextAlign.Right, validationRules: { required: true, number: true }, width: 90 },
                       { field: "Instruction", headerText: 'Customer ID', validationRules: { required: true, minlength: 3 }, width: 90 },


    ]

    var Data = [
        {
            "SrNo": 1,
            "Instruction": "Instruction NO. 1"
        },
        {
            "SrNo": 2,
            "Instruction": "Instruction NO. 2"
        },
        {
            "SrNo": 3,
            "Instruction": "Instruction NO. 3"
        }
    ];
   
    $scope.editSettings = { allowEditing: true, editMode: ej.Grid.EditMode.InlineTemplateForm, inlineFormTemplateID: "#template" };

    $scope.data = Data;

});

[Isuriya Rajan]

Hi Gomtesh,
We have logged the "Angularjs support for editing templates" as a feature and it will be implemented in any of our releases.

Regards,

Isuriya R.

[Gomtesh]

can you give me reference links for solving above issue ??

[Gomtesh]

can you give me reference links for solving above issue ??

because i have to handle events while editing record in controller

[Jayaprakash Kamaraj]

Hi Gomtesh, 

  

Your requirement can be achieved by "actionbegin" event. This event is triggered for every grid action before it starts. So, actionBegin event will be triggered while clicking the save button and check whether the request type as “save” and invoke your function inside action begin event. 

  

 $scope.actionBegin = function (args) { 

                if (args.requestType == "save" ) {

// do your code

            } 

  

Please refer to the following  sample:  

http://www.syncfusion.com/downloads/support/forum/120839/ze/New_folder_(2)1838514674 

Regards, 

Jayaprakash K