There are two types of data I'm displaying on single page, one is Insert form and second is where the data is displayed with the help of Angular dataTables, now what I want to do is when I click on Edit I wana display the Data within the Insert form Fields also change the Save button from Save to Update... I've tried it but I'm getting this error although its displaying the data in console.

```
controller.js:1356 24
controller.js:1363 Colony 02 2
angular-1.4.8.js:12520 TypeError: Cannot set property 'colony_name' of undefined

```

**NOTE: Insert, Delete, Displaying Data is working fine.** 

**Here is my HTML PAGE**

```
<div class="row-fluid" ng-controller="colony_Controller">
<div class="span12">

    <div class="span6">

        <!-- WIDGET START -->
        <div class="widget TwoWidgetsInOneFix">

            <!-- Widget Title Start -->
            <div class="widget-title">
                <h4><i class="icon-reorder"></i>Add Colony</h4>
                <span class="tools">
                    <a href="javascript:;" class="icon-chevron-down"></a>
                    <!-- <a href="javascript:;" class="icon-remove"></a> -->
                </span>
            </div>
            <!-- Widget Title End -->

            <!-- Widget Body Start -->
            <div class="widget-body">

                <form class="form-horizontal">

                    <div class="control-group">
                        <div class="small-bg-half">
                            <label class="control-label">Colony Name</label>
                            <div class="controls">
                                <input type="text" class="input-xlarge" id="" autofocus required name="colony_name"
                                ng-model="field.colony_name" > <!-- ng-->
                                <span class="help-inline" id="help-inline" style="color:red;"></span>
                            </div>
                        </div>
                    </div>

                    <div class="control-group">
                        <div class="small-bg-half">
                            <label class="control-label">Colony Type</label>
                            <div class="controls">
                                <select data-toggle="status" class="select select-default mrs mbm input-xlarge" name="colony_type" id="colony_type" ng-model="field.colony_type_id" required> <!-- ng -->
                                    <option value="">--Select Colony Type--</option>
                                    <option ng-repeat="colony in es_colony_type" value="{{colony.es_colony_type_id}}">{{colony.es_colony_type_name}}</option>

                                </select>
                            </div>
                        </div>
                    </div>

                    <div class="form-actions">
                            <button type="button" class="btn btn-success" ng-click="InsertData()"> <!-- ng -->
                            <i class="icon-plus icon-white"></i> Save</button>
                    </div>
                </form>

            </div>
            <!-- Widget Body End -->

        </div>
        <!-- WIDGET END -->

    </div>

    <div class="span6">

        <!-- WIDGET START -->
        <div class="widget TwoWidgetsInOneFix">

            <!-- Widget Title Start -->
            <div class="widget-title"> <!-- ng -->
                <h4><i class="icon-reorder"></i>List Of Colony</h4>
                <span class="tools">
                    <a href="javascript:;" class="icon-chevron-down"></a>
                    <!-- <a href="javascript:;" class="icon-remove"></a> -->
                </span>
            </div>
            <!-- Widget Title End -->

            <!-- <div id="alert-2" flash-alert active-class="in alert" class="fade">
                <strong class="alert-heading">Boo!</strong>
                <span class="alert-message">{{flash.message}}</span>
            </div> -->

            <!-- Widget Body Start -->
            <div class="widget-body">

                <div ng-controller="colony_Controller as Main_Module">
                    <table class="table table-striped table-bordered" align="center" datatable="" dt-options="Main_Module.dtOptions" dt-columns="Main_Module.dtColumns" class="row-border hover">
                    </table>
                </div>

            </div>

        </div>
        <!-- Widget Body End -->

    </div>
    <!-- WIDGET END -->

</div>

```

**Here is my Controller**

```
Main_Module.controller('colony_Controller', function add_house_Controller(flash, $window, $scope, $http, $compile, DTOptionsBuilder, DTColumnBuilder, bootbox, SimpleHttpRequest, DelMainRecPicRecUnlinkPic, message)
{   
            $http.get('http://localhost:3000/api/SELECT/es_colony_type').success(function(data)
    {
        $scope.es_colony_type = data.es_colony_type;
    });
    /********************************** FETCH DATA END *********************************/

    /********************************** INSERT DATA START ********************************/
    $scope.InsertData = function()
    {
        var values = $scope.field;

        SimpleHttpRequest.Insert('POST','INSERT', 'es_colony', values)
        .then(function successCallback(response)
        {
            if(!response.data.Error)
            {
                message.successMessageForInsert("<strong>Successfull !</strong> Colony Details Inserted");
                setTimeout(function()
                {
                    $window.location.reload();
                }, 3500);

                // flash.to('alert-1').success = 'Only for alert 1';                                
            }
            else
            {
                message.failedMessageForInsert("<strong>Error !</strong> Data Insertion Failed");
            }
        },
        function errorCallback(response)
        {
            message.failedMessageForInsert("<strong>Error!</strong> Data Insertion Failed !");
        });       
    };
    /********************************** INSERT DATA END **********************************/

    /********************************** DISPLAY DATA START *******************************/
    var vm = this;
    vm.dtOptions = DTOptionsBuilder
    .fromFnPromise(function()
    {
        return $http.get('http://localhost:3000/api/SELECT/es_colony')
        .then(function(response)
        {
            return response.data.es_colony;
        });
    })
    .withOption('order', [0, 'asc'])
    .withDisplayLength(5)
    .withPaginationType('simple_numbers')
    .withOption('createdRow', function(row, data, dataIndex)
    {
        $compile(angular.element(row).contents())($scope);
    })
    vm.dtColumns =
    [
        DTColumnBuilder.newColumn('es_colony_name').withTitle('Colony'),            
        DTColumnBuilder.newColumn(null).withTitle('Actions').notSortable().withOption('width', '31%')
        .renderWith(function(data, type, full, meta)
        {
            return '<button class="btn btn-primary" ng-click="edit_records(' + data.es_colony_id + ')">' +
                   '<i class="icon-edit"></i> Edit' + '</button>&nbsp;' +
                   '<button class="btn btn-danger" ng-click="DeleteRecord(' + data.es_colony_id + ')">' +
                   '<i class="icon-remove icon-white"></i> Delete' + '</button>';
        })
    ];

    /********************************** DISPLAY DATA END *********************************/

    /********************************** DELETE DATA START ********************************/
    // $scope.hideRow = [];
    $scope.DeleteRecord = function(id)
    {
        bootbox.confirm("Are you sure you want to delete this Record ?", function (confirmation)
        {
            if(confirmation)
            {
                DelMainRecPicRecUnlinkPic.DeleteIt('', id, true, 'es_colony', 'es_colony_id')
                {
                    setTimeout(function()
                    {
                        $window.location.reload();
                    }, 3500);
                };
            }
        });
    };

    $scope.edit_records = function(id)
    {
        // PassId.id = id;
        console.log(id);

        SimpleHttpRequest.SelectByID('GET', 'SELECTBYID', 'es_colony', 'es_colony_id', id)
        .then(function successCallback(response)
        {
            var data = response.data.es_colony[0];

            console.log(data.es_colony_name, data.es_colony_type_id);    

            $scope.ufield.ucolony_name = data.es_colony_name;
            $scope.ufield.colony_type_id = data.es_colony_type_id;
        });
    };
    /********************************** DELETE DATA END **********************************/

});

```