Base solution for your next web application
Open Closed

Radio Buttons #590


User avatar
0
elmogallen created

In this framework, how do you do a simple radio button list?

Example: <a class="postlink" href="http://www.cssscript.com/wp-content/uploads/2014/07/Google-Material-Design-Animated-Radio-Buttons-with-Pure-CSS3.jpg">http://www.cssscript.com/wp-content/upl ... e-CSS3.jpg</a>

How would I accomplish that using ASP.NET Zero? I'm having a hard time. A normal radio button won't show up for me, and I'm struggling a bit. I'm not sure how to make it work in angular/bootstrap/metronic.

Could you give me an example?

Thanks, Dave


2 Answer(s)
  • User Avatar
    0
    hikalkan created
    Support Team

    Hi,

    Have you checked <a class="postlink" href="http://www.keenthemes.com/preview/metronic/theme/admin_4_material_design/form_controls_md.html">http://www.keenthemes.com/preview/metro ... ls_md.html</a> There is a sample radio button list in ths page. Just check it's codes and copy to your page.

    Thanks.

  • User Avatar
    0
    elmogallen created

    That helped me. Thank you.

    For future reference for others, this is how to do it using the Metronic theme and angularjs:

    <div class="md-radio-list">
        <div class="md-radio">
            <input type="radio" id="RetailerOptionRadio1" name="RetailerOptionRadio" class="md-radiobtn" ng-model="vm.coupon.retailerOption" value="1">
            <label for="RetailerOptionRadio1">
                <span class="inc"></span>
                <span class="check"></span>
                <span class="box"></span> Option 1
            </label>
        </div>
    
        <div class="md-radio">
            <input type="radio" id="RetailerOptionRadio2" name="RetailerOptionRadio" class="md-radiobtn" ng-model="vm.coupon.retailerOption" value="2">
            <label for="RetailerOptionRadio2">
                <span class="inc"></span>
                <span class="check"></span>
                <span class="box"></span> Option 2
            </label>
        </div>
    
        <div class="md-radio">
            <input type="radio" id="RetailerOptionRadio3" name="RetailerOptionRadio" class="md-radiobtn" ng-model="vm.coupon.retailerOption" value="3">
            <label for="RetailerOptionRadio3">
                <span class="inc"></span>
                <span class="check"></span>
                <span class="box"></span> Option 3
            </label>
        </div>
    </div>