Using a JQuery timepicker plugin in a form Rails 4

Question

I installed a JQuery timepicker plugin through Bower-Rails and I can't figure out how to get the plugin to work on my form.

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
 <script type="text/javascript">
   $(document).ready(function() {
     $('p').timepicker({
       'minTime': '9:00am',
       'maxTime': '9:00pm',
       'showDuration': true
     });
   });
 </script>
</head>

<body>

<form role="form">
 <p> <div class = "row">
      <div class = "form-group col-md-3">
       <%= f.label :start_time %><br>
       <%= f.time_field :start_time, class: "form-control" %>
     </div>
    </div></p>
</form>  
</body>
</html>

Am I setting up the script incorrectly?

Answer 1

You probably want to invoke .timepicker() on the actual HTML element that is hosting that DOM element. which appears to have a class of .form-control (I'd name this something better tho).

So change your jQuery selector to:

$('.form-control').timepicker({
       'minTime': '9:00am',
       'maxTime': '9:00pm',
       'showDuration': true
     });

But again, add a more descriptive class other than form-control and use that in your selector.

Using a JQuery timepicker plugin in a form Rails 4

Question

1 answers

solution1
0 ACCPTED 2014-11-21 17:57:50

Using a JQuery timepicker plugin in a form Rails 4

Question

1 answers

solution1 0 ACCPTED 2014-11-21 17:57:50

solution1
0 ACCPTED 2014-11-21 17:57:50