CODEWITHSUNDEEP
angularjsangularjs-scopeangularjs-selectangularjs-bindings
user11130182
user11130182

Reputation: 121

scope undefined for a text box

I'm trying to bind value to a text box as per below code. But unable to do so and getting msg as Scope undefined during debugging and no error msg in developer tools.

Issue in the $scope.onItemSelected and actually I've a response(data) from the api. Looks like issue with the scope only but unable to find and tried in different ways to bind textbox.

<!DOCTYPE html>
<html>
<head> 
    <script src="Scripts/angular.js"></script>
    <script src="Scripts/angular-resource.js"></script>
    <script>
        var IM_Mod_app = angular.module('IM_ng_app', []);   
        IM_Mod_app.controller("IM_Ctrl", function ($scope, $http) {              
              $http({
                method: 'GET',                    url: 'http://localhost:55758/api/Maintenance/GetFilteredItems',
                params: { Brand_Id: 'BR', Vt_Id: 'B' }
            }).then(function successCallback(response) {                
                $scope.items = response.data;
            }, function errorCallback(response) {
                                });    

            // on Item Selected - To fetch  Item details.
            $scope.onItemSelected = function () {                   
                $http({
                    method: 'GET',
                    url: 'http://localhost:55758/api/Maintenance/GetItem',
                    params: {  Brand_Id: 'BR', Item_Id : '12345' }
                }).then(function successCallback(response) {
                    alert(response.data); // Got data from the API with out any issues.
                    //$scope.itemDetails = response.data; -----> msg : itemDetails undefined.
                    //alert(itemDetails);
                    debugger;
                    $scope.itemid = response.data.ITEM_ID;  ----->msg : itemid undefined.
                    alert(response.data.ITEM_ID);
                    $scope.itemname = response.data.ITEM_NAME; ----->msg : itemname undefined.
                    alert(response.data.ITEM_NAME);
                    //$scope.NET_WEIGHT = itemDetails.NET_WEIGHT; ----->msg : itemDetails undefined.
                }, function errorCallback(response) {

                });
            }
        });


    </script>


</head>

<body ng-app="IM_ng_app">
    <table ng-controller="IM_Ctrl">
        <tr>
            <td>


                <select ng-model="itm.ITEM_NAME" multiple="true" size="15" ng-options="itm.ITEM_ID for itm in items" ng-change="onItemSelected(itm)"></select>
                <h2>  {{itm.ITEM_ID}}  </h2>

            </td>   
            <td>
                <div>

                    <input type="text" id="inpItemId" name="nameItemId" ng-trim="false" ng-value="itemid" />
                </div>
                <div>

                    <input type="text" id="inpItemName" name="nameItemName"  ng-model="itemname" />
            // <input type="text" id="inpItemName" name="nameItemName" value="{{itemname}}" />
                </div>
                <div>                   
                    <input type="text" class="form-control" id="NET_WEIGHT" ng-model="itemDetails.NET_WEIGHT" />
                </div>


            </td>
        </tr>

    </table>

</body>
</html>

Can Somebody help me here.

Upvotes: 0

Views: 66

Answers (1)

Hussain
Hussain

Reputation: 87

This might help

HTML

<input type="text" ng-model="itemobj.iiemValue">

controller

$scope.itemobj = {} //defined empty object

Upvotes: 0

Related Questions