Question

基本上，我有两种形式：

<form id="form1">
<input type="text" name="firstname"/>
<input type="text" name="lastname"/>
</form>

<form id="form2" method="POST" action="http://some.url.com">
<input type="hidden" name="school" value="Random school"/>
<input type="hidden" name="year" value = "Random year"/>
<input type="hidden" name="placeforJSON" id="json">
<input type="submit">
</form>

我想做下一件事：

当我按表单2中的提交时，使用form1创建JSON，将其放入“placeforJSON”输入名称并将form2发送到某个URL

我能够正确发送此请求，但是，我正在努力将JSON设置为输入字段。

这是javascript代码（请注意，我的初学者和此代码来自互联网）：

这是将JSON字符串化的函数：

  $.fn.serializeObject = function() {
   var o = {};
   var a = this.serializeArray();
   $.each(a, function() {
    if (o[this.name] !== undefined) {
        if (!o[this.name].push) {
            o[this.name] = [o[this.name]];
        }
        o[this.name].push(this.value || '');
    } else {
        o[this.name] = this.value || '';
    }
    });
    return JSON.stringify(o);
  };

这是在单击提交时设置“placeforJSON”输入的函数：

$(function() {
   $('#form2').submit(function() {
      $('#json').value = $('#form1').serializeObject();
      return false;
   });
});

我希望这会在发送form2之前添加json字符串，但事实并非如此。

我也试图放document.getElementById('json').value = $('#form1').serializeObject();，但也没有帮助。

有趣的是，例如：

<script type="text/javascript">
     function product(a,b) {
       return a*b;
     }
    document.getElementById('json').value = product(5,3);
 </script>

这传递了，并且在请求中有一个对象placeforJSON = 15。

有人可以帮我吗？提前谢谢。

Answer 1

将$('#json').value = $('#form1').serializeObject();更改为$('#json').val( $('#form1').serializeObject());应解决此问题。请运行附加的Fiddle并检查浏览器控制台。

Answer 2

这就解决了这个问题：

HTML CODE：

<form id="form1" oninput="inputFunction()>
<input type="text" name="firstname"/>
<input type="text" name="lastname"/>
</form>

<form id="form2" method="POST" action="http://some.url.com">
<input type="hidden" name="school" value="Random school"/>
<input type="hidden" name="year" value = "Random year"/>
<input type="hidden" name="placeforJSON" id="json">
<input type="submit">
</form>

JAVASCRIPT代码：

function toJSONString(form) {
    var obj = {};
    var elements = form.querySelectorAll( "input, select, textarea" );
    for( var i = 0; i < elements.length; ++i ) {
        var element = elements[i];
        var name = element.name;
        var value = element.value;

        if( name ) {
            obj[ name ] = value;
        }
    }
    return JSON.stringify(obj);
}

function inputFunction() {
  var form = document.getElementById("form1");
  var json = toJSONString(form);
  document.getElementById('json').value = json;
}

在每次输入更改时，我创建JSON字符串并将该值设置为json input。

将表单中的JSON添加到另一个表单的隐藏输入并提交

2 个答案: