How do I check the case in angularjs

Question

0.00/5 (No votes)

See more:

Hi,
I have two options in HTML select input with values as

C#

AbhiNAV5
RaviNATH6

User selects one of these values and that will be stored in DB.
If any user directly changes the value in DB as `ABHINAV5 or abhinav5` or `RAVINATH6 or ravinath6` (or possibly however he wants in any case),
then I am not able to show the value in dropdown. Instead it adds a blank entry

Here is HTML

ASP.NET

<select id="Select1" clientidmode="Static" class="htmlDropdown"  runat="server" data-ng-disabled="!PropCollection.IsConfigured" data-ng-model="PropCollection.ViewerName" style="width: 150px;" tabindex="2">
            <option value="AbhiNAV5">AbhiNAV5</option>
            <option value="RaviNATH6">RaviNATH6</option>
  </select>

Is there any way to handle the case? I want it to be case insensitive.

Any help appreciated.
Thanks.

What I have tried:

I tried using filter but it showed no effect. Or perhaps I don't how to use it in a better way.
I tried this as

<select id="Select1" clientidmode="Static" class="htmlDropdown" runat="server" data-ng-disabled="!PropCollection.IsConfigured" data-ng-model="PropCollection.ViewerName | filter: false" style="width: 150px;" tabindex="2">
<option value="AbhiNAV5">AbhiNAV5</option>
<option value="RaviNATH6">RaviNATH6</option>
</select>

Posted 17-May-16 5:58am

Lokesh Zende

Updated 17-May-16 23:50pm

Add a Solution

3 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Surya Reddy · Answer 1 · 2016-05-17T19:56:00

Hi Lokesh,

Try using ng-options.

assuming your 'PropCollection' is an array of form:

JavaScript

$scope.PropCollection = [{"ViewerName":"AbhiNAV5"},{"ViewerName":"RaviNATH6"}];

under your js file (or tag)
mention the following

//to show default value in dropdown controll

JavaScript

$scope.viewName = PropCollection[0].ViewerName;

and try building html like this

HTML

<select ng-model="viewName" ng-options="view.ViewName for view in PropCollection">
</select>

Now you can access the selected value using "viewName".

For dropdowns you have a predefined directive called ng-options.

See this plnkr for reference.

Plunker for ng-Options

Lokesh Zende · Answer 2 · 2016-05-17T22:53:00

Solution 2

Here's what I did.
I changed the model to lowercase and the values of the option values to lowercase. Now they match up when they are bound.

Posted 17-May-16 22:53pm

Lokesh Zende

Karthik_Mahalingam · Answer 3 · 2016-05-17T23:50:00

try this

HTML

<!DOCTYPE html>
<html lang="en-US">
<head>
    <script src="angular.js"></script>
    <script src="jquery.js"></script>
    <!--<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>-->
    <script>
        var app = angular.module('myapp', []);
        app.controller('myctrl', myctrl);
         

        function myctrl($scope) {

            var find = 'ABhiNAV5';
           
            var options = document.getElementById('Select1').options;
            for (var i = 0; i < options.length; i++) {
                if (angular.lowercase(options[i].value) == angular.lowercase(find)) {
                    $scope.ViewerName = options[i].value;
                    break;
                }
            }
        }
    </script>



</head>
<body>

    <div ng-app="myapp" ng-init="showhide=true" ng-controller="myctrl"> 


        <select id="Select1" class="htmlDropdown" data-ng-model="ViewerName" style="width: 150px;" tabindex="2">
            <option value="aa">aa</option>
            <option value="AbhiNAV5">AbhiNAV5</option>
            <option value="RaviNATH6">RaviNATH6</option>
        </select>


    </div>


</body>
</html>

demo - JSFiddle[^]

How do I check the case in angularjs

3 solutions

Solution 1

Solution 2

Solution 3

Add your solution here

Preview 0