1

I have a input with an autocomplete with angularjs. This autocomplete is from a json that is represented by a table in a dropdown. I can filter the results and click the correct value but i would check if the user type some value that is not in the dropdown with an error message. Here is the code:

<div ng-app="myApp">
    <div ng-controller="MyCtrl">       
        <div class="uk-form-row uk-width-1-1" data-ng-repeat="items in inputList.getinputList">
         <input ng-model='item.value' type="text" placeholder="Choose"/>
            <!-- WORKS OK -->
            <div class="uk-parent" data-uk-dropdown="{mode:'click'}">
                <a href="">Nav item - Works OK</a>
                <div class="uk-dropdown uk-dropdown-navbar" style="top:50px">
                <table>
                <thead>
                <tr>
                    <th>First Value</th>
                    <th>Second Value</th>
                </tr>
                </thead>
                <tbody>
                <tr data-ng-repeat="item in numberList.getList | filter:item.value" ng-click="setSelected(item)">
                    <td>{{item.first}}</td>
                    <td>{{item.last}}</td>
                </tr>
                </tbody>
            </table>
                </div>
</div>

The angularjs part

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
    $scope.item={}
    $scope.numberList={}
    $scope.numberList.getList=[{'first':'Jon','last':'skeet'},{'first':'naeem','last':'shaikh'},{'first':'end','last':'game'}]

    $scope.inputList={}
    $scope.inputList.getinputList=[{'firstA':'AAA','lastB':'BBBB'}]

    $scope.idSelectedVote = null;
    $scope.setSelected = function (idSelectedVote) {

        $scope.idSelectedVote = idSelectedVote;
        $scope.item.value=idSelectedVote.first+' '+idSelectedVote.last;
        //alert(idSelectedVote);
    };
}

I created a fiddle here:

http://jsfiddle.net/8y48q/22/

1 Answer 1

1

You can use

<tr  ng-show="(numberList.getList | filter:item.value).length == 0"> 
                        <td>Nothing here!</td>
                    </tr>

Fiddle

Sign up to request clarification or add additional context in comments.

1 Comment

mmh could be a solution. Do you think could be possible create a message outside the table? maybe in a <p> tag next to the input

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.