JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/additional-methods.js"></script>
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="http://tympanus.net/Freebies/Boxify/css/bootstrap.min.css">
<form role="form" id="myform">
										
										<div class="form-group">
                                            <label>what is your number?</label>
											<div class="col-lg-12">
												<div class="col-lg-6">
													<div class="checkbox">
														<label>
															<input type="checkbox" value="">one
														</label>
													</div>
													<div class="checkbox">
														<label>
															<input type="checkbox" value="">two
														</label>
													</div>
													<div class="checkbox">
														<label>
															<input type="checkbox" value="">three
														</label>
													</div>
													<div class="checkbox">
														<label>
															<input type="checkbox" value="">four
														</label>
													</div>
												</div>
												<div class="col-lg-6">
													<div class="checkbox">
														<label>
															<input type="checkbox" value="">five
														</label>
													</div>
													<div class="checkbox">
														<label>
															<input type="checkbox" value="">six
														</label>
													</div>
													<div class="checkbox">
														<label>
															<input type="checkbox" value="">seven
														</label>
													</div>
													<div class="checkbox">
														<label>
															<input type="checkbox" value="">eight
														</label>
													</div>
												</div>
											</div>
                                        </div>
										
										<div...

CSS

.has-error label.error {
    color: #a94442;
}
.has-error .help-block { 
    color: #737373;
}

JavaScript

$('#myform').validate({// initialize the plugin
					errorElement: 'div',
					rules: {
						datetimepicker: {
							required: true,
							date: true
						},
						commercialText: {
							required: true,
							minlength: 5
						},
						terms: {
							required: true,
							maxlength: 2
						}
					},
					submitHandler: function (form) { 
						var text = $("#customtext").val();
						var date = $("#datetimepicker").val();
						var stand = 2; 
						$.ajax({
							url: 'savedatanow.php',
							type: "POST",
							data: {
								text: text,
								date: date,
								stand: stand
								
							},
							dataType:'text',
							success: function(response)
							{
								
								alert(response);
							}
						});
						//alert('outside ajax');
					},
					highlight: function (element) {
						$(element).closest('.form-group').removeClass('success').addClass('has-error');
					},
					success: function (element) {
						element.addClass('valid')
							.closest('.form-group').removeClass('error').addClass('has-success');
					}					
				});