The javascript below creates a slider within a form that has the submission code on the same page.
The code within the form that shows the slider from the javascript is
<div id="outbox-bottom">Callback time selected <span style="font-size:9px">(Ex Weekends):</span> <span id="callback_selected"></span></div>
I need a way to get the time that was selected on the slider into a variable that I can use to get in my form as in $time = $_POST['time'];
<script type="text/javascript">
jQuery.noConflict();
jQuery(function() {
jQuery('#callback_selected').html("9 am");
var select = jQuery( "#callback" );
var slider = jQuery( "<div id='slider'></div>" ).insertAfter( select ).slider({
min: 1,
max: 12,
range: "min",
value: 1,
step: .5,
slide: function (event, ui) {
$time_int = ui.value;
if (ui.value < 5) {
$time_int = $time_int + 8;
if ($time_int.toString().substr(-2) == '.5') $time_int = $time_int.toString().split('.')[0] + ":30";
$time_selected = $time_int + " am";
} else {
$time_int = $time_int - 4;
if ($time_int.toString().substr(-2) == '.5') $time_int = $time_int.toString().split('.')[0] + ":30";
$time_selected = $time_int + " pm";
}
jQuery('#callback_selected').html($time_selected);
}
});
});
</script>
Add a hidden input into your form:
<input type="hidden" name="time" id="time" value="" />
Then, once they've selected the time and you're updating the html #callback_selected
, add another to update the value of the hidden field. It will post the value along with the form.
// Rest of your script...
jQuery("#time").val($time_selected);
Now you should be able to find the time
value in your post.
Sounds like you're going to need to use some Ajax to send that data to PHP.
Check this out:
http://api.jquery.com/jQuery.ajax/
Basically you'll have an Ajax functions that sends arguments to a php file. From there you can do what you need with the variables you send.