标签: disabled-input

我希望有一组HTML文本<input>可以同时显示为灰色(禁用).我也希望他们所处的整个区域都以某种方式变灰或至少明显禁用.我在桌面应用程序中看到过这样的事情.

有什么想法以简单/优雅的方式去做吗？我试图避免手动每个设置到disabled="disabled",并且还具有一个区域包围<input>的,指示该表格的整个部分是不可编辑的.

编辑:对不起,我应该提一些事情......

1. 一切都是本地的.我没有使用PHP或ASP或类似的东西......只是HTML,JavaScript和CSS.也没有jquery!
2. 我想用JavaScript动态启用/禁用"区域"
3. 这不是一个<form>,只是一堆<input>的

我从Javascript开始,我写了这个函数:

function disableField() {
  if( document.getElementById("valorFinal").length > 0 ) ) {
    document.getElementById("cantidadCopias").disabled = true; 
  }
}

如果填充第一个字段,则禁用名为cantidadCopias的第二个字段.

<label> <span>Valor final:</span>
  <input type="text" class="input_text" name="valorFinal" id="valorFinal" onkeydown="disableField()"/>
</label>
<label> <span>Cantidad de Copias:</span>
  <input type="text" class="input_text" name="cantidadCopias" id="cantidadCopias"/>
</label>

但是当第一个字段填满时,它不会禁用第二个字段.

我有一个在其下面有ui-view的fieldset.
每个视图都有很多字段(字段是包装输入的指令).

它看起来像这样:

<fieldset ng-disabled='myCondition'>
   <div ui-view></div> // this changes with lot's of fields that look like <div field='text-box'></div>
</fieldset>

现在,这很好用,除IE之外的所有浏览器都禁用字段.
我做了一些谷歌,看到即不支持fieldset +禁用,我正在寻找一个快速的解决方法.

我尝试了一些接近但不完美的事情,我认为我不是第一个需要解决方案的人(即使我没有在谷歌上找到任何东西).

你好,我有一些投入,但他们中的一个被禁用(是,我需要为我的时间表),但我怎么把它给autocomplete.php我insert.php已经这个错误未定义指数:用C客户端1:\ WAMP \第30行的www\testlp\insert.php

这是我的代码autocomplete.php

<form action = 'insert.php' method="post"  >

    <input type="text" name="client1" class = "client" size="12" id ="client1" disabled />

        </form>

这里是我的代码insert.php

    session_start(); 
    $date = $_POST['data'] ;
    $client1 = $_POST['client1'] ;

    echo($client1);
    echo($date);

编辑 我试过这个:

<input type="text" name="client1" class = "client" size="12" id ="client1"readonly />

这里的错误: Notice: Undefined index: client1 in C:\wamp\www\testlp\insert.php on line 12

我有一个表单,我需要禁用一系列复选框和一些字段,以便用户无法更改/更改其值.当我提交表单时,禁用元素的POST值缺失/ null.如何在没有这个问题的情况下管理我正在尝试做的事情？

现在我通过禁用容器div来禁用这些字段,如下所示:

#unselectable {
    -moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
    -webkit-user-select: none;
    cursor:not-allowed; 

}

<div ng-repeat="x in spaceutilization">
  <input type="checkbox" name="{{x.filenumber}}" id="{{x.id}}" class = "pdffiles" value="101SP{{x.initials}}.dwg" /><label for="{{x.id}}"><button type = "button" class = "btn btn-primary btn-sm hidden-sm hidden-xs"> PDF</button></label><br />
</div>

我需要能够在此片段中添加一些内容,根据另一个AngularJS输入(例如{{x.status}})禁用输入复选框.我试过简单地做:

<input type="checkbox" name="{{x.filenumber}}" id="{{x.id}}" class = "pdffiles" value="101SP{{x.initials}}.dwg" {{x.status}} />

凡status:'disabled'但给的输出

{{x.status}}=""

在输入元素内......我根本不明白为什么.但它似乎是最简单的路线.

如果用户单击没有内容的提交,我希望显示一条错误消息,并且我希望禁用提交按钮.我可以让任何一个工作,但不能同时工作.

下面的代码显示了消息但允许空的待办事项.

<form name="todoForm" novalidate >


    <div ng-messages="todoForm.new.$error" ng-if="todoForm.$submitted"><div ng-message="required">Add Your Item Below...</div></div><!--message appears until valid input is entered--> 

    <input type="text" name="new" placeholder="start typing..." autofocus data-ng-model="newTodo" required=""/>

    <button input type="submit" ng-click="addTodo()" >Add To List</button><!--disables form if form not valid-->

</form>

此版本禁用提交按钮但不显示消息

<form name="todoForm" novalidate >


    <div ng-messages="todoForm.new.$error" ng-if="todoForm.$submitted"><div ng-message="required">Add Your Item Below...</div></div><!--message appears until valid input is entered--> 

    <input type="text" name="new" placeholder="start typing..." autofocus data-ng-model="newTodo" required=""/>

    <button input type="submit" ng-click="addTodo()" data-ng-disabled="todoForm.$invalid" >Add To List</button>
</form>

我认为这是因为当输入按钮被禁用时因为没有提交任何内容而无法显示消息？

我尝试过使用$ disabled和$ invalid,但它们没有用.

当fieldset禁用父级时，是否有办法（像元素上的属性一样）使特定元素“不可分散” ？最好没有任何JavaScript。如果不是，什么是禁用整个表格（有特定例外）的良好实践？

<fieldset disabled>
  Name: <input type="text"><br>

  <!-- Email shouldn't be disabled -->
  Email: <input type="text"><br>

  <!-- more fields ... -->
</fieldset>

在这里发帖之前,我找啊找,我发现了几个解决方案,应用工具提示禁用的按钮,反正这些都不是用uib-tooltip从角UI引导.

这是我按钮的代码:

<button class="btn btn-default"
        uib-tooltip="My tooltip text"
        tooltip-append-to-body="true"
        ng-disabled="!isAllSelected"
        ng-click="doThat()">Click Here
</button>

你是否知道即使按钮被禁用,如何使工具提示可显示？

目前，我正在使用 Angular 15 和 Angular 14 作为我使用的反应形式的禁用输入字段[attr.disabled]="disableField ? true : null"。

我将 Angular 版本 14 更新到 15 后，此属性不起作用