Bootstrap 3 Template

Disable first button element, submit fails

by Retsam19

HTML

<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.2.0/css/font-awesome.min.css">
<script src="http://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout.js"></script>
<div id="search-form" class="container">
		<form name="my-form" data-bind="submit: Next">
			<div class="row">
				<div class="col-xs-12">
					<button class="btn btn-default"><!-- disabled or data-bind="enable: false" -->
						<i class="fa fa-save"></i>
					</button>
					<button class="btn btn-default" disabled>
						<i class="fa fa-print"></i>
					</button>
				</div>
			</div>
			<div class="row">
				<div class="col-xs-2">
					<label class="control-label">Invoice #</label>
					<input type="text" class="form-control" data-bind="value: InvoiceID"  autofocus="true"  />
				</div>
				<div class="col-xs-8">
					<button class="btn btn-success pull-right" type="submit" data-bind="click: Next">Next</button>
				</div>
			</div>
		</form>
	</div>

CSS

/* Latest compiled and minified CSS included as External Resource*/

/* Optional theme */
 @import url('//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css');
 body {
    margin: 10px;
}

JavaScript

var be = be || {};


be.AppViewModel = function () {
    var self = this;
    self.InvoiceID = ko.observable('');



    self.Next = function () {
        alert('next function');
    };
};

ko.applyBindings(new be.AppViewModel());