jqueryUI滑块值没有保存到数据库

我正在用jQuery ui滑块构建一个简单的页面。目标很容易达到：用户移动滑块，然后他/她点击Submit按钮并使用Ajax将该值存储在数据库中。jqueryUI滑块值没有保存到数据库

我的问题是，实际上没有值保存在数据库中。

所以：滑块+ PHP +形式阿贾克斯

如果有更好的办法后，完全重写我的傻代码来实现我的目标，请做到这一点。

这是我的代码：

的index.php

<!DOCTYPE> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>UI test</title> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script> 
     <style type="text/css"> 
#container{ 
background:url(bg.jpg)!important; 
padding:100px 50px 0px 50px; 
} 

/*the slider background*/ 
.slider { 
width:230px; 
height:11px; 
background:url(slider-bg.png); 
position:relative; 
margin:0; 
padding:0 10px; 
} 

/*Style for the slider button*/ 
.ui-slider-handle { 
width:24px; 
height:24px; 
position:absolute; 
top:-7px; 
margin-left:-12px; 
z-index:200; 
background:url(slider-button.png); 
} 

/*Result div where the slider value is displayed*/ 
#slider-result { 
font-size:50px; 
height:200px; 
font-family:Arial, Helvetica, sans-serif; 
color:#fff; 
width:250px; 
text-align:center; 
text-shadow:0 1px 1px #000; 
font-weight:700; 
padding:20px 0; 
} 

/*This is the fill bar colour*/ 
.ui-widget-header { 
background:url(fill.png) no-repeat left; 
height:8px; 
left:1px; 
top:1px; 
position:absolute; 
} 

a { 
outline:none; 
-moz-outline-style:none; 
} 


     </style> 
</head> 
<body> 
    <div class="slider"></div> 
    <div id="slider-result">50</div> 
    <form method="post"> 
     <input type="hidden" id="hidden" name="hidden" class="pasui"/> 
     <input type="button" id="bottone" value="Send data"> 
    </form> 
    <script> 
     $(".slider").slider({ 
      animate: true, 
      range: "min", 
      value: 50, 
      min: 10, 
      max: 100, 
      step: 10, 
      //this gets a live reading of the value and prints it on the page 
      slide: function(event, ui) { 
       $("#slider-result").html(ui.value); 
      }, 
      //this updates the hidden form field so we can submit the data using a form 
      change: function(event, ui) { 
       $('#hidden').attr('value', ui.value); 
      } 
     }); 
     $("#bottone").click(function(e) { 
      e.preventDefault(); 
      var name = $("#hidden").val(); 
      /* var last_name = $("#last_name").val();*/ 
      var dataString = 'name='+name; 
      $.ajax({ 
       type:'POST', 
       data:dataString, 
       url:'scrividb.php', 
       success:function(data) { 
        alert(data); 
       } 
      }); 
     }); 
    </script> 
    <div id="risultato"></div> 
</body> 
</html>

scrividb.php

<?php 
$link = mysql_connect('localhost', 'username', 'pass'); 
$database = testui; 

mysql_select_db($database,$link); 

$name = $_POST['hidden']; 
    $insert = "insert into slivalui values('$name')"; 
    if(mysql_query($insert)) { 
    echo "Success, value:".$name.""; 
    } else { 
    echo "Cannot Insert"; 
    };?>

来源

2013-06-20 Downloadtaky

试着改变你的var dataString = 'name='+name; 到var dataString = {name:name}; 与$name = $_POST['name'];

也搭上它在PHP端：Val取代（new_val）而不是使用ATTR（）更新表单字段值;在您更改事件的代码应该是：

change: function(event, ui) { $('#hidden').val(ui.value); //set value of form field }

来源

2013-06-20 18:47:06 Ecropolis

也只是要注意，你应该用'$名称= mysql_real_escape_string保护您的用户输入数据（ $ _POST ['name']）;'见http://php.net/manual/en/function.mysql-real-escape-string.php – Ecropolis

你没有'value =“”'隐藏字段 – amigura

仍然接收：不能插入 – Downloadtaky

您发送名称THROU JQ不是隐藏

$name = mysql_real_escape_string($_POST['name']); 

INSERT INTO slivalui (field name) VALUES ('$name');

来源

2013-06-20 19:27:08 amigura

jqueryUI滑块值没有保存到数据库

回答

相关问题