SCENARIO
我有一个带有长格式的java
JSP视图。这很好用。我可以通过在任何输入字段中输入或使用提交按钮提交我的表单。
新要求
在一个部分中,我必须添加按钮来替换<label>
的某些<input>
以允许编辑,没有什么难的。
我做了什么
这部分视图是以dinamically方式创建的,因为行数取决于用户引入的数据,这部分创建了每一行:
resultadoHTML += " <div class='row col-lg-12 col-xs-12' style='margin-bottom: 30px;text-align: left;'>";
resultadoHTML += " <label class='col-lg-3 col-xs-12 control-label' >" + nomCalidad + "</label>";
resultadoHTML += " <div class='col-lg-5 col-xs-8'>";
resultadoHTML += " <input type='text' class='form-control' value='"+valor+"' id='calidadCatId' maxlength='30' required='true' />";
resultadoHTML += " </div>";
resultadoHTML += " <div class='col-lg-2 col-xs-3' id='ccc" + parts[1] + "'>";
resultadoHTML += " <label class='control-label' id='unidadCCC" + parts[1] + "' >" + parts[4] + "</label>";
resultadoHTML += " </div>";
resultadoHTML += " <div class='col-lg-2 col-xs-1'>";
resultadoHTML += " <button id='eCCC" + parts[1] + "' class='btn btn-default'><span class='glyphicon glyphicon-plus-sign'></span></button>";
resultadoHTML += " </div>";
resultadoHTML += " </div>";
按钮的结果HTML
<button id="eCCC5" class="btn btn-default"><span class="glyphicon glyphicon-plus-sign"></span></button>
问题
当我使用onclick
在新按钮中定义一个函数时,会调用此函数,但之后,提交按钮的click
事件被 ALSO 调用,我不知道为什么......但正如您在代码中看到的那样,即使我不捕获按钮中的任何事件,也会调用表单的click
事件。
其他信息
FORM / BUTTON DEFINITION
<form:form class="form-horizontal" role="form" method="post"
commandName="contratMercan" action="../contratos/contratosubmit"
name="formulario" id="edicionContrato">
<button type="submit" class="btn btn-primary" id="edicionContrato">
<spring:message ... /> // omitted info
</button>
提交功能
$("#edicionContrato").submit(function(e){
e.preventDefault();
var form = this;
// checks and workarounds...
form.submit();
});
知道为什么会发生?也许dinamically介绍HTML
代码有一些错误,并在javascript
或html
之后?
答案 0 :(得分:16)
如果在未指定类型的情况下使用<button>
元素,则为defaults to type="submit"
。您需要将其指定为type="button"
才能停止提交表单:
<button type="button" id="eCCC5" class="btn btn-default">
<span class="glyphicon glyphicon-plus-sign"></span>
</button>
答案 1 :(得分:1)
如果您有属性type="submit"
的按钮,点击提交将发送整个表单。我想如果您添加属性type="button"
或只是删除它。如果您单击按钮或按ENTER
输入,表单可能不会发送。
答案 2 :(得分:0)
另一种选择是将按钮元素放置在FORM之外会有所帮助,但这取决于您的要求。如果您需要将该按钮放在FORM内,则必须提及type =“ button”