从UI-Grid onblur获取文本框值

时间:2019-05-29 08:45:30

标签: angularjs angular-ui-grid ui-grid

我想获取在UI网格中的模糊事件时在文本框中输入的值。 IAM无法获取事件被触发的值,但无法获取如何获取文本框值的逻辑。 可以帮助您解决问题。

这是代码:

  $scope.gridOptions = {
        headerTemplate: 'header-template.html',
        showColumnFooter: true,
        columnDefs: [{ name: 'H', width: '15%' }, { name: 'H1', width: '30%' }],
        data: [
            { H: "", H1: "Brand name" },
            { H: " ", H1: "Molecule" },
            { H: "Product Details ", H1: "Therapeutic area" },
            { H: " ", H1: "Targeted indication " },
            { H: " ", H1: "Estimated size of the patient population (in your market) " }
        ],
        onRegisterApi: function (gridApi) {
            $scope.gridApi = gridApi;
            gridApi.core.on.renderingComplete(gridDrawn());
        },
    };

 $scope.gridOptions.columnDefs.push({
            name: 'H2', enableCellEdit: false,
            field: "colButton", displayName: "Push Me",
            //aggregationType: uiGridConstants.aggregationTypes.sum,
            aggregationHideLabel: true,
            cellTemplate: '<div><input type="Number" placeholder="Enter Number" onblur="calculateTotal()" style="width:90%" /></div>',
            rowTemplate: '<div>Hai</div>',
            width: '10%',
            footerCellTemplate: '<div class="ui-grid-cell-contents" >Total: {{col.getAggregationValue() | number:2 }}</div>'
        });


function calculateTotal() {
    alert("Hello");
 gridApi.edit.on.afterCellEdit($scope, function (rowEntity, colDef, newValue, oldValue) {
            $scope.msg.lastCellEdited = 'edited row id:' + rowEntity.id + ' Column:' + colDef.name + ' newValue:' + newValue + ' oldValue:' + oldValue;
            $scope.$apply();
        });
}

1 个答案:

答案 0 :(得分:0)

在范围内定义变量,例如:-

$scope.textboxValue = '';

然后将变量添加到单元格模板的ng-model中,如下所示

cellTemplate: '<div><input type="Number" ng-model="textboxValue" placeholder="Enter Number" onblur="calculateTotal()" style="width:90%" /></div>'

您的文本框值将在功能中访问

$scope.calculateTotal = function () {

    console.log($scope.textboxValue);
    //other code
}