Question

他们称之为DYNAMIC FORMs吗？
HTML

<div id="myForm">
  <form method="post">
    <input type="text" name="question1" placeholder="Question 1"/>
    <input type="text" name="item1" placeholder="Item 1"/>

    <a href="#" onclick="addItem();">Add more items</a>
    <a href="#" onclick="addQuestion();">Add new question</a>
  </form>
</div>

<script> 
   function addQuestion() {
      // codes to add more input type=text like:
      $('#myForm').append('<input type="text" name="item2"/>');
   }
   function addItem() {
      // codes to add more input type=text like:
      $('#myForm').append('<input type="text" name="item2"/>');
   }
</script>

作为一名学生，考虑这些东西对我来说真的很复杂。
我的问题是，我对如何在表单上传递多个项目或数据一无所知。甚至可以放在name的{{1}}属性上。此外，如果用户添加更多项目！我怎么能传递这些意外数量的数据。
例如，当用户想要添加更多项目或选项时。
或者我应该实现这些逻辑：

<input>

我要做的就是知道如何传递多种形式。但是，如果我这样做，<form>...</form> <a href="#" onclick="addForm();">Add a question</a> <script>//codes to add new form</script>（mvc中的Struts2）是否会识别传递的数据？

请帮助，这对我这样的学生来说太复杂了。

EDITED：要传递的数据就像一个多维数组。例如：

request.getParameter()

换句话说，在表单中，用户可以添加更多问题，并且在每个问题中用户都可以添加更多项目。

主要功能是用户可以创建[question1, [item1, item2, item3]], [question2, [item1, item2, item3, item4]] [question3, [item1, item2]]测验。所以在每个问题中，都会有任意数量的项目。 multiple-choice。

Answer 1

您可以将请求变量映射到struts2中的bean列表。假设您已定义参数拦截器或正在使用defaultStack。

1）定义包含

的bean

String question;
List<String> items;

2）将此bean公开为动作类

中的列表

List<MyBean> questions;

3）在你的jsp中发送这样的请求参数。

<input type="text" name="questions[0].question" placeholder="Question 1"/>
<input type="text" name="questions[0].items[0]" placeholder="Item 1"/>
<input type="text" name="questions[0].items[1]" placeholder="Item 2"/>
<script> 
   var qcounter = 1;
   var icounter = 2;
   function addQuestion() {
      // codes to add more input type=text like:
      $('#myForm').append('<input type="text" name="questions[' + qcounter + '].question" placeholder="Question ' + (++qcounter) + '"/>');

      icounter = 0;

   }
   function addItem() {
      // codes to add more input type=text like:
      $('#myForm').append('<input type="text" name="questions[' + (qcounter - 1) + '].items[' + icounter + ']" placeholder="Item ' + (++icounter) + '"/>');
   }
</script>

您必须考虑点击添加问题按钮时的操作，在我的示例中，我假设您要重置新问题的项目计数。

这是关于struts2中表格形式输入的类似问题。 POST an array of custom objects to a Struts 2 action 希望这会给你一个想法。

Answer 2

我为此做了一些事情，下面的示例代码..在struts 2.x

中

<强> addRow.jsp

<div id="myForm">
  <form method="post" action='submitForm.action'>
    <input type="text" name="questions" placeholder="Question 1"/>
    <input type="text" name="items" placeholder="Item 1"/>

    <a href="#" onclick="addItem();">Add more items</a>
    <a href="#" onclick="addQuestion();">Add new question</a>
 <input type="submit" value="submit" /> 
 </form>
</div>

<script> 
   function addQuestion() {
      // codes to add more input type=text like:
      $('#myForm').append('<input type="text" name="questions"/>');
   }
   function addItem() {
      // codes to add more input type=text like:
      $('#myForm').append('<input type="text" name="items"/>');
   }
</script>

<强> AddRowAction.java

package action;    
import com.opensymphony.xwork2.ActionSupport;
    /**
     *
     * @author Prabhakar
     */
    public class AddRowAction extends ActionSupport{

    private String[] items;
    private String[] questions;

       public String[] getItems() {
            return items;
        }

        public void setItems(String[] items) {
            this.items = items;
        }

        public String[] getQuestion() {
            return question;
        }

        public void setQuestion(String[] question) {
            this.question = question;
        }


    public String getFormData()
    {

    for(String question : questions)

    System.out.println("The question in the index "+i+" is "+question)

    }
    for(String item : items)

    System.out.println("The Item in the index "+i+" is "+item)

    }
    return SUCCESS;
    }

<强> struts.xml中

<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">

<!-- Author: Prabhakar -->
 <struts>

<package name="action.AddRowAction" extends="struts-default">

<action name="submitForm" class="action.AddRowAction"
        method="getFormData" >
    <result name="success">/addRow.jsp</result>
    </action>  
  </package>
</struts>

DYNAMIC FORM：如何将数据作为多维数组传递（Struts 2）

2 个答案: