tracer/x-editable
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

new form template fixes

Browse Source
This commit is contained in:
vitalets 2012-11-26 13:01:04 +04:00
parent c9f2f31add
commit 999bbe25df
4 changed files with 34 additions and 26 deletions

17
src/editable-form/editable-form-bootstrap.js

@ -3,14 +3,19 @@ Editableform based on Twitter Bootstrap
*/ */
(function ($) { (function ($) {
//form template $.extend($.fn.editableform.Constructor.prototype, {
$.fn.editableform.template = '<form class="form-inline editableform"><div class="control-group">' + initTemplate: function() {
'<div class="editable-input"></div><div class="editable-buttons"></div>' + this.$form = $($.fn.editableform.template);
'<div class="help-block editable-error-block"></div>' + this.$form.find('.editable-error-block').addClass('help-block');
'</div></form>';
//buttons
this.$form.find('div.editable-buttons').append($.fn.editableform.buttons);
}
});
//buttons //buttons
$.fn.editableform.buttons = '<button type="submit" class="btn btn-primary"><i class="icon-ok icon-white"></i></button><button type="button" class="btn clearfix"><i class="icon-ban-circle"></i></button>'; $.fn.editableform.buttons = '<button type="submit" class="btn btn-primary"><i class="icon-ok icon-white"></i></button>'+
'<button type="button" class="btn clearfix"><i class="icon-ban-circle"></i></button>';
//error classes //error classes
$.fn.editableform.errorGroupClass = 'error'; $.fn.editableform.errorGroupClass = 'error';

33
src/editable-form/editable-form-jqueryui.js

@ -4,26 +4,23 @@ Editableform based on jQuery UI
(function ($) { (function ($) {
$.extend($.fn.editableform.Constructor.prototype, { $.extend($.fn.editableform.Constructor.prototype, {
initTemplate: function() { initTemplate: function() {
this.$form = $($.fn.editableform.template); this.$form = $($.fn.editableform.template);
//buttons //buttons
this.$form.find('div.editable-buttons').append($.fn.editableform.buttons); this.$form.find('div.editable-buttons').append($.fn.editableform.buttons);
this.$form.find('button[type=submit]').button({ this.$form.find('button[type=submit]').button({
icons: { primary: "ui-icon-check" }, icons: { primary: "ui-icon-check" },
text: false text: false
}); }).removeAttr('title');
this.$form.find('button[type=button]').button({ this.$form.find('button[type=button]').button({
icons: { primary: "ui-icon-cancel" }, icons: { primary: "ui-icon-cancel" },
text: false text: false
}); }).removeAttr('title');
} }
}); });
//buttons
$.fn.editableform.buttons = '<button type="submit" style="height: 24px">submit</button><button type="button" style="height: 24px">cancel</button>';
//error classes //error classes
$.fn.editableform.errorGroupClass = null; $.fn.editableform.errorGroupClass = null;
$.fn.editableform.errorBlockClass = 'ui-state-error'; $.fn.editableform.errorBlockClass = 'ui-state-error';

5
src/editable-form/editable-form.css

@ -12,6 +12,11 @@
margin-left: 7px; margin-left: 7px;
} }
/*for jquery-ui buttons need set height to look more pretty*/
.editable-buttons button.ui-button {
height: 24px;
}
.editableform-loading { .editableform-loading {
background: url('img/loading.gif') center center no-repeat; background: url('img/loading.gif') center center no-repeat;
height: 25px; height: 25px;

5
src/editable-form/editable-form.js

@ -410,15 +410,16 @@ Editableform is linked with one of input types, e.g. 'text' or 'select'.
$.fn.editableform.template = '<form class="form-inline editableform">'+ $.fn.editableform.template = '<form class="form-inline editableform">'+
'<div class="control-group">' + '<div class="control-group">' +
'<div class="editable-input"></div><div class="editable-buttons"></div>'+ '<div class="editable-input"></div><div class="editable-buttons"></div>'+
'<div class="editable-error-block"></div>' +
'</div>' + '</div>' +
'<div class="editable-error-block"></div>' +
'</form>'; '</form>';
//loading div //loading div
$.fn.editableform.loading = '<div class="editableform-loading"></div>'; $.fn.editableform.loading = '<div class="editableform-loading"></div>';
//buttons //buttons
$.fn.editableform.buttons = '<button type="submit">Ok</button><button type="button">Cancel</button>'; $.fn.editableform.buttons = '<button type="submit">Ok</button>'+
'<button type="button">Cancel</button>';
//error class attahced to control-group //error class attahced to control-group
$.fn.editableform.errorGroupClass = null; $.fn.editableform.errorGroupClass = null;