是否有效的html具有以下内容:
<form action="a">
    <input.../>
    <form action="b">
        <input.../>
        <input.../>
        <input.../>
    </form>
    <input.../>
</form>
因此,当您提交"b"时,您只能获得内部表单中的字段.当您提交"a"时,您将获得所有字段减去"b"中的字段.
如果不可能,这种情况有哪些变通方法?
我知道xhtml不支持嵌套的表单标签,我已经
在stackoverflow中读到了关于这个主题的其他答案,但我仍然没有想出一个优雅的问题解决方案.  
有人说你不需要它,他们想不到这种情况是需要的.好吧,我个人无法想到一个我不需要它的场景.
让我们看一个非常简单的例子:
您正在创建一个博客应用程序,并且您有一个表单,其中包含一些字段,用于创建新帖子和工具栏,其中包含"保存","删除","取消"等"操作".
<form
 action="/post/dispatch/too_bad_the_action_url_is_in_the_form_tag_even_though_conceptually_every_submit_button_inside_it_may_need_to_post_to_a_diffent_distinct_url"
method="post">
    <input type="text" name="foo" /> <!-- several of those here -->
    <div id="toolbar">
        <input type="submit" name="save" value="Save" />
        <input type="submit" name="delete" value="Delete" />
        <a href="/home/index">Cancel</a>
    </div>
</form>
我们的目标是以不需要javascript的方式编写表单,只需要简单的旧HTML表单和提交按钮.
由于动作URL是在Form标签中定义的,而不是在每个单独的提交按钮中定义,我们唯一的选择是发布到通用URL,然后启动"if ... then ... else"来确定按钮的名称提交.不是很优雅,但我们唯一的选择,因为我们不想依赖javascript.
唯一的问题是,按"删除",将提交服务器上的所有表单字段,即使此操作所需的唯一内容是带有post-id的隐藏输入.在这个小例子中并没有什么大不了的,但我的表格中有数百个(可以这么说)我的LOB应用程序中的字段和标签(由于要求)必须一次性提交所有内容,无论如何这看起来效率很低而浪费.如果支持表单嵌套,我至少可以在其自己的表单中包含"删除"提交按钮,只包含post-id字段.
您可以说"只需实施"删除"作为链接而不是提交".这在许多层面都是错误的,但最重要的是因为像这里的"删除"这样的副作用动作永远不应该是GET请求.
所以我的问题(特别是那些说他们不需要形成嵌套的人)是你做什么的?是否有任何优雅的解决方案,我缺少或底线真的"要么需要javascript或提交一切"?
我有一个使用ng-repeat创建的表.我想为表中的每个元素添加验证.问题是每个输入单元格与其上方和下方的单元格具有相同的名称.我试图使用该{{$index}}值来命名输入,但尽管HTML中的字符串文字显示正确,但它现在正在工作.
这是我现在的代码:
<tr ng-repeat="r in model.BSM ">
   <td>
      <input ng-model="r.QTY" class="span1" name="QTY{{$index}}" ng-pattern="/^[\d]*\.?[\d]*$/" required/>
      <span class="alert-error" ng-show="form.QTY{{$index}}.$error.pattern"><strong>Requires a number.</strong></span>
      <span class="alert-error" ng-show="form.QTY{{$index}}.$error.required"><strong>*Required</strong></span>
   </td>
</tr>
我已经尝试删除{{}}from索引,但这也不起作用.截至目前,输入的验证属性工作正常,但不显示错误消息.
有人有什么建议吗?
编辑:除了下面的好答案,这里有一篇博客文章更详细地介绍了这个问题:http://www.thebhwgroup.com/blog/2014/08/angularjs-html-form-design-part-2 /
我将一些代码放在一起,以展平和展开复杂/嵌套的JSON对象.它有效,但它有点慢(触发'长脚本'警告).
对于我想要的扁平名称"." 作为数组的分隔符和[INDEX].
例子:
un-flattened | flattened
---------------------------
{foo:{bar:false}} => {"foo.bar":false}
{a:[{b:["c","d"]}]} => {"a[0].b[0]":"c","a[0].b[1]":"d"}
[1,[2,[3,4],5],6] => {"[0]":1,"[1].[0]":2,"[1].[1].[0]":3,"[1].[1].[1]":4,"[1].[2]":5,"[2]":6}
我创建了一个基准,可以模拟我的用例http://jsfiddle.net/WSzec/
我想要更快的代码:为了澄清,在IE 9 +,FF 24+和Chrome 29 中完成JSFiddle基准测试(http://jsfiddle.net/WSzec/)的代码明显更快(~20%+会很好) +.
以下是相关的JavaScript代码:当前最快:http://jsfiddle.net/WSzec/6/
JSON.unflatten = function(data) {
    "use strict";
    if (Object(data) !== data || Array.isArray(data))
        return data;
    var result = {}, cur, prop, idx, last, temp;
    for(var p in data) {
        cur = result, prop = "", last = 0;
        do {
            idx = p.indexOf(".", last);
            temp …我希望将HTML表单嵌入另一种形式,如下所示:
<form id="form1">
  <input name="val1"/>
  <form id="form2">
    <input name="val2"/>
    <input type="button" name="Submit Form 2 ONLY">
  </form>
<input type="button" name="Submit Form 1 data including form 2">
</form>
我需要提交form1的全部内容,但是当我提交form2时,我只想在form2中提交数据(不是form1中的所有内容.)这会有用吗?
我可以<form>在另一个<form>标签内放置标签吗?
例如:
<form>
  <form>
  </form>
</form>
我正在尝试 Microsoft 的待办事项列表示例:https ://docs.microsoft.com/en-us/aspnet/core/tutorials/build-a-blazor-app?view=aspnetcore- 3.1
我想添加一个待办事项,而不是用鼠标点击按下按钮,我想按下回车键。我对在这个解决方案中使用 JS 不满意:How to set the focus to an InputText element? 我尝试通过这行代码触发方法 private void Enter(KeyboardEventArgs e):
<button @onclick="AddTodo" @onkeypress="@(e=>Enter(e)" tabindex="0"  >Add todo</button>
它没有用。
enter code here
<input placeholder="Something todo" @bind="newTodo" />
<button @onclick="AddTodo" @onkeypress="Enter" tabindex="0"  >Add todo</button>
@code {
    private IList<TodoItem> todos = new List<TodoItem>();
    private string newTodo;
    private void AddTodo()
    {
        if (!string.IsNullOrWhiteSpace(newTodo))
        {
            todos.Add(new TodoItem { Title = newTodo });
            newTodo = string.Empty;
        }
    }
    //private void Enter(KeyboardEventArgs e)
        private void …我想在表单中发送一个表单,但是当我提交表单内部的表单时,所有表单都会立即提交.甚至可以这样做吗?
<form name="add_foobar_form" novalidate ng-submit="addFoobar(foobar)">
    <form name="send_contact_form" novalidate ng-submit="sendContact(hello)">
        <input type="text" ng-model="hello.bye">
        <input type="submit" value="sendmall">
    </form>
    <input type="text" ng-model="foobar.go">
    <input type="submit" value="sendall">
</form>
我很好奇WebComponents的工作是否有可能在不违反规则的情况下逃脱嵌套HTML表单之类的事情.我问,因为我很好奇WebComponent的内部与包含它们的祖先元素有多孤立.我可以想象,如果使用WebComponents无法嵌套表单,那么由于消费者不了解组件内部的问题,可能会导致建议转向组件远离包含表单.
无论哪种方式,我都进行了一些挖掘并且无法进行任何操作,所以我想我会在这里咨询专家以获得更多见解.
相关文章:
html ×6
forms ×5
angularjs ×2
html5 ×2
algorithm ×1
blazor ×1
grid ×1
javascript ×1
nested ×1
validation ×1