Javascript 为什么在我点击不相关按钮时显示“请填写此字段”验证消息

Javascript 为什么在我点击不相关按钮时显示“请填写此字段”验证消息,javascript,jquery,validation,required,Javascript,Jquery,Validation,Required,我在我的页面上使用了地图,当我点击“cellSize”按钮填充字段时,出现了警告。我不想这样。如何解决这个问题 警告如下: 这是我的文本字段: <div class="form-group"> <label for="name">Name</label> <input ng-model="Name" ng-readonly="view.readonly" ng-maxlength="100" type="text" class="

我在我的页面上使用了地图,当我点击“cellSize”按钮填充字段时,出现了警告。我不想这样。如何解决这个问题

警告如下:

这是我的文本字段:

<div class="form-group">
    <label for="name">Name</label>
        <input ng-model="Name" ng-readonly="view.readonly" ng-maxlength="100" type="text" class="form-control input-sm" id="cluster-name" placeholder="Name" required>
</div>
如果必填字段不是必填字段,请从此HTML中删除必填属性,否则浏览器将在表单提交时显示此消息。确保在单击“单元格大小”按钮时未提交表单

<input ng-model="Name" ng-readonly="view.readonly" ng-maxlength="100" type="text" class="form-control input-sm" id="cluster-name" placeholder="Name" required>
添加带有表单标签的novalidate作为必需属性,以便触发HTML5验证

<form novalidate>
<div class="form-group"> <label for="name">Name</label> <input ng-model="Name" ng-readonly="view.readonly" ng-maxlength="100" type="text" class="form-control input-sm" id="cluster-name" placeholder="Name" required> </div>
</form>

由于输入元素上的required属性,您将看到该消息。当单击“增量”按钮时,表单提交时会显示

要停止该行为,请向按钮添加type=button属性:


仅供参考,您应该在不希望在单击表单时提交表单的任何按钮元素上添加type=button属性。

您看到的消息是由于输入元素上的必需属性。它在表单提交时显示,所以我猜您需要在“增量按钮”上添加type=按钮。我使用了剑道按钮,我的按钮代码如下:。任何关于@rorymcrossanyeah的想法,您都需要添加type=按钮来解决问题。我添加它是为了回答您在输入上有一个必需的属性是一件非常正常的事情。需要解决的问题是,为什么单击“增量”按钮时会出现?我想他希望保留必填字段,但删除消息时,我可能没有understand@RoryMcCrossan正如我所说,可能有一个表单正在提交,所以他需要把它做成一个按钮,而不是如果你来发短信,我想看到此消息,但如果单击“增量”按钮,我不想看到此消息。如果我加上“novalidate”,我永远看不到警告信息。我用剑道做扣子。我的按钮代码如下:@Niladri@Minirock@rorymcrossani如果你来发短信,我想看到这条消息,但如果我点击递增按钮,我不想看到这条消息。如果我加上“novalidate”,我永远看不到警告信息@HaRdikKajiThank非常感谢你@Rorymcrossan。顺便说一句,我是个女孩,不是他,她:很乐意帮忙。如果我暗示你是某个地方的男人,我道歉!
<form novalidate>
<div class="form-group"> <label for="name">Name</label> <input ng-model="Name" ng-readonly="view.readonly" ng-maxlength="100" type="text" class="form-control input-sm" id="cluster-name" placeholder="Name" required> </div>
</form>
<button type="button" style="margin-left:2px;" kendo-button="btnCellSizeIncrement" k-options="btnCellSizeIncrementOptions">
  <i class="fa fa-plus pi-icon pi-icon-plus"></i>
</button>