i've written angularjs directive, shown below, disables html button on form submit, or when button clicked, , replaces button's inner text. works in ie , firefox in chrome code modify button executes form won't submit, , no request made server.
an example of html button:
<button submit-button submit-title="generating report..." type="submit" class="btn btn-primary"> <i class="fa fa-database mr-xs"></i>generate report </button>
the angularjs directive:
(function () { function submitbutton() { return { restrict: 'a', require: '^form', scope: { submittitle: '@' }, link: function ($scope, $element, $attributes) { $element.on('click', function () { var element = $element[0]; element.innerhtml = element.innerhtml .replace(element.innertext, $attributes.submittitle); element.disabled = true; $element.addclass('disabled'); }); } }; } angular.module('adminapp', []) .directive('submitbutton', submitbutton); })();
i've used fiddler review requests , responses , can confirm there no request made in chrome when button clicked or form submitted. appreciated.
chrome won't submit form if in attached click event handler disable element.
use submit
event instead:
$element.on('submit', function() { // stuff });