通过ajax将表单值从一种表单传递到另一种表单并返回到第一种形式

我有一个带有文本框的表单，当enduser将值输入到表单的字段中时，它们将被提交到计算页面，并且它们再次返回应显示不带刷新和计算输出的相同表格的计算值。是否有可能做与Ajax/jQuery和PHP。我的表单代码是这样的：通过ajax将表单值从一种表单传递到另一种表单并返回到第一种形式

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <title>Untitled Document</title> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
    <style type="text/css">@import "css/jquery.datepick.css";</style> 
    <script type="text/javascript" src="js/jquery.datepick.js"></script> 
    <link rel="stylesheet" type="text/css" href="css/css.css"/> 
    </head> 

    <body> 
    <div id="formwraper"> 
    <div id="doctorstitle"><h1> Vitals</h1><br/></div> 
    <div id="formbody"> 

     <form name="vitals" method="post" action="calculator.php" onSubmit="return false";> 
     <div id="formpoints"> 
     <div id="left"> 
     Age: 
     </div> 
     <div id="right">  
     <input type="text" name="age" id="age" /> 
     </div> 
    </div> 
      <div id="formpoints"> 
     <div id="left"> 
     Height (in cms): 
     </div> 
     <div id="right">  
     <input type="text" name="height" id="height" /> 
     </div> 
    </div> 
      <div id="formpoints"> 
     <div id="left"> 
     Weight (in kgs): 
     </div> 
     <div id="right">  
     <input type="text" name="Weight" id="Weight" /> 
     </div> 
<div> Calculated BMI value here</div>

我想显示无需刷新基于上述三个值这个值和提交按钮

</div> 
      <div id="formpoints"> 
     <div id="left"> 
     Systolic BP: 
     </div> 
     <div id="right">  
     <input type="text" name="Systolic BP" id="Systolic BP" /> 
     </div> 
    </div> 
      <div id="formpoints"> 
     <div id="left"> 
     Diastolic BP: 
     </div> 
     <div id="right">  
     <input type="text" name="Diastolic BP" id="Diastolic BP" /> 
     </div> 
    </div> 
      <div id="formpoints"> 
     <div id="left"> 
     Pulse: 
     </div> 
     <div id="right">  
     <input type="text" name="pulse" id="pulse" /> 
     </div> 
    </div> 
      <div id="formpoints"> 
     <div id="left"> 
     Temperature: 
     </div> 
     <div id="right">  
     <input type="text" name="Temp" id="Temp" /> 
     </div> 
    </div> 
      <div id="formpoints"> 
     <div id="left"> 
     General Health status: 
     </div> 
     <div id="right">  
     <input type="text" name="ghs" id="ghs" /> 
     </div> 
    </div> 
      <div id="formpoints"> 
     <div id="left"> 
     Emergency : 
     </div> 
     <div id="right">  
     <input type="text" name="emergency" id="emergency" /> 
     </div> 
    </div> 
     </form> 
     <script> 
     $("button").click(function(){ 
    $.post("calculator.php",$(vitals).serialize(),function(result) 
    { 
    $(vitals).html(result);} 
    ); 
    }); 

     </script> 
     </div> 

    </body> 
    </html>

任何人都可以请帮我在这方面

在此先感谢 Ramsai

来源

2012-05-10 ramsai

http://mattgemmell.com/2008/12/08/what-have-you-tried/这是一个可悲的迹象，我知道这个URL的心脏。 –

@rory我认为我们需要把它作为闪屏欢迎屏幕 –

好的，但是你能发布你写的代码吗？你需要帮助。目前你的问题读起来就像一个报价规格。 –

$("button").click(function(){ 
$.post("php page url",$(form_id).serialize(),function(result) 
{ 
$(form_id).html(result);} 
); 
});

注： 1）在php页面中，回显所有输入，提交的值为textareas

2）将属性添加到表单标签onSubmit =“return false;”

来源

2012-05-10 11:41:36

你得到了什么错误 – 2012-05-11 06:51:52

通过ajax将表单值从一种表单传递到另一种表单并返回到第一种形式

回答

相关问题