私はangularjsアプリケーションで作業しています。私は、ユーザが入力した値に基づいて角度のあるUIグリッドを表示しています。角度UIグリッドに表示される値がない場合、No RECORDS FOUNDというメッセージを表示したいとします。 デモを見つけてくださいherejavascriptがメッセージを表示するとき表示するデータがありません
ユーザーがアトランタにテキストフィールドを、シカゴにテキストフィールドにシカゴを与え、SearchLocationsをクリックすると、UIグリッドが表示されます。空白を表示するのではなく、ユーザーが何かを入力すると、NOレコードとメッセージが表示されます。 その他の問題は、列をラジオボタンで追加しようとしているため、ユーザーはその行を選択するときにそのラジオボタンを選択できます。新しい列を追加することで、グリッドの各行にラジオボタンを表示することができなかった。 どのような提案も非常に役に立ちます。解決しなければならない多くの問題に直面している初心者になる。ありがとう。
JSコード:
angular.module('myApp', ['ngAnimate', 'ui.bootstrap','ngTouch', 'ui.grid', 'ui.grid.selection', 'ui.grid.edit','ui.grid.cellNav']);
angular.module('myApp').controller('citiesCtrl',function($scope){
// $scope. places = undefined;
$scope.items = ["Atlanta", "Chicago", "NewYork"];
$scope.selectAction = function() {
console.log($scope.places1);
};
});
/*Controller for searchLocations button*/
angular.module('myApp').controller('searchController', ['$scope', function($scope) {
$scope.places = ['', ''];
$scope.searchValue = '';
$scope.submit = function() {
if ($scope.places[0].length > 0 && $scope.places[1].length > 0) {
$scope.searchValue = $scope.places[0] + $scope.places[1];
}
};
$scope.users = [
{'name' : 'AtlantaChicago',
'show' : true,
'details' : [
{"Travel Date": "10/10/2014", commute:"Bus"},
{"Travel Date": "10/11/2014", commute:"flight"}]
},
{'name' : 'NewYorkChicago',
'show' : true,
'details': [
{"Travel Date": "3/15/2016", commute:"flight"},
{"Travel Date": "10/12/2016", commute:"flight"},
]
}
];
$scope.gridOptions = {
enableFiltering: true,
columnDefs: [
{ name: 'Travel Date', width: '5%'},
{ name: 'Departurecommute', enableFiltering: false, width: '12%' }
],
rowHeight: 20,
enableHorizontalScrollbar:2
};
}]);
HTMLコード:
<div class="row">
<div class="form-group" ng-controller="citiesCtrl">
<label>From</label>
<input type="text" ng-model="places[0]" placeholder="Type Departure City" typeahead="item for item in items | filter:$viewValue | limitTo:8">
</div>
<div class="form-group" ng-controller="citiesCtrl">
<label>To</label>
<input type="text" ng-model="places[1]" placeholder="Type Destination City" typeahead="item for item in items | filter:$viewValue | limitTo:8">
</div>
</div>
<input type="button" value="SearchLocations" ng-click="submit()">
<div ng-repeat="user in users | filter: {name: searchValue} : true ">
<h3>First Grid</h3>
<div ui-grid="{ data: user.details }" ng-show="user.show" class="myGrid"></div>
</div>
私は、各行にあるラジオボタンを追加しようとしたが、それが表示された取得に失敗しました。 新しく追加された列に以下のコードを追加して、各行にラジオボタンを表示して、ユーザーが行のいずれかを選択できるようにしました。
{
name: 'ReleaseAction', width: '350',
cellTemplate: '<div class="btn-group" ng-init="releaseAction=0"><input ng-model="releaseAction" type="radio" value="0" style="width:20px"> Add</div>'
},
グリッドが表示されていないときにメッセージを表示したり、UIグリッド内のすべての行にラジオボタンを表示したりするのはすばらしいことでしょう。
を見ます.co/edit/CZPRn60ufiXcCbc54iye?p = preview。私はあなたがそれが表示されないように示唆したようにしようとしたとき。あなたの助けに感謝。 – user3684675
私の更新答えを見てください:) –
ありがとうそれは働いた。私のポストで尋ねた私の他のシナリオは、UIグリッドの各行にラジオボタンを表示することです。上のポストに示したように試しましたが、表示されませんでした。答えは受け入れましたが、グリッドの各行にラジオボタンを表示して、ユーザーが任意の行を選択できるようにしてください。 – user3684675