bs3 first working version

This commit is contained in:
vitalets
2013-08-31 09:53:34 +04:00
parent 99eb7223ce
commit 5c5a24b86b
14 changed files with 339 additions and 24 deletions

View File

@@ -1,13 +1,31 @@
/*
Editableform based on Twitter Bootstrap
Editableform based on Twitter Bootstrap 2
*/
(function ($) {
"use strict";
//store parent methods
var pInitInput = $.fn.editableform.Constructor.prototype.initInput;
$.extend($.fn.editableform.Constructor.prototype, {
initTemplate: function() {
this.$form = $($.fn.editableform.template);
this.$form.find('.editable-error-block').addClass('help-block');
},
initInput: function() {
pInitInput.apply(this);
//for bs2 set default class `input-medium` to standard inputs
var emptyInputClass = this.input.options.inputclass === null || this.input.options.inputclass === false;
var defaultClass = 'input-medium';
//add bs2 default class to standard inputs
//if(this.input.$input.is('input,select,textarea')) {
var stdtypes = 'text,select,textarea,password,email,url,tel,number,range,time'.split(',');
if(~$.inArray(this.input.type, stdtypes) && emptyInputClass) {
this.input.options.inputclass = defaultClass;
this.input.$input.addClass(defaultClass);
}
}
});
@@ -17,6 +35,8 @@ Editableform based on Twitter Bootstrap
//error classes
$.fn.editableform.errorGroupClass = 'error';
$.fn.editableform.errorBlockClass = null;
$.fn.editableform.errorBlockClass = null;
//engine
$.fn.editableform.engine = 'bs2';
}(window.jQuery));

View File

@@ -0,0 +1,61 @@
/*
Editableform based on Twitter Bootstrap 3
*/
(function ($) {
"use strict";
//store parent methods
var pInitInput = $.fn.editableform.Constructor.prototype.initInput;
$.extend($.fn.editableform.Constructor.prototype, {
initTemplate: function() {
this.$form = $($.fn.editableform.template);
this.$form.find('.control-group').addClass('form-group');
this.$form.find('.editable-error-block').addClass('help-block');
},
initInput: function() {
pInitInput.apply(this);
//for bs3 set default class `input-sm` to standard inputs
var emptyInputClass = this.input.options.inputclass === null || this.input.options.inputclass === false;
var defaultClass = 'input-sm';
//bs3 add `form-control` class to standard inputs
var stdtypes = 'text,select,textarea,password,email,url,tel,number,range,time'.split(',');
if(~$.inArray(this.input.type, stdtypes)) {
this.input.$input.addClass('form-control');
if(emptyInputClass) {
this.input.options.inputclass = defaultClass;
this.input.$input.addClass(defaultClass);
}
}
//apply bs3 size class also to buttons (to fit size of control)
var $btn = this.$form.find('.editable-buttons');
var classes = emptyInputClass ? [defaultClass] : this.input.options.inputclass.split(' ');
for(var i=0; i<classes.length; i++) {
if(classes[i].toLowerCase() === 'input-sm') {
$btn.find('button').addClass('btn-sm');
}
if(classes[i].toLowerCase() === 'input-lg') {
$btn.find('button').addClass('btn-lg');
}
}
}
});
//buttons
$.fn.editableform.buttons =
'<button type="submit" class="btn btn-primary editable-submit">'+
'<i class="glyphicon glyphicon-ok"></i>'+
'</button>'+
'<button type="button" class="btn btn-default editable-cancel">'+
'<i class="glyphicon glyphicon-remove"></i>'+
'</button>';
//error classes
$.fn.editableform.errorGroupClass = 'has-error';
$.fn.editableform.errorBlockClass = null;
//engine
$.fn.editableform.engine = 'bs3';
}(window.jQuery));

View File

@@ -26,5 +26,7 @@ Editableform based on jQuery UI
//error classes
$.fn.editableform.errorGroupClass = null;
$.fn.editableform.errorBlockClass = 'ui-state-error';
//engine
$.fn.editableform.engine = 'jqeury-ui';
}(window.jQuery));

View File

@@ -28,6 +28,9 @@ Editableform is linked with one of input types, e.g. 'text', 'select' etc.
//set initial value
//todo: may be add check: typeof str === 'string' ?
this.value = this.input.str2value(this.options.value);
//prerender: get input.$input
this.input.prerender();
},
initTemplate: function() {
this.$form = $($.fn.editableform.template);
@@ -75,9 +78,8 @@ Editableform is linked with one of input types, e.g. 'text', 'select' etc.
this.initInput();
//append input to form
this.input.prerender();
this.$form.find('div.editable-input').append(this.input.$tpl);
//append form to container
this.$div.append(this.$form);
@@ -615,4 +617,7 @@ Editableform is linked with one of input types, e.g. 'text', 'select' etc.
//error class attached to editable-error-block
$.fn.editableform.errorBlockClass = 'editable-error';
//engine
$.fn.editableform.engine = 'jqeury';
}(window.jQuery));