是否可以嵌套像这样的html表单
<form name="mainForm">
<form name="subForm">
</form>
</form>
Run Code Online (Sandbox Code Playgroud)
这两种形式都有效吗?我的朋友遇到了这个问题,这是subForm作品的一部分,而另一部分却没有.
是否有效的html具有以下内容:
<form action="a">
<input.../>
<form action="b">
<input.../>
<input.../>
<input.../>
</form>
<input.../>
</form>
Run Code Online (Sandbox Code Playgroud)
因此,当您提交"b"时,您只能获得内部表单中的字段.当您提交"a"时,您将获得所有字段减去"b"中的字段.
如果不可能,这种情况有哪些变通方法?
我将一些代码放在一起,以展平和展开复杂/嵌套的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}
Run Code Online (Sandbox Code Playgroud)
我创建了一个基准,可以模拟我的用例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 …Run Code Online (Sandbox Code Playgroud) 我正在构建一个分面搜索系统,它在侧边栏中有输入(方面是复选框),以及页面标题中的输入(主查询框).当用户提交搜索时,所有这些输入都会同时提交.
我能想到的唯一方法就是将整个页面包装在HTML表单标签中.像下面的伪html:
<form>
<div id='header'>
<logo/>
<input id='q'/>
<!-- a bunch more stuff -->
</div>
<div id='sidebar'>
<div id='sidebar-facets-subsection'>
<input id='facet1'/>
<input id='facet2'/>
<input id='facet3'/>
<!-- a bunch more stuff -->
</div>
<div id='sidebar-form-subsection'>
<form id='unrelated-form'>
<input id='unrelated-input-1'/>
<input id='unrelated-input-2'/>
</form>
</div>
</div>
<!-- a bunch more stuff -->
</form>
Run Code Online (Sandbox Code Playgroud)
除了三件事之外,这会有效:
是否有更聪明的方法来做这个我不知道,或者创建巨大的HTML表单是常态?在这种情况下,使用Javascript以更正常的形式生成输入条目是否更好?或者这是唯一的选择吗?
任何创意解决方案或想法?
我可以<form>在另一个<form>标签内放置标签吗?
例如:
<form>
<form>
</form>
</form>
Run Code Online (Sandbox Code Playgroud) 我在一个动作的JSON响应中返回一些简单的HTML标记.
以下是完整响应(为了便于阅读而添加了换行符):
{
"Success":true,
"Content":"\r\n
<div class=\"editor-form\">\r\n
<form action=\"/Blah/Blah/5104?id=9\" method=\"post\">
<input data-val=\"true\" data-val-number=\"The field Id must be a number.\" data-val-required=\"The Id field is required.\" id=\"Id\" name=\"Id\" type=\"hidden\" value=\"5104\" />
<input data-val=\"true\" data-val-number=\"The field Vat Rate must be a number.\" data-val-required=\"The Vat Rate field is required.\" id=\"VatRate\" name=\"VatRate\" type=\"hidden\" value=\"1.2000\" />
<div class=\"display-field\">\r\n\t
<label for=\"Price\">Price (Ex-VAT)</label>\r\n\t
<input class=\"text-box single-line\" data-val=\"true\" data-val-number=\"The field Price must be a number.\" data-val-required=\"The Price field is required.\" id=\"Price\" name=\"Price\" type=\"text\" value=\"92.50\" />\r\n\t
</div>\r\n
</form>
</div>",
"Data":null, …Run Code Online (Sandbox Code Playgroud) 为什么 WHATWG 不允许 HTML 4 和 HTML5 中的嵌套表单?
编辑:问题最初在如何克服 html 表单嵌套限制?
简而言之,作者说: 您正在制作一个博客应用程序,并且您有一个表单,其中包含一些用于创建新帖子的字段和一个带有“操作”的工具栏,例如“保存”、“删除”、“取消”……唯一的问题是按“删除”将提交服务器上的所有表单字段,即使此操作唯一需要的是带有 post-id 的隐藏输入。
因此,这是一个关于表单中多个按钮的优雅解决方案(没有 JavaScript)的问题,用于提交不同的输入字段集(例如多个表单可能允许)并将UI 从用户角度排列为单个实体(“表单”) .
来自该讨论的评论:几乎不可能将元素的屏幕位置与其在文档中的位置完全分开。
编辑:我发现有趣的笔记http://anderwald.info/internet/nesting-form-tags-in-xhtml/ - (X)HTML 不允许嵌套表单,如“表单 > 表单”,但允许“表单 > 字段集 > 表单” ”,W3 验证器说它是有效的,但是浏览器存在这种嵌套的错误。
如果不使用 JavaScript,设计和处理用户可以添加任意数量的新输入字段的表单是非常乏味的。
目前我正在执行以下操作:在表单中使用两个不同的提交按钮,一个用于添加新的输入字段,一个用于提交导致数据库请求的表单。
使用的方法是POST
为了添加新的输入字段,我想使用GET,但由于不可能在一种表单中使用两种方法,因此我必须在 POST 请求中执行此操作。
对一种类型的输入字段进行此操作相当容易,但是当您需要对子表单(同一表单中的某些输入字段组)执行此操作时,这不仅变得乏味,而且容易出错!
我不满意,有没有一种更智能的方法来实现这一点,而无需开始编写大量处理代码并进行重定向或者至少简化实现以降低错误风险!
另外,也许Java提供了一个解决方案来解决这个一般优雅的问题,因为我使用的是Java Servlets。
打开 JavaScript 后,我会提供一个单独的解决方案,我只关心后备解决方案,这不是正常情况。
我在应用程序中使用Webflow 2.3.2,用户可以在一步中添加/删除绑定模型对象中的列表(它们只是在修改后返回到当前步骤).例如,我的对象可能如下所示:
public class MyInfo implements Serializable {
List<String> myList = new ArrayList<String>();
}
Run Code Online (Sandbox Code Playgroud)
在webflow中执行"添加"没有问题,因为我只是将新对象粘贴在列表的末尾,但对于"删除",我需要识别要删除的元素.我现在正在做的是使用"currentEvent"预定义的EL对象并获取原始事件"value",我已使用要删除的记录的ID填充该值.我想知道是否有更优雅的方式来做到这一点,因为这似乎走了很长的路. 谁能建议更好的方法呢? 这是我现在正在做的事情的例证:
我的JSP文件(注意"删除"按钮):
<c:forEach items="${myInfo.myList}" var="listItem" varStatus="listItemStatus">
<c:set var="v" value="${listItemStatus.index}"/>
<div><form:input id="listItemValue_${v}" path="myInfo.myList[${v}]"/></div>
<div><button id="deleteItem_${v}" name="_eventId_deleteItem" type="submit" value="${v}">Delete This Item</button></div>
</c:forEach>
Run Code Online (Sandbox Code Playgroud)
我的"flow.xml"文件:
<transition on="deleteItem" bind="false" validate="false">
<evaluate expression="flowService.deleteItem(flowScope.myInfo, currentEvent.attributes)" result="flowScope.myInfo" />
</transition>
Run Code Online (Sandbox Code Playgroud)
我的事件处理程序
public MyInfo deleteAccount(MyInfo myInfo, LocalAttributeMap currentEvent) {
myInfo.getMyList().remove(Integer.valueOf((String)(currentEvent.asMap().get("_eventId_deleteItem"))).intValue());
return myInfo;
}
Run Code Online (Sandbox Code Playgroud) 我通过ajax调用html()加载局部视图.我可以在chrome javascript debug中看到response有<form>标签.但当它加载到源时,它正在消失.除了标签之外我还可以使用html.
我正在另一个标签下加载.我不知道这里有什么问题?
var HandleGetEditPhone = function (response) {
if (response !== "") {
$('#DivPhoneContainer').html(response);
}
Run Code Online (Sandbox Code Playgroud)
}
html ×7
forms ×3
asp.net-mvc ×2
javascript ×2
jquery ×2
ajax ×1
algorithm ×1
django ×1
java ×1
nested-forms ×1
servlets ×1
spring ×1
webforms ×1