为什么我的ajax无法在输入表单中获取当前键入的字符串?

时间:2011-09-13 09:21:27

标签: php jquery ajax

我有一个简单的表单,然后我将表中的一些数据放到每个输入表单的value属性中。现在我的问题是,每当我输入输入表单的新内容,更新数据时,它都无法获取当前输入的字符串,我不知道如何解决这个问题,因为我认为它正在回收相反的值在此更新页面上的当前键入的字符串,

这是我的前端

    <fieldset id="personaldetails">
    <legend>Personal Details</legend>
    Resume Title: <input type="text" name="resumetitle" id="resumetitle" value="<?php echo $v['ResumeTitle']; ?>" size="50" maxlength="50" /><br />
    Name: <input type="text" name="cvname" id="cvname" size="30" maxlength="30" value="<?php echo $v['Name']; ?>" /><br />
    DOB: <input type="text" id="datepicker" name="dob" value="<?php $date = new DateTime($v['DOB']); echo $date->format('m/d/Y'); ?>" /><br />
    Gender:  <input type="radio" name="gender" id="gender-male" value="1" <?php if($v['Gender'] == 1){ echo "checked"; } ?>/> <b>Male</b> |
     <input type="radio" name="gender" id="gender-female" value="0" <?php if($v['Gender'] == 0){ echo "checked"; } ?>/> <b>Female</b><br /><br />
    <input type="hidden" name="cvid" id="cvid" value="<?php echo $v['ResumeID']; ?>" />
    <button name="pdetails" id="pdetails">Update</button>
    </fieldset><br /><br />

//这是我的js

$(document).ready(function(){
 var resumetitle = $('#resumetitle').val();
 var cvid = $('input[type="hidden"]').val();
 var name = $('#cvname').val();
 var dob = $('#datepicker').val();
 var gender = $('input[name="gender"]:checked').val();


$('button#pdetails').click(function(){
   $.ajax({
      type: "POST",
      url: "classes/ajax.resumeupdate.php",
      data: "resumeid="+cvid+"&resumetitle="+resumetitle+"&name="+name+"&dob="+dob+"&gender="+gender,
      success: function(){
        //window.location = "resumeview.php?cvid="+cvid;
      },
   });
});


});

//这是我的PHP代码

require 'class.resume.php';

$db = new Resume();

if(isset($_POST['resumetitle']) || isset($_POST['name']) || isset($_POST['dob']) ||
   isset($_POST['gender']) || isset($_POST['cvid'])){
    $result =  $db->updatepdetails($_POST['resumetitle'],$_POST['name'],$_POST['dob'],$_POST['gender'],$_POST['cvid']);
    if($result){
      echo "success!";
    } else {
      echo "failed! ".$db->error;
    }
   }

2 个答案:

答案 0 :(得分:2)

您的javascript只解析一次表单值(在页面加载时),因此如果您在页面加载后输入内容,则变量不会更改。

您可以简单地计算Ajax回调中的值。但你真正应该做的是使用jQuery的$.serialize()函数,该函数创建一个标准的a=1&b=2&c=3查询字符串,包括(正确转义的)表单数据:

$(function(){
  $('button#pdetails').click(function(){
    $.ajax({
      type: "POST",
      url: "classes/ajax.resumeupdate.php",
      data: $('form').serialize(),
      success: function(){
        //window.location = "resumeview.php?cvid="+cvid;
      }
    });
  });
});

另请注意,在成功函数后面有一个尾随逗号 - 这个will fail in IE所以我也改变了它。

答案 1 :(得分:2)

您只是阅读文档准备就绪的值,将该代码移动到click事件中:

$(document).ready(function(){
   $('button#pdetails').click(function(){
     var resumetitle = $('#resumetitle').val();
     var cvid = $('input[type="hidden"]').val();
     var name = $('#cvname').val();
     var dob = $('#datepicker').val();
     var gender = $('input[name="gender"]:checked').val();
     $.ajax({
       type: "POST",
       url: "classes/ajax.resumeupdate.php",
       data: "resumeid="+cvid+"&resumetitle="+resumetitle+"&name="+name+"&dob="+dob+"&gender="+gender,
       success: function(){
           //window.location = "resumeview.php?cvid="+cvid;
       },
     });
   });
});