如何使用基于单选按钮输入的jquery跳过隐藏输入字段的验证(删除必需属性)

2024-03-24

使用 bootstrap 有一个简单的形式。为了进行验证,我使用了“必需”的引导程序,效果很好。

但在我的表单中,我根据单选按钮隐藏带有查询的输入字段。

我的问题是提交表单需要隐藏的输入字段。我怎样才能跳过这个。我不想验证隐藏的输入。

Error: https://www.screencast.com/t/ObpmoXfGE9 https://www.screencast.com/t/ObpmoXfGE9


当您根据单选按钮值隐藏表单输入时,请从这些输入中删除所需的属性。 这样隐藏的输入将不会得到验证。

$("#hidden_input_id").removeAttr("required");

希望这可以帮助!

从你的小提琴中我了解到你需要从隐藏输入中删除所需的属性。假设如果电梯可见,那么您需要从类别和地面区域输入中删除所需的属性。

只需按照以下方式进行即可——

$(document).ready(function(){
$("input[name='type']").change(function() {
$("#elevator").toggle(this.value == "ETW");
$("#category :input").removeAttr("required");
$("#ground_area :input").removeAttr("required");
 });
$(document).ready(function() {
  $("input[name='type']").change(function() {
    $("#elevator").toggle(this.value == "ETW");
   $("#category :input").removeAttr("required");
  $("#ground_area :input").removeAttr("required");

  });

  $("input[name='type']").change(function() {
    $("#category").toggle(this.value == "EFH" || this.value == "ZFH");
  });

  $("input[name='type']").change(function() {
    $("#ground_area").toggle(this.value == "EFH" || this.value == "ZFH");
  });
});
<div class="form-group">
  <label>Objektadresse</label>
  <input type="text" placeholder="Straße" class="form-control" name="street" required>
</div>

<div class="form-group">
  <input type="text" placeholder="Hausnummer" class="form-control" name="house_number" required>
</div>

<div class="form-group">
  <input type="text" placeholder="PLZ" class="form-control" name="zip" required>
</div>

<div class="form-group">
  <input type="text" placeholder="Stadt" class="form-control" name="town" required>
</div>



<div class="form-group" id="type">
  <label>Was möchten Sie bewerten?</label>
  <div class="radio">
    <label>
      <input type="radio" id="type1" name="type" value="ETW" required>Eigentumswohnung</label>
  </div>
  <div class="radio">
    <label>
      <input type="radio" id="type2" name="type" value="EFH" required>Einfamilienhaus</label>
  </div>
  <div class="radio">
    <label>
      <input type="radio" id="type3" name="type" value="ZFH" required>Mehrfamilienhaus</label>
  </div>
</div>

<div id="category" class="form-group" style="display:none;">
  <label>Um welche Kategorie handelt es sich?</label>
  <div class="radio">
    <label>
      <input type="radio" name="category" value="FREISTEHEND" required>Freistehend</label>
  </div>

  <div class="radio">
    <label>
      <input type="radio" name="category" value="DOPPELHAUS" required>Doppelhaushälfte</label>
  </div>
  <div class="radio">
    <label>
      <input type="radio" name="category" value="REIHENMITTELHAUS" required>Reihenmittelhaus</label>
  </div>
  <div class="radio">
    <label>
      <input type="radio" name="category" value="REIHENENDHAUS" required>Reihenendhaus</label>
  </div>
</div>


<div class="form-group">
  <label>Wann wurde das Objekt gebaut?</label>
  <input type="text" placeholder="Baujahr" class="form-control" name="year" required>
</div>



<div class="form-group">
  <label>Wie groß ist die Wohnfläche</label>
  <input type="text" placeholder="Wohnfläche" class="form-control" name="living_area" required>
</div>

<div id="ground_area" class="form-group" style="display:none;">
  <label>Wie groß ist das Grundstück</label>
  <input type="text" placeholder="Grundstücksgröße" class="form-control" name="ground_area" required>
</div>

<div class="form-group" id="elevator" style="display:none;">
  <label>Besitz die Wohnung einen Aufzug?</label>
  <div class="radio">
    <label>
      <input id="elevator1" type="radio" name="elevator" value="true" required>Ja</label>
  </div>
  <div class="radio">
    <label>
      <input id="elevator2" type="radio" name="elevator" value="false" required>Nein</label>
  </div>
</div>


<div class="form-group">
  <label>Besitz das Objekt eine Garage?</label>
  <div class="radio">
    <label>
      <input type="radio" name="garages" value="true" required>Ja</label>
  </div>
  <div class="radio">
    <label>
      <input type="radio" name="garages" value="false" required>Nein</label>
  </div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

更新的小提琴 https://jsfiddle.net/zcLn6ct6/2/

注意:把所有东西都包在里面$(document).ready功能。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用基于单选按钮输入的jquery跳过隐藏输入字段的验证(删除必需属性) 的相关文章

随机推荐

  • 将 Babel 添加到 HTML

    我是 ReactJS 新手 在将 babel 导入 html 时遇到问题 目前该项目托管在code pen上链接到代码笔 https codepen io davedaw pen JJgvGK editors 1010 我正在尝试在本地主机
  • 如何在 Rust 中返回字符串向量

    如何通过分割中间有空格的字符串来返回字符串向量 fn line to words line str gt Vec
  • 如何在Raku中逐行读取gz文件

    我正在尝试在 Raku 中逐行读取一个巨大的 gz 文件 我正在尝试做这样的事情 my file huge file gz for file IO lines gt line say line 但这给出了我的 UTF 8 格式错误的错误 我
  • OpenCV::dnn::readNet 抛出异常

    我正在关注本教程 https learnopencv com object detection using yolov5 and opencv dnn in c and python 加载yolov5 onnx使用 OpenCV DNN 模
  • CPU如何对指令重新排序

    我最近读到了有关 CPU 指令重新排序以提高效率的内容 但我无法理解CPU如何重新排序其指令 我的意思是编译时重新排序是可以想象的 因为编译器可以预见即将到来的代码 但是对于一个接一个地读取指令的CPU 它如何看到即将到来的指令并对它们重新
  • 计算实验室信息系统 (LIS) 帧的校验和

    我正在开发一个仪器驱动程序实验室信息系统 https www limswiki org index php Laboratory information system 我想知道如何计算帧的校验和 校验和算法说明 用字符 0 9 和 A F
  • 我应该在每个视图中都有一个 NSFetchedResultsController 吗?

    我在我的第一个 iPhone 应用程序中使用 Core Data 并尝试理解 NSFetchedResultsController 它在我的根视图中效果很好 我是否需要在每个视图控制器中实例化一个实例 如果是这样 是否有一个模板可以使这像在
  • Ruby on Rails 教程自定义 CSS 未显示在应用程序中

    我正在运行 Michael Hartl 的 Ruby on Rails 教程 我的 boostrap sass 正在工作 但是我无法显示任何自定义修改 在第 5 5 章中 我们添加了 bootstrap sass gem 这是我的 Gem
  • 删除 javascript 字符串中的元音变音或特殊字符

    以前从未在 javascript 字符串中使用变音符号或特殊字符 我的问题是如何删除它们 例如我在 javascript 中有这个 var oldstr Bayern M nchen var str oldstr split join 结果
  • PurgeCSS 不会从 NextJS 项目中删除未使用的 CSS

    我正在尝试使用 PurgeCSS 从我的 NextJS 项目中删除未使用的 css 然而 我很难将 PurgeCSS 最基本的集成到我的项目中来工作 我正在使用这个文档 https www purgecss com guides next
  • 以编程方式清除 win 7 中的图标缓存 - 使用 C# 或 Visual Basic 执行 ie4uinit.exe-ClearIconCache

    我们更改了 WPF 应用程序的徽标图标 然后更改了主可执行文件的图标 在我的 Win 7 电脑上 刷新图标缓存时出现问题 主可执行文件的桌面快捷方式以及可执行文件图标的预览在 Windows 资源管理器中仍然显示旧图标 即使重新启动系统 问
  • Scala:将数组放入集合或映射中的轻量级方法

    Since 不适用于数组 我无法有效地创建一组数组 或带有数组键的映射 我宁愿不承受将数组转换为向量或列表或其他东西的性能损失 是否有一种轻量级的方法来定义数组上的自然比较和哈希码 以便我可以将它们放在集合中 Use WrappedArra
  • 异步 CMIS 客户端:与 OpenCMIS 并行下载或上传多个文件

    The OpenCMIS 0 14 的变更日志 https www mail archive com announce apache org msg03240 html says 客户端添加了对异步操作的支持 图书馆 作为 CMIS 客户端
  • L2 逐出时从 L1 缓存逐出缓存

    我有一个关于内存系统遵循的策略的基本问题 考虑具有私有 L1 和 L2 缓存的核心 在二级缓存之后 我们有一个总线 一致性流量在该总线上运行 现在 如果地址 X 的缓存线从二级缓存中逐出 是否有必要从一级缓存中逐出该地址 驱逐的原因可能是它
  • 从 Node.JS 调用 Haskell

    我想从 Node js 对 Haskell 代码进行 RPC 调用 Node 和 Haskell 都有哪些库 我只能找到 XML RPC 和 Zeromq 但它们似乎不稳定 对于 Haskell 端的 xml rpc haxr 库已经存在很
  • MySQL/Python -- 提交的更改未出现在循环中

    使用 MySQL Connector Python 我有一个循环 每 2 秒检查一次值是否发生变化 没有所有的内容 这是循环 打印是为了测试目的 try while True request database get row table s
  • 将文件从请求移动或复制到多个位置

    我正在使用 Laravel 并接受输入和文件上传 此页面接受用户想要对订单进行的更改 最终目标是获取此输入并将其应用于多个订单 我可以重复使用每个订单的输入 但是 对于我来说 将该请求中的文件复制到多个目录的好方法是什么 例如 如文档中所示
  • SQL Server 中的条件条件

    我有一个包含 3 个值的组合框 All Failed Completed ALL 加载所有行 无条件 Failed and Completed 在 状态 列上加载条件 ALL SELECT FROM tbl Location 失败和完成 S
  • 如何在不使用 conda 的情况下从源代码安装 Bob

    Bob https www idiap ch software bob 推荐其用户install https www idiap ch software bob install它的包使用conda 但我不想用conda 我如何从源代码安装它
  • 如何使用基于单选按钮输入的jquery跳过隐藏输入字段的验证(删除必需属性)

    使用 bootstrap 有一个简单的形式 为了进行验证 我使用了 必需 的引导程序 效果很好 但在我的表单中 我根据单选按钮隐藏带有查询的输入字段 我的问题是提交表单需要隐藏的输入字段 我怎样才能跳过这个 我不想验证隐藏的输入 Error