How to get value from clockpicker and pass it to my form f.date_field?

Question

I am building an app that needs user input for a date and a hour of an event.I am using a form_for helper and get the values before f.submit.I am able to take the date correctly through the f.date_field that gives u a build in minicalendar and i am using a bootstrap clockpicker to get the hour.Here is the problem.I want to get the hour and concatenate it to f.date_field because it takes a default hour 00:00:00 UTC but i dont know how to do it.I am a beginner at Javascript .Any help would be appreciated. This is my code:

html with some ruby

 <div class="input-group clockpicker" data- 
  placement="right" data-align="top" data- 
  autoclose="true">
   <input id ="time1" type="text" class="form-control" 
    value="ώρα..">
   <span class="input-group-addon">
    <span class="glyphicon glyphicon-time"></span>

  </span>
 </div>


<br>

<div id="newgame">
  <%= f.submit "New Game" %>
</div>

and here is my script for clockpicker

<script type="text/javascript" src="dist/bootstrap- 
              clockpicker.min.js"></script>
<script type="text/javascript">
       $('.clockpicker').clockpicker();
</script>

Answer 1

I find the answer , well a not JS way to do this is to add to input ... name='game[time] ..>

and then take this value to the contoller like this

    #get time from clock and concatenate it with date to start_time
    date = params['game']['start_time']
    time = params['game']['time']
    @game.start_time = Time.parse("#{date} #{time}") + 3.hours

the +3.hours is because it took the hour in a different timezone from mine and i had to adjust it.