diff --git a/source/Ox.UI/css/Ox.UI.css b/source/Ox.UI/css/Ox.UI.css index 4703ef6f..97ee4442 100644 --- a/source/Ox.UI/css/Ox.UI.css +++ b/source/Ox.UI/css/Ox.UI.css @@ -893,6 +893,7 @@ OxFileInput -------------------------------------------------------------------------------- */ .OxFileInput > .OxBar { + float: left; border-width: 1px; border-style: solid; border-radius: 8px; @@ -910,6 +911,9 @@ OxFileInput border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; } +.OxFileInput > .OxLabel { + float: left; +} /* -------------------------------------------------------------------------------- OxForm diff --git a/source/Ox.UI/js/Form/FileInput.js b/source/Ox.UI/js/Form/FileInput.js index af320c30..a7e01681 100644 --- a/source/Ox.UI/js/Form/FileInput.js +++ b/source/Ox.UI/js/Form/FileInput.js @@ -20,6 +20,8 @@ Ox.FileInput = function(options, self) { var that = Ox.Element({}, self) .defaults({ disabled: false, + label: '', + labelWidth: 128, maxFiles: -1, maxLines: -1, maxSize: -1, @@ -40,10 +42,20 @@ Ox.FileInput = function(options, self) { self.multiple = self.options.maxFiles != 1; self.size = getSize(); + if (self.options.label) { + self.$label = Ox.Label({ + overlap: 'right', + textAlign: 'right', + title: self.options.label, + width: self.options.labelWidth + }) + .appendTo(that); + } + self.$bar = Ox.Bar({size: 14}) .css( Ox.extend({ - width: self.options.width - 2 + 'px' + width: getWidth() - 2 + 'px' }, self.multiple && self.options.value.length ? { borderBottomLeftRadius: 0, borderBottomRightRadius: 0 @@ -54,8 +66,8 @@ Ox.FileInput = function(options, self) { self.$title = $('