Date picker separated: reset time when reset date

This commit is contained in:
chris 2013-01-09 17:08:09 +08:00
parent 1d405c3ffe
commit b49251afee
4 changed files with 36 additions and 7 deletions

View File

@ -11,7 +11,24 @@ $(document).ready(function(){
}); });
$('.separated_picker div').on("changeDate",function(){ $('.separated_picker div').on("changeDate",function(){
if ($(this).hasClass('date_picker'))
{
if ($(this).find('input').val())
{
}
else
{
$(this).siblings('div').find('input').val(null);
$(this).siblings('div').disabled = true;
$(this).siblings('div').unbind('click');
}
}
$(this).siblings('input').val($(this).find('input').val() + ' ' + $(this).siblings('div').find('input').val()); $(this).siblings('input').val($(this).find('input').val() + ' ' + $(this).siblings('div').find('input').val());
}); });
// $('.date_picker').on("changeDate",function(){
// $(this).find('input').val('');
// });
}); });

View File

@ -46,8 +46,9 @@
this.pickDate = options.pickDate; this.pickDate = options.pickDate;
this.pickTime = options.pickTime; this.pickTime = options.pickTime;
this.isInput = this.$element.is('input'); this.isInput = this.$element.is('input');
// this.component = this.$element.is('.input-prepend') ? this.$element.find('.add-on') : false; // this.component = this.$element.is('.input-prepend') ? this.$element.find('.iconbtn') : false;
this.component = this.$element.is('.input-append') ? this.$element.find('.add-on') : false; this.component = this.$element.is('.input-append') ? this.$element.find('.iconbtn') : false;
this.clearDate = this.$element.is('.input-append') ? this.$element.find('.clearDate') : false;
this.format = options.format; this.format = options.format;
if (!this.format) { if (!this.format) {
if (this.isInput) this.format = this.$element.data('format'); if (this.isInput) this.format = this.$element.data('format');
@ -215,7 +216,7 @@
input = this.$element.find('input'); input = this.$element.find('input');
this.widget.css({ this.widget.css({
top: offset.top + this.height, top: offset.top + this.height,
left: offset.left - input.outerWidth(), left: offset.left - input.outerWidth() - this.width,
}); });
}, },
@ -694,6 +695,12 @@
this._resetMaskPos(input); this._resetMaskPos(input);
}, },
clear: function(e) {
if (this.isInput) this.$element.val(null);
else this.$element.find('input').val(null);
this.notifyChange();
},
showMode: function(dir) { showMode: function(dir) {
if (dir) { if (dir) {
this.viewMode = Math.max(this.minViewMode, Math.min( this.viewMode = Math.max(this.minViewMode, Math.min(
@ -833,6 +840,7 @@
// this handles time picker clicks // this handles time picker clicks
this.widget.on('click', '[data-action]', $.proxy(this.doAction, this)); this.widget.on('click', '[data-action]', $.proxy(this.doAction, this));
this.widget.on('mousedown', $.proxy(this.stopEvent, this)); this.widget.on('mousedown', $.proxy(this.stopEvent, this));
this.clearDate.on('click', $.proxy(this.clear, this));
if (this.pickDate && this.pickTime) { if (this.pickDate && this.pickTime) {
this.widget.on('click.togglePicker', '.accordion-toggle', function(e) { this.widget.on('click.togglePicker', '.accordion-toggle', function(e) {
e.stopPropagation(); e.stopPropagation();
@ -847,7 +855,7 @@
expanded.collapse('hide'); expanded.collapse('hide');
closed.collapse('show') closed.collapse('show')
$this.find('i').toggleClass(self.timeIcon + ' ' + self.dateIcon); $this.find('i').toggleClass(self.timeIcon + ' ' + self.dateIcon);
self.$element.find('.add-on i').toggleClass(self.timeIcon + ' ' + self.dateIcon); self.$element.find('.iconbtn i').toggleClass(self.timeIcon + ' ' + self.dateIcon);
} }
}); });
} }

View File

@ -6,6 +6,7 @@ module OrbitFormHelper
def datetime_picker(object_name, method, options = {}) def datetime_picker(object_name, method, options = {})
options[:icon_time] ||= 'icons-clock' options[:icon_time] ||= 'icons-clock'
options[:icon_date] ||= 'icons-calendar' options[:icon_date] ||= 'icons-calendar'
options[:icon_clear] ||= 'icons-cross-3'
options[:input_class] ||= 'input-large' options[:input_class] ||= 'input-large'
options[:value] ||= options[:object][method] if options[:object] && options[:object][method] options[:value] ||= options[:object][method] if options[:object] && options[:object][method]
case options[:picker_type] case options[:picker_type]
@ -82,7 +83,10 @@ module OrbitFormHelper
content_tag :div, :class => "#{options[:picker_class]} input-append" do content_tag :div, :class => "#{options[:picker_class]} input-append" do
concat label_tag options[:label] unless options[:no_label] concat label_tag options[:label] unless options[:no_label]
concat text_field object_name, method, :placeholder => options[:placeholder], :class => options[:input_class], 'data-format' => options[:format], :value => options[:value] concat text_field object_name, method, :placeholder => options[:placeholder], :class => options[:input_class], 'data-format' => options[:format], :value => options[:value]
concat (content_tag :span, :class => 'add-on' do concat (content_tag :span, :class => 'add-on clearDate' do
content_tag :i, nil, :class => options[:icon_clear]
end)
concat (content_tag :span, :class => 'add-on iconbtn' do
content_tag :i, nil, 'data-time-icon' => options[:icon_time], 'data-date-icon' => options[:icon_date] content_tag :i, nil, 'data-time-icon' => options[:icon_time], 'data-date-icon' => options[:icon_date]
end) end)
end end

View File

@ -15,8 +15,8 @@
</div> </div>
<h3 class="widget-title"><i class="icons-calendar"></i><%= t(:date_) %></h3> <h3 class="widget-title"><i class="icons-calendar"></i><%= t(:date_) %></h3>
<div class="widget-content clear"> <div class="widget-content clear">
<%= f.datetime_picker :post_date, :picker_type => 'date', :label => t(:start_date) %> <%= f.datetime_picker :post_date, :picker_type => 'date', :label => t(:start_date), :icon_date => "icons-cross-3 icon-spin" %>
<%= f.datetime_picker :unpost_date, :picker_type => 'date', :label => t(:end_date) %> <%= f.datetime_picker :unpost_date, :picker_type => 'separated', :label => t(:end_date) %>
</div> </div>
</div> </div>