按下ok按钮后,如何使用幻灯片范围中的值(例如:插入到mysql)?
按下后提交插入到mysql(在php标签而不是脚本)
http://jsfiddle.net/5Kvk5/1/
$(function() {
var minPriceInRupees = 0;
var maxPriceInRupees = 500;
var currentMinValue = 33;
var currentMaxValue = 333;
$( "#slider-range" ).slider({
range: true,
min: minPriceInRupees,
max: maxPriceInRupees,
values: [ currentMinValue, currentMaxValue ],
slide: function( event, ui ) {
$( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
currentMinValue = ui.values[ 0 ];
currentMaxValue = ui.values[ 1 ];
}
});
$( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
" - $" + $( "#slider-range" ).slider( "values", 1 ) );
});
http://jsfiddle.net/5Kvk5/2/
你需要点击事件,只需获得滑块的值:
$(":submit").on("click", function(){
var values = $( "#slider-range" ).slider( "option", "values" );
// do all your fancy stuff here
// the slider values are available via values[0] and values[1]
// as proof of concept, we write them into the console using the following line
console.log(values[0], values[1]);
});
为了将其传递给php脚本,我会做如下操作:
$.post( "meServerSide.php", { minVal: values[0], maxVal: values[1]});
然后你的php可以用访问它
$_POST["minVal"];
$_POST["maxVal"];
因为您可以获得滑块的值。您现在需要将它们包含在表单中。
currentMinValue = ui.values[0];
currentMaxValue = ui.values[1];
在表单中,必须添加最小值和最大值的字段。
<input type="text" id="minValue" name="minValue" readonly />
<input type="text" id="maxValue" name="maxValue" readonly />
请注意,输入元素中的name
属性。
在您的PHP代码中,您现在可以获得类似以下的数据
<?php echo $_POST['minValue']; ?>
<?php echo $_POST['maxValue']; ?>
然后在SQL语句中,它可能是这样的。
$sql = "INSERT INTO `table_name` (`field`) VALUES (`$_POST[minValue]`)";
这里的代码示例很粗糙,但这只是给你一个想法。因此,请阅读PHP中的Prepared Statements以防止注入攻击。
请参阅JSFiddle