Solved

How do I determine with radio button is selected and display html accordingly?

Posted on 2016-08-25
3
44 Views
Last Modified: 2016-09-01
I am trying to implement a different modal view that depends on which radio button is working.  But, the below code is not working correctly.  How am I implementing the radio buttons and the usage incorrectly?

<div class="modal-header">
        <input id="treeRadio" name="treeRadio" type="radio" checked="checked" ng-model="hMode" ng-value="tree" />
        <label for="treeRadio">Tree Mode</label>
        <input id="searchRadio" name="treeRadio" type="radio" ng-model="hMode" ng-value="search" />
        <label for="searchRadio">Search Mode</label>
        <input id="bookmarkRadio" name="treeRadio" type="radio" ng-model="hMode" ng-value="bookmark" />
                 <label for="bookmarkRadio">Search Mode</label>
    </div>
    <!--Tree Mode-->
    <div class="modal-open" style="height: 450px; overflow-y: auto;" ng-if="hMode=='tree'">
               <!--do stuff-->
    </div>
    <!--Search Mode-->
    <div class="modal-open" ng-if="hMode=='search'">
              <!--do stuff-->
    </div>
    <!--Bookmark Mode-->
    <div class="modal-open" ng-if="hMode=='bookmark'">
               <!--do stuff-->
    </div>
0
Comment
Question by:spazjr01
  • 2
3 Comments
 
LVL 51

Accepted Solution

by:
Julian Hansen earned 500 total points
ID: 41770970
Change ng-value to value - ng-value is usually used in an ng-repeat to dynamically populate a value attribute.
0
 

Author Closing Comment

by:spazjr01
ID: 41780742
Thanks.  Works perfectly per answer given.
0
 
LVL 51

Expert Comment

by:Julian Hansen
ID: 41780769
You are welcome.
0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

Suggested Solutions

Do you want to insert HTML5 video into your site? This is the tutorial how to do so. What are the main advantages of HTML5 video? 1) Have good compression, good image quality, and low decode processor use. 2) It is royalty-free 3) It is easi…
This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

708 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now