0

对于这个演示,我从表单获取输入,将它们放入 json 对象并通过 ajax 发送到服务器。如何使用服务器上的数据重新填充表单?我可以让它在控制台中打印,但似乎无法弄清楚如何以表格形式获取它。就像在表单字段中的某处放置类似 jsonObject.firstName 之类的东西一样简单吗?

形式:

div class="form">      
      <form method="GET" action="demo.html">  
      <section class="formSection">  
        <div class="dataChunk">
          <label for="firstName">First Name:</label>
          <input type="text"  id="jsonObject.firstName" maxlength="50" />  
        </div>                    
        <div class="dataChunk">    
          <label for="lastName">Last Name:</label>         
          <input type="text"  id="lastName" maxlength="50" />  
        </div>       
        <div class="dataChunk">   
          <label for="phoneNumber">Phone:</label>
          <input type="text"  id="phoneNumber" maxlength="10" />
        </div>             
        <div class="dataChunk">   
          <label for="address">Address:</label>
          <input type="text"  id="address" maxlength="50" />
        </div>  
       </section>                  
    </form> 
  </div>

json对象

var jsonObject = {
  "firstName" : firstName, 
  "lastName" : lastName,
  "phone" : phone,
  "address" : address
  };

php

$name = $_REQUEST['firstName']." ".$_REQUEST['lastName'];
$phone = $_REQUEST['phone'];
$address = $_REQUEST['address'];

$person = Array();
$person['name'] = $name;
$person['phone'] = $phone;
$person['address'] = $address;

$returnObj = json_encode($person);
echo $returnObj;
?>
4

2 回答 2

2

您需要使用 $.each 遍历您的 php json 编码返回并通过选择器更新您的表单元素

 $(document).ready(function() {
    $('form').submit( function(){
      var values = serialize( $(this) );
      $.ajax({
         url: 'demo.php'
         data: values,
         Success: function(result){
           $.each(result, function( key, value ) ({
            $('#'+key).val(value); 
           });
         }
      });
     });
  });

未经测试,因为我在移动设备上,但总体布局在那里,如果我犯任何语法错误,我会更新

将 jsonobject 放在元素 id 前面不会自动解析 json 返回的对象

于 2012-10-24T01:45:41.837 回答
0

使用 jQuery 你会说

$('#yourInputId').val(jsonObject.firstname);

或者:(对不起,我对普通的 JS 有点生疏)类似于

document.getElementById('yourInputId').value(jsonObject.firstname);

当您的 jsonObject 可用时使用。

为了清楚起见,我更改了您输入 ID 的名称。希望这可以帮助

于 2012-10-23T20:20:06.207 回答