JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.12.4.js"></script>
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<form id="yourFormId">
<p>Start Date: <input type="text" id="from"></p>
<p>End Date: <input type="text" id="to"></p>
<label for="number">Select a number</label>
    <select name="number" id="number">
      <option selected="selected">15</option>
      <option>30</option>
      <option>60</option>
    </select>
<input type="submit" value="Get Data">
</form>

<div id="output">

</div>

JavaScript

var startValue, endValue, intervalValue, startDate, endDate, offset; 

$(document).ready(function() {

intervalValue = $('#number option:selected').val();

$('#yourFormId').on('submit', function(event)
{
 event.preventDefault();
intervalValue = intervalValue * (1000*60);
// make other stuff ...

$('#output').html('interval: ' + intervalValue + ' - from: ' + startValue + ' to: ' + endValue);
});

$("#from").datepicker({
    onSelect: function() {
      startValue = $(this).datepicker('getDate');
    }
});

$("#to").datepicker({
    onSelect: function() {
        endValue = $(this).datepicker('getDate');
    }
});

$('#number').change(function(){
intervalValue = this.value;
});

});