Angularjs Enable Disable Button based on Checkbox Selection Example

  ASP.NET   Friday, November 6, 2015   1320 | No Comments Yet!!! | No Download | No Demo | Pawan kumar
 Tags: Angularjs Enable Disable Button based on Checkbox Selection Example 


Step 1: First, We start by creating an Empty asp.net web site in Visual Studio .NET 2013.

Step 2: Add a new web page name sample1.aspx with the following codes:-

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="sample1.aspx.vb" Inherits="sample1" %>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>www.sourcecodehub.com ==> Angularjs Enable or Disable Button on Checkbox Selection
    </title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.9/angular.min.js"></script>
    <script type="text/javascript">
        var myApp = angular.module('sampleapp', [])
        myApp.controller("expressionController", function ($scope) {
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div data-ng-app="sampleapp" data-ng-controller="expressionController">
        Select Checkbox:
        <input type="checkbox" data-ng-model="chkval" />
        <br />
        <br />
        <input type="button" ng-disabled="chkval" value="Enable/Disable" /><br />
        <br />
    </div>
    </form>
</body>
</html>


Step 3: Run the application by pressing F5

Step 4: Screenshot will be shown below:-

Conclusion,In this tutorial we have learned  To enable or disable button on checkbox selection we need to use ng-disabled property in AngularJS we need to write the code like as shown below

 

Post Comments

if you have some suggestion, question, request on Angularjs Enable Disable Button based on Checkbox Selection Example.

Please use the comment box to express your views.

 

Comments: