Question

编辑：发现问题。将name =“demo_name”和我的表单上的这些项目更改为id =“demo_name”修复它。谢谢@Jill

我正在尝试使用jquery的ajax功能将联系表单数据插入MySQL数据库。我是新手，它部分工作，但数据以“未定义”的形式插入到数据库中，而不是输入的值，如姓名，电话等。有人可以帮我查明可能导致它的原因吗？（部分在斯洛伐克，但我把重要的部分翻译成英文）

html页面（只是表单段）：

<div id="demo_form">
    <h2>Order a demo lesson!</h2><p>Na Vaše otázky velmi radi co najskôr zodpovieme.<br /> Prípadná <strong>ukážková hodinu je zdarma</strong> a nezáväzná.</p>
        <form name="demo" action"">
            <fieldset>
                <input type="text" class="text" name="demo_name" onblur="swip (this, '', 'Name *');" onfocus="swip (this, 'Meno *', '');" value="Meno *" />
                <input type="text" class="text" name="demo_age" onblur="swip (this, '', 'Age of child');" onfocus="swip (this, 'Vek dietata', '');" value="Vek dietata" />
                <input type="text" class="text" name="demo_email" onblur="swip (this, '', 'E-mail *');" onfocus="swip (this, 'E-mail *', '');" value="E-mail *" />
                <input type="text" class="text" name="demo_phone" onblur="swip (this, '', 'Phone');" onfocus="swip (this, 'Telefón', '');" value="Telefón" />
                <input type="text" class="text big_input" name="demo_where" onblur="swip (this, '', 'Where did you find out about us?');" onfocus="swip (this, 'Odkial ste sa o nás dozvedeli?', '');" value="Odkial ste sa o nás dozvedeli?" />
                <textarea rows="" cols="" name="demo_text" onblur="swip (this, '', 'Message...');" onfocus="swip (this, 'Text správy...', '');">Text správy...</textarea>


                <input type="submit" class="btn" value="Send" />
            </fieldset> 
        </form>
</div><!-- end: #demo_form -->

的javascript / jquery的：

$(function() {  
  $(".btn").click(function() {  
    // validate and process form here

    var demo_name = $("input#demo_name").val();  

    var demo_age = $("input#demo_age").val();  

    var demo_email = $("input#demo_email").val();  

    var demo_phone = $("input#demo_phone").val();  

    var demo_where = $("input#demo_where").val();  

    var demo_text = $("input#demo_text").val();  


    var dataString = 'demo_name='+ demo_name + '&demo_age=' + demo_age + '&demo_email=' + demo_email + '&demo_phone=' + demo_phone + '&demo_where=' + demo_where + '&demo_text=' + demo_text;  

$.ajax({  
  type: "POST",  
  url: "../php/demo_register.php",  
  data: dataString,  
  success: function() {

    $('#demo_form').html("<div id='message'></div>");  
    $('#message').html("<h2>Contact Form Submitted!</h2>")  
    .append("<p>We will be in touch soon.</p>")  

  }  
});  
return false;   
  });  
});

php脚本：

<?php

include("../protected/config.php");
// Connect to server and select databse.
mysql_connect("$host", "$username", "$password")or die("cannot connect"); 
mysql_select_db("$db_name")or die("cannot select DB");

$demo_name=$_POST['demo_name'];
$demo_age=$_POST['demo_age'];
$demo_email=$_POST['demo_email'];
$demo_phone=$_POST['demo_phone'];
$demo_where=$_POST['demo_where'];
$demo_text=$_POST['demo_text'];

// To protect MySQL injection
$demo_name = stripslashes($demo_name);
$demo_age = stripslashes($demo_age);
$demo_email = stripslashes($demo_email);
$demo_phone = stripslashes($demo_phone);
$demo_where = stripslashes($demo_where);
$demo_text = stripslashes($demo_text);

$demo_name = mysql_real_escape_string($demo_name);
$demo_age = mysql_real_escape_string($demo_age);
$demo_email = mysql_real_escape_string($demo_email);
$demo_phone = mysql_real_escape_string($demo_phone);
$demo_where = mysql_real_escape_string($demo_where);
$demo_text = mysql_real_escape_string($demo_text);


$insert = mysql_query("INSERT INTO $tbl_name (name, age, email, phone, kde, text) VALUES ('$demo_name', '$demo_age', '$demo_email', '$demo_phone', '$demo_where', '$demo_text')");

if(!$insert){ 
die("There's a little problem: ".mysql_error()); 
} 
?>

Answer 1

您应该在此表单下dataString：

var dataString = {demo_name: demo_name, demo_age: demo_age, and_so_on: and_so_on};

Answer 2

更可取的方式：

var dataString = $("form[name='demo']").serialize();

使用JavaScript获取表单数据并使用Ajax发送数据

2 个答案: