Michał Wiącek Michał Wiącek - 4 months ago 62
jQuery Question

Textarea auto-complete angularjs only 10 elements

Why have i only 10 items in autocomplete ?
I have in cake view code:

<?php $leadersOptions = array(
array('id' => '1', 'text' => '1'),
array('id' => '2', 'text' => '2'),
array('id' => '3', 'text' => '3'),
array('id' => '4', 'text' => '4'),
array('id' => '5', 'text' => '5'),
array('id' => '6', 'text' => '6'),
array('id' => '7', 'text' => '7'),
array('id' => '8', 'text' => '8'),
array('id' => '9', 'text' => '9'),
array('id' => '10', 'text' => '10'),
array('id' => '11', 'text' => '11'),
array('id' => '12', 'text' => '12')
); ?>
<?php $encoded = json_encode($leadersOptions); ?>

<div ng-controller="TagsCtrl">
<textarea ng-init="leadersOptions = <?php echo empty($leadersOptions) ? '[]' :h($encoded); ?>; leaders = <?php echo empty($projectUser) ? '[]' :h(json_encode($projectUser)); ?>" class="ng-hide" name="data[Project][leader_id]">
{{leaders}}
</textarea>

<label>Dodaj leadera</label>
<tags-input ng-model="leaders" placeholder="Kliknij aby wybrać" add-on-paste="true" add-on-enter="false" add-on-space="false" add-on-comma="false" add-on-blur="false">
<auto-complete source="loadTags()" load-on-focus="true" load-on-down-arrow="true" load-on-empty="true">
</auto-complete>
</tags-input>
</div>


And in angular ctr:

app.controller('TagsCtrl', function ($scope, $window, $sce, $http, $rootScope) {

$scope.loadTags = function (query, tags) {
return $scope.leadersOptions;
}
$scope.loadContractors = function (query, tags) {
return $scope.contractorsOptions;
}
$scope.loadUserCategory = function () {
return $scope.categoriesOptions;
}
});


And still it suggest 10 elements but in $leadersOptions is 12 element and more...

Elements in suggest
And array with elements ($leadersOptions):

<?php $leadersOptions = array (
array('id' => '1', 'text' => '1'),
array('id' => '2', 'text' => '2'),
array('id' => '3', 'text' => '3'),
array('id' => '4', 'text' => '4'),
array('id' => '5', 'text' => '5'),
array('id' => '6', 'text' => '6'),
array('id' => '7', 'text' => '7'),
array('id' => '8', 'text' => '8'),
array('id' => '9', 'text' => '9'),
array('id' => '10', 'text' => '10'),
array('id' => '11', 'text' => '11'),
array('id' => '12', 'text' => '12')
);?>


Can anyone help me ? I am not good at angularJS... Thanks.

Answer

Resolved. In auto-complete i added 'max-results-to-show="99"'.

Now code looks like this:

<auto-complete source="loadTags()" load-on-focus="true" max-results-to-show="99" load-on-down-arrow="true" load-on-empty="true"></auto-complete>