Bind form submit event

This commit is contained in:
Björn Dahlgren 2014-05-22 00:52:20 +02:00
parent 9684f74a5a
commit ad40a749a1
3 changed files with 21 additions and 7 deletions

View File

@ -12,6 +12,11 @@ define(function (require) {
tpl = require('text!tpl/mods/form.html');
return Marionette.ItemView.extend({
events: {
'submit': 'beforeSubmit',
},
template: _.template(tpl),
initialize: function (options) {
@ -21,6 +26,11 @@ define(function (require) {
this.bind('shown', this.shown);
},
beforeSubmit: function(e) {
e.preventDefault();
this.submit();
},
shown: function (modal) {
var $okBtn = modal.$el.find('.btn.ok');
$okBtn.addClass('ladda-button').attr('data-style', 'expand-left');
@ -32,20 +42,22 @@ define(function (require) {
var self = this;
var $form = $('form');
modal.preventClose();
if (modal) {
self.modal.preventClose();
}
$form.find('.form-group').removeClass('has-error');
$form.find('.help-block').text('');
this.laddaBtn.start();
modal.$el.find('.btn.cancel').addClass('disabled');
self.modal.$el.find('.btn.cancel').addClass('disabled');
this.model.save({ name: $form.find('.mod').val() }, {
success: function () {
self.mods.fetch({
success : function () {
self.laddaBtn.stop();
modal.close();
self.modal.close();
}
});
},
@ -53,7 +65,7 @@ define(function (require) {
self.laddaBtn.stop();
$form.find('.form-group').addClass('has-error');
$form.find('.help-block').text('Problem downloading mod');
modal.$el.find('.btn.cancel').removeClass('disabled');
self.modal.$el.find('.btn.cancel').removeClass('disabled');
}
});
},

View File

@ -32,7 +32,9 @@ define(function (require) {
download: function (event) {
event.preventDefault();
var view = new FormView({mods: this.collection});
new Backbone.BootstrapModal({ content: view, animate: true }).open();
var modal = new Backbone.BootstrapModal({ content: view, animate: true });
view.modal = modal;
modal.open();
},
});
});

View File

@ -3,10 +3,10 @@
such as @A3MP
</p>
<form class="form" role="form">
<form class="form" role="form" action="/api/mods" method="POST">
<div class="form-group">
<label for="mod" class="control-label">Mod</label>
<input type="text" class="form-control mod" name="mod" id="mod" data-field="mod">
<input type="text" class="form-control mod" name="name" id="mod" data-field="mod">
<span class="help-block"></span>
</div>
</form>