Question

如何在div MVC中使用动态添加的texbox提交表单。您好，

我想提交一个表格，其中包含一个文本框（全名），年龄，（电话号码，电话型号）用户可以添加n号。电话号码，phonetype例如。

Name -michale
age-  27
Phone:989878767 phonetype - mobile
Phone 022787656 phonetype-  office

我想提交此表单以保存数据库中的数据。但是在formcollection手机中，phonetype正在作为单独的阵列出现。因此无法找到哪个电话号码。是移动或办公室。

Answer 1

一种肮脏的方式：使用与数字连接的名称：

<body> <div id="listPhones">
    <div>
        <input type="text" name="phone00"/><input type="text" name="phonetype00"/>
    </div> 
 </div> 
 <bouton onclick="addPhone()">More</bouton>

 <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-2.2.3.min.js">    </script> 
<script type="text/javascript"> 
function addPhone() {
            var nbr_phone = $("#listPhones").children().length;
            $("#listPhones").append("<div><input type='text' name='phone" + nbr_phone + "'/><input type='text' name='phonetype"+ nbr_phone + "'/></div>"); }      </script> 
</body>

Answer 2

您如何构建您提交的有效负载？

你可以POST JSON - 例如

{"name":"foo", "age":"123", "phone":[{"type":"mobile", "no":"12345"}, {"type":"home", "no":"345678"}]}

如果你正在构建<input />，那么就像这样：

   <ul>
    <li>Name: <input type="text" name="name" /></li>
    <li>Age: <input type="text" name="age" /></li>

    <li>Phone type: 
      <input type="radio" name="phone[0][type]" value="mobile" /> Mobile
      <input type="radio" name="phone[0][type]" value="home" /> Home
    </li>
    <li>Phone: <input type="text" name="phone[0][no]" /></li>

    <li>Phone type: 
      <input type="radio" name="phone[1][type]" value="mobile" /> Mobile
      <input type="radio" name="phone[1][type]" value="home" /> Home
    </li>
    <li>Phone: <input type="text" name="phone[1][no]" /></li>

  </ul>
  <input type="submit" value="go" />

H个。

如何在div MVC中提交带有动态添加文本框的表单。

2 个答案: