标签: html-validation

如何在单个表中处理多个<form>并进行HTML验证

问题 - 似乎我不能将两个表单嵌入到单个表中并使我的HTML验证.例如,W3 Validator告诉我,Element <form> not allowed as child of element <tr> in this context. 我没有办法绕过验证错误.

我想要实现的是:

  • 在一个html表"行"我有,可以更改一些输入值,然后在行的末尾使用我的"保存"按钮,以保存它们
  • 如果我必须删除一行,我可以按删除按钮.
  • 在UI方面,我有两个表单,每行一个用于保存/删除按钮,这对我来说是有意义的.
  • 我可以有几行,每行都有自己的Save/Delete按钮

示例UI

数字是输入字段,保存/删除是按钮. 在此输入图像描述

我在下面简化了不符合要求的HTML:

<!DOCTYPE html>
<html>
<head>
<title>HTML</title>
</head>
<body>
<table>

<tr>
    <form>
    <td><input type="text" name="row_id" value="1"></td>
    <td><input type="text" name="five" value="5"></td>
    <td><input type="text" name="three" value="3"></td>
    <td><input type="submit" value="Save This Row"></td>
    </form>

    <td><form>
            <input type="text" name="row_id" value="1">
            <input type="submit" value="Delete This Row">
    </form></td>
</tr>
</table>

</body>
</html>
Run Code Online (Sandbox Code Playgroud)

HTML工作令人惊讶,但它没有验证.我正在寻求一个解决方案,它同时做到了 - 工作和验证.

html forms html-table html-validation

8
推荐指数
1
解决办法
9527
查看次数

AngularJS应用程序未通过官方W3C HTML5验证

我有一个项目,我正在使用AngularJS,但其中一个要求是我的应用程序必须通过官方HTML5和CSS3验证.

为什么使用AngularJS构建的应用程序不通过官方W3C HTML5验证?我真的很喜欢AngularJS,所以我该怎么办?我是否真的必须从头开始构建它,或者是否有任何合理的文章/博客解决这个问题所以我可以向我的教授解释一下?

javascript html5 html-validation angularjs

7
推荐指数
1
解决办法
3600
查看次数

你能用HTML textarea的datalist吗?

我想检查是否可以使用带有textarea的datalist.我让它使用输入字段,但我在这里的任务要求我"将输入建议添加到带有datalist的一行文本框".这甚至有意义吗?

            <fieldset>
                <legend>
                    Välj favoritbild med hjälp av datalist - skriv i listan nedan
                </legend>
                <input list="bilar" name="bil">
                <!--<TEXTAREA list="bilar" NAME="bil" ROWS="1"></TEXTAREA>  -->
                <datalist id="bilar">
                    <option value="Dodge Viper">
                    <option value="Honda Civic">
                    <option value="Corvette Z06">
                    <option value="Volvo V70">
                    <option value="Ferrari Spider 360">
                </datalist>                 
            </fieldset>
Run Code Online (Sandbox Code Playgroud)

但是,我无法使用我的textarea(上面已注释掉).但它适用于输入元素.

任何人都知道如何让上面的例子使用单行文本框?

html forms html5 textarea html-validation

7
推荐指数
1
解决办法
3700
查看次数

HTML必需的验证被Angular忽略了吗?

Angular 4忽略了内置的html验证.

如何让Angular考虑输入元素的html必填字段?

期望的行为:

期望的行为

代码:

         <form #loginForm="ngForm" (ngSubmit)="login()" class="m-t" role="form" action="#">
            <div class="form-group">
                <input type="text" [(ngModel)]="username" name="username" class="form-control" 
                [placeholder]="'Nom d\'utilisateur' | translate"  required />
            </div>
            <div class="form-group">
                <input type="password" [(ngModel)]="password" name="password" class="form-control" 
                [placeholder]="'Mot de passe' | translate" required>
            </div>
            <button type="submit" data-spinner-color="white" data-style="zoom-in" 
            [ladda]="isLoading" translate class="btn btn-primary block full-width m-b">
                <span translate >Login</span>
            </button>

            <a [routerLink]="['/reset' , '1']"><small translate>Mot de passe oublié ?</small></a>
            <br><br>
            <p class="text-muted text-center">
                <small translate>vous n'êtes pas encore enregistré ?</small>
            </p>
            <a translate id="register" class="btn btn-sm …
Run Code Online (Sandbox Code Playgroud)

html validation html-validation angular

7
推荐指数
1
解决办法
1326
查看次数

是否真的有必要使用经过验证的Mark Up和css进行搜索引擎优化

http://jigsaw.w3.org/css-validator/上验证我的CSS时

我收到以下错误:

1.不存在属性缩放:1 1.

2.Property -webkit-transition不存在:所有200ms缓入所有200ms缓入

3. CSS级别2.1中不存在属性不透明度

4.Property -moz-border-radius不存在

5.Property -webkit-border-radius不存在

是否真的需要为SEO完全验证MarkUp和CSS,或者这些大多数是浏览器特定的错误现在可以忽略.

如果必须删除这些错误,请有人建议这样做的方法.

css seo css-validator html-validation

6
推荐指数
1
解决办法
2552
查看次数

标签未与输入关联

使用内置的Chrome Lighthouse在WP网站上运行可访问性审核,由于没有关联的标签,因此注册字段无效。我以前曾遇到过这个问题,但我不明白为什么它认为它没有关联。我可以通过直接在aria-label标签上添加标签来使其通过,input但我不必这样做。

这是从Subscribe2创建的代码片段

<label for="s2email">Your email:</label>
<br>
<input type="text" name="email" id="s2email" value="Enter email address..." size="20" onfocus="if (this.value === 'Enter email address...') {this.value = '';}" onblur="if (this.value === '') {this.value = 'Enter email address...';}">
Run Code Online (Sandbox Code Playgroud)

可以在这里找到:https//blog.collaborative.org/

html forms accessibility html-validation lighthouse

6
推荐指数
1
解决办法
2610
查看次数

在应用JavaScript之前,HTML和CSS是否需要有效?

我在考虑Web标准,我想知道在应用JavaScript之前是否需要有效的HTML和CSS?

任何人都可以启发我有效的HTML,CSS和JavaScript之间的关系?

例如,无效的HTML和CSS会阻止JavaScript正常工作吗?

html javascript css html-validation

5
推荐指数
0
解决办法
201
查看次数

如何使jQuery Mobile属性XHTML有效

我不久前开始使用jQuery Mobile,并且知道jQuery Mobile的人知道,它使用它自己的HTML属性为项目提供预定义的角色.主要是div.一些例子:

<div data-role="page" id="trackPage">
    <div data-role="header">
        ...
    </div><!-- /header -->
    <div data-role="content" id="content_init">
        <form action="DoTrack" method="post" id="track_form" data-ajax="false">
            <div data-role="fieldcontain" id="div_trackselect">
                <fieldset data-role="controlgroup" data-type="horizontal">
                    ....
                </fieldset>
            </div>
        </form>
        ...
    </div>
    ...
</div>
Run Code Online (Sandbox Code Playgroud)

如您所见,添加了许多jQuery属性,如data-role data-type data-ajax data-transition data-iconpos...

现在,我更喜欢使用XHTML严格语法,但在验证时我得到了这些错误:http://cl.ly/400Q080G3X2V3j3x2S00

我也尝试了XHTML Transitional,但它也给出了同样的错误.

我尝试谷歌搜索找到解决方案,但不能.我想解决这个问题,所有jQuery Mobile属性都应该存在一个DTD,对吧?

有没有其他方法可以解决这个问题?

xhtml jquery dtd html-validation jquery-mobile

5
推荐指数
1
解决办法
1778
查看次数

将自定义表单控件连接到角度2中的父表单验证

我最近尝试使用角度2创建自己的自定义表单控件.自定义控件应该有2个输入,并编辑具有已知结构的现有对象.例如:

class model {
    public fieldOne: number;
    public fieldSec: number;
}
Run Code Online (Sandbox Code Playgroud)

我遵循了我在这里找到的好解释: 编写自定义表单控件的指南

它工作正常,除了指南没有提到如何将自定义控件表单验证连接到使用它的表单.让我们看一个简化的例子:

自定义控件模板看起来像这样:

<form>
    <input [(ngModel)]="existingModel.fieldOne">
    <input [(ngModel)]="existingModel.fieldSec" required>
</form>
Run Code Online (Sandbox Code Playgroud)

我们用它来编辑现有的模型,其值为:

{
    fieldOne: 20,
    fieldSec: undefined
}
Run Code Online (Sandbox Code Playgroud)

我们在我的应用程序中以某种形式使用它,我们需要自定义控件来编辑此模型:

<form #formVar="ngForm">
    <my-custom-control [(ngModel)]="existingModel" required>
    </my-custom-control>
</form>
Run Code Online (Sandbox Code Playgroud)

在我可以编辑模型的问题上,这种示例适用于我的应用程序.问题是我希望在表单无效时向用户显示,如果我查看formVar.valid,即使existingModel.fieldSec未定义并且在自定义控件表单中对其进行了必需的验证,它也将为true .

html-validation angular2-forms angular2-template angular2-components angular

5
推荐指数
1
解决办法
3359
查看次数

材质Ui-在“选择”模式下将必填属性添加到TextField

我试图在选择模式下使“必需”成为TextField。我尝试required在此代码段中添加prop,但是如果我没有选择任何内容,这不会阻止Submit事件。尽管它在标签上添加了“ *”。

请检查此沙箱

<TextField
  id="select-currency"
  select
  label="Select"
  value={this.state.currency}
  onChange={this.handleChange("currency")}
  required
>
  {currencies.map(option => (
    <MenuItem key={option.value} value={option.value}>
      {option.label}
    </MenuItem>
  ))}
</TextField>
Run Code Online (Sandbox Code Playgroud)

更新:(确实要澄清)我正在谈论html5验证。在沙盒示例中,有“选择”和“文本”字段,根据需要设置文本字段将阻止Submit事件并显示一个本地html5错误,提示“此字段是必需的”,如果该字段为“ select”,则不是这种情况。

html-validation reactjs material-ui

5
推荐指数
1
解决办法
5658
查看次数