Rails为表单增加时间选框

Rails为表单增加时间选框

我使用的是form_tag表单，在text_field_tag中增加时间选框，只需要添加相应的JavaScript类名到text_field_tag中，并在html最后添加时间选框的JavaScript代码即可
html代码：

= text_field_tag "diagnose_task[diagnose_range]", time_ranges[2][0], size: 40, class: "form-control form-control-sm #{'daterange'}"

time_range参数规定了时间选框的默认值，选中后的值传入diagnose_task对象

JavaScript代码：

:coffee
  $('.daterange').daterangepicker(
    #startDate: moment().subtract(7,'d')
    #endDate: moment().subtract(1,'d')
    minDate: '2017-01-01 00:00:00'
    maxDate: moment().format('YYYY-MM-DD HH:mm:ss')
    maxSpan:
      days: 365
    locale:
      format: 'YYYY-MM-DD HH:mm:ss'
      separator: ' ~ '
      applyLabel: '确定'
      cancelLabel: '取消'
      #fromLabel: '从'
      #toLabel: '到'
      customRangeLabel: '自定义'
      weekLabel: '周'
      daysOfWeek: ['日', '一', '二', '三', '四', '五', '六']
      monthNames: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']
      firstDay: 1
    ranges:
      #'今天': [moment(), moment()]
      '最近1天': [moment().subtract(1, 'days'), moment()]
      '最近3天': [moment().subtract(3, 'days'), moment()]
      '最近7天': [moment().subtract(7, 'days'), moment()]
      '最近14天': [moment().subtract(14, 'days'), moment()]
      '最近30天': [moment().subtract(30, 'days'), moment()]
    alwaysShowCalendars: true
    #showWeekNumbers: true
    #showDropdowns: true
    #autoApply: true
    applyClass: 'btn-info font-weight-normal'
    cancelClass: 'btn-outline-info font-weight-normal'
    timePicker: true
    timePickerSeconds: true
    timePicker24Hour: true
  )
  $('.daterange').on('apply.daterangepicker', (ev, picker) -> $('#time_range_tag').text(picker.chosenLabel) )
  # TODO: on choose start, format begin_time & end_time to beginning_of_day & end_of_day
  $('.daterangepicker').addClass('shadow-lg text-info')

选框样式：