Jan 11, 2016
0
Level 1
Angular button calling form submit button
Hi, I am have a view with a form and I am using angularjs to update drop downs on part of the form. The form looks like this:
@section('scripts')
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.min.js"></script>
<script type="text/javascript" src="/js/categoryApp.js"></script>
@stop
<div class="container" ng-app="catApp" ng-controller="catController">
<div class="form-group">
{!! Form::label('name', 'Name:') !!}
{!! Form::text('name', null, ['class' => 'form-control']) !!}
</div>
<div class="form-group">
{!! Form::label('category_parent', 'Parent Category:') !!}
{!! Form::select('category_parent', $categories, null, ['id' => 'category_list', 'class' => 'form-control']) !!}
</div>
<label for="singleSelect"> Single select: </label><br>
<select name="singleSelect" ng-model="data.singleSelect" ng-options="cat.id as cat.name for cat in selectOptions" ng-change="change()">
</select><br>
<button ng-click="forceUnknownOption()">Force unknown option</button><br>
<tt>singleSelect = </tt>
<div class="form-group">
{!! Form::submit($submitButtonText, ['class' => 'btn btn-primary form-control']) !!}
</div>
</div>
and my angular app looks like this:
var app = angular.module('catApp', [], function($interpolateProvider) {
$interpolateProvider.startSymbol('<%');
$interpolateProvider.endSymbol('%>');
});
function catController ($scope, commentFactory) {
$scope.data = {
singleSelect: null,
multipleSelect: [],
option1: 'option-1',
};
$scope.change = function () {
$scope.selectOptions = [{name : "new category", id : 10}];
};
$scope.selectOptions =commentFactory.get();
$scope.categories = commentFactory.get();
$scope.forceUnknownOption = function() {
$scope.data.singleSelect = 'nonsense';
};
}
My question is: how come when I click on the button my submit button is triggered?
Every time i click on the force unknown button the action that the submit button is supposed to trigger gets triggered and I dont understand why.
Please or to participate in this conversation.