名称=''的无效表单控件不可聚焦。没有任何所需或隐藏的输入 [英] An invalid form control with name='' is not focusable. WITHOUT ANY REQUIRED OR HIDDEN INPUTS

问题描述

我面对着名的Chrome的不可调焦输入错误，但是我的情况与我在其中找到的其他文章中的解释不同。

我有这个错误消息首先被重复输入，它没有必要的属性：
代码：

 < fieldset> 
< label> Total（montaje incl。）< / label> 
< input type =numberid =priceFinalname =priceFinal> €b $ b< / fieldset> 
  

错误：
名称='priceFinal'的无效表单控件是不可聚焦。

在用户填写表单时，此字段通过jquery脚本使用jquery获取其值。用户在另一个输入中键入大小，脚本用大小值来计算数值，然后用jquery函数将结果放在'priceFinal'输入中：.val（）

在浏览器中，我们可以看到输入已正确填充，并且当时没有错误显示。我认为使用'novalidate'解决方案一切都很顺利，所以它不能为可聚焦错误负责。然后，我得到了与输入相同的错误没有名字，我没有写，并且不存在于我的DOM中：

名称=''的无效表单控件不可聚焦。 / em>

这很奇怪，因为在我的表单中没有名字的唯一输入是类型：submit one

 < input type =submitclass =btn btn-defaultvalue =Ver presupuesto/> 
  

我有几个必填字段，但我总是检查它们是否全部填满形成。我粘贴它，以防万一它有帮助：

 < fieldset> 
< input type =textid =clientNamename =clientNameplaceholder =Nombre y apellidosclass =cInputrequired> 
< input type =textid =client_IDname =client_IDrequired placeholder =CIF / NIF / DNIclass =cInput> 
< / fieldset> 
< fieldset> 
< input type =textid =client_addname =client_addplaceholder =Direccióndefacturaciónclass =addInputrequired> 
< / fieldset> 
 
< fieldset> 
< input type =textid =client_phname =client_phplaceholder =Teléfonoclass =cInputrequired> 
< input type =emailid =client_mailname =client_mailplaceholder =Emailclass =cInputrequired> 
< / fieldset> 
  

novalidate解决方案会清除错误，但它不能解决问题，我的意思是必须有一种方法解决它没有黑客。

任何人都知道可能会发生什么？
谢谢

解决方案

我有同样的问题，每个人都责怪可怜的隐藏输入是必需的，但似乎就像在字段集中有一个需要字段的错误。
Chrome尝试着重（不知道为什么）您的字段集，而不是您所需的输入。

这个错误只出现在我在43.0版中测试过的chrome中。 2357.124米。
在firefox中不会发生。

示例（非常简单）。

 <形式> < fieldset name =mybug> < select required =requiredname =hola> < option value =''> option 1< / option> < /选择> < input type =submitname =submitvalue =send/> < / fieldset>< / form>  

使用 name ='mybug'控制是不可聚焦的。

这个错误很难被发现， t有一个名字，所以 name =''是一个WTF！但一片一片地切片形式，直到我找到了culprid。
如果从字段集中获得所需的输入，则错误消失。

< form> < select required =requiredname =hola> < option value =''> option 1< / option> < /选择> < fieldset name =mybug> < input type =submitname =submitvalue =send/> < / fieldset>< / form>

但是我不知道chrome社区的错误在哪里。

I'm facing the well known Chrome's "not-focusable-input" error but my situation is different from the explained in the other post I could find there.

I have this error message duplicated first on a well pointed input, this input has no required attribute: The code:

<fieldset>
    <label>Total (montaje incl.)</label>
    <input type="number" id="priceFinal" name="priceFinal"> €
</fieldset>

The error: An invalid form control with name='priceFinal' is not focusable.

While the user is filling the form this field gets its value by a js script with jquery. The user type a size in another input, the script do its maths with the size value and then put the outcome in the 'priceFinal' input with the jquery function: .val()

In the browser we can see that the input is correctly filled and no errors are displayed at that time. And with the 'novalidate' solution everything goes fine, so it couldn't be responsible for the nofocusable error, I think.

Then I got the same error with an input with no name which I didn't write and doesn't exist in my DOM:

An invalid form control with name='' is not focusable.

This is weird because the only input without name in my form is the type:submit one

<input type="submit" class="btn btn-default" value="Ver presupuesto" />

I have a few required fields but I've always checked that their are all filled when I send the form. I paste it just in case it could help:

<fieldset>
    <input type="text" id="clientName" name="clientName" placeholder="Nombre y apellidos"  class="cInput" required >
    <input type="text" id="client_ID" name="client_ID" required placeholder="CIF / NIF / DNI" class="cInput">
</fieldset>
<fieldset>
    <input type="text" id="client_add" name="client_add" placeholder="Dirección de facturación" class="addInput" required >
</fieldset>

<fieldset>
    <input type="text" id="client_ph" name="client_ph" placeholder="Teléfono" class="cInput" required>
    <input type="email" id="client_mail" name="client_mail" placeholder="Email" class="cInput" required> 
</fieldset>

The novalidate solution clears the error but it doesn't fix it, I mean there must be a way to solve it with no hacks.

Any one have any idea of what's might going on? Thanks

解决方案

I had the same problem, and everyone was blaming to the poor hidden inputs been required, but seems like a bug having your required field inside a fieldset. Chrome tries to focus (for some unknown reason) your fieldset instead of your required input.

This bug is present only in chrome I tested in version 43.0.2357.124 m. Doesn't happen in firefox.

Example (very simple).

<form>
  <fieldset name="mybug">
    <select required="required" name="hola">
      <option value=''>option 1</option>
     </select>
    <input type="submit" name="submit" value="send" />
  </fieldset>
</form>

An invalid form control with name='mybug' is not focusable.

The bug is hard to spot because usually fieldsets don't have a name so name='' is a WTF! but slice piece by piece the form until I found the culprid. If you get your required input from the fieldset the error is gone.

<form>
    <select required="required" name="hola">
      <option value=''>option 1</option>
     </select>

  <fieldset name="mybug">
    <input type="submit" name="submit" value="send" />
  </fieldset>
</form>

I would report it but I don't know where is the chrome community for bugs.

这篇关于名称=''的无效表单控件不可聚焦。没有任何所需或隐藏的输入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！