Tempus Dominus SimpleForm Custom Input

A SimpleForm custom input for Tempus Dominus with Bootstrap 4


class TempusDominusInput < SimpleForm::Inputs::Base
  def input(wrapper_options)
    template.content_tag(:div, class: 'input-group date', data: { target_input: 'nearest' }, id: "#{object_name}_#{attribute_name}") do
      template.concat @builder.text_field(attribute_name, input_html_options)
      template.concat div_button
    end
  end

  def input_html_options
    super.merge({class: 'form-control datetimepicker-input'})
  end

  def div_button
    template.content_tag(:div, class: 'input-group-append', data: {target: "##{object_name}_#{attribute_name}", toggle: 'datetimepicker'} ) do
      template.concat span_table
    end
  end

  def span_table
    template.content_tag(:div, class: 'input-group-text') do
      template.concat icon_table
    end
  end

  def icon_remove
    "<i class='glyphicon glyphicon-remove'></i>".html_safe
  end

  def icon_table
    "<i class='fa fa-calendar'></i>".html_safe
  end
end

<script>

  $(function () {
    $('#my_object_end_date').datetimepicker({
      defaultDate: '<%= @my_object.end_date %>',
      format: "YYYY-MM-DD HH:mm Z"
    });
  });
</script>

 

This is a different version of the same SimpleForm custom input although stylized for a different Bootstrap 4 Theme. 


class TempusDominusInput < SimpleForm::Inputs::Base
  def input(wrapper_options)
    template.content_tag(:div, class: 'input-group date', data: { target_input: 'nearest' }, id: "#{object_name}_#{attribute_name}") do
      template.concat @builder.text_field(attribute_name, input_html_options)
      template.concat div_button
    end
  end

  def input_html_options
    super.merge({class: 'form-control datetimepicker-input'})
  end

  def div_button
    template.content_tag(:div, class: 'input-group-append', data: {target: "##{object_name}_#{attribute_name}", toggle: 'datetimepicker'} ) do
      template.concat span_button
    end
  end

  def span_button
    template.content_tag(:span, class: 'input-group-btn') do
      template.concat calendar_button
    end
  end

  def calendar_button
    template.button_tag(class: 'btn btn-primary', :type => 'button') do
      template.concat icon_table
    end
  end

  def icon_remove
    "<i class='glyphicon glyphicon-remove'></i>".html_safe
  end

  def icon_table
    "<i class='fa fa-calendar'></i>".html_safe
  end
end

Home Office

Cherry Hill, NJ

North New Jersey Office

Kinnelon, NJ

Philadelphia Office

Media, PA

office Hours

Mon - Fri : 8am to 6pm

Social Media