首页 > 其他分享 >bootstrap表单

bootstrap表单

时间:2022-12-26 09:35:39浏览次数:31  
标签:启用 是否 间隔 bootstrap 表单 过滤

内联表单:

 

 

 

<form class="row g-3" role="form">
                                                        <div class="col-md-2">
                                                            <label for="threadhold">检测阀值(0-1)</label>
                                                            <input type="text" class="form-control" value="0" id="threadhold" placeholder="最小值0,最大值1">
                                                        </div>
                                                        <div class="col-md-2">
                                                            <label for="filters">报警过滤间隔(秒)</label>
                                                            <input type="text" class="form-control" value="3" id="filters" placeholder="过滤间隔,单位为秒">
                                                        </div>

                                                        <div class="col-md-2">
                                                            <label for="isSkipframe">是否隔帧</label>
                                                            <select type="text" class="form-control" id="isSkipframe">
                                                                <option value="1" >是</option>
                                                                <option value="0" selected>否</option>
                                                            </select>
                                                        </div>
                                                        <div class="col-md-2">
                                                            <label for="skipframe">间隔帧数</label>
                                                            <input type="text" class="form-control" value="1" id="skipframe" placeholder="请输入间隔帧数">
                                                        </div>
                                                        <div class="col-md-2">
                                                            <label for="isHBW">是否启用比例过滤</label>
                                                            <select type="text" class="form-control" id="isHBW">
                                                                <option value="1" >是</option>
                                                                <option value="0" selected>否</option>
                                                            </select>
                                                        </div>
                                                        <div class="col-md-1">
                                                            <label for="hbw_low">高/宽-低</label>
                                                            <input type="text" class="form-control" value="0" id="hbw_low" placeholder="">
                                                        </div>
                                                        <div class="col-md-1">
                                                            <label for="hbw_high">高/宽-高</label>
                                                            <input type="text" class="form-control" id="hbw_high" value="1.4" placeholder="">
                                                        </div>
                                                    </form>

 

 

 

<div class="input-dyna-add">
                                                        <form class="form-inline form-group" role="form">
                                                            <div class="form-group">
                                                                <label for="source_type">类型</label><select name='source_type' class="form-control" onchange="selectOnchang(this)">
                                                                    <option value="0">USBCAMERA</option>
                                                                    <option value="1" selected>RTSP</option>
                                                                </select>
                                                            </div><div class="form-group">
                                                                <label for="stream_url">接入地址</label><input name='stream_url' type="text" class="form-control" placeholder="请输入接入地址">
                                                            </div><div class="form-group" style="display:none">
                                                            <label for="stream_url">索引编号</label><select name='stream_url' class="form-control">
                                                                <option value="0" selected>0</option>
                                                                <option value="1" >1</option>
                                                                <option value="2" >2</option>
                                                                <option value="3" >3</option>
                                                            </select>
                                                                  </div><div class="form-group">
                                                                <label for="remark">备注</label> <input name='remark' type="text" class="form-control" id="" placeholder="备注">
                                                            </div><div class="form-group">
                                                                <label for="isEnable">是否启用</label><input name='switch' type="checkbox">
                                                            </div><div class="form-group"><button class='removeclass btn btn-danger' type='button'><span>删除</span></button></div>
                                                        </form>
                                                    </div>

 

标签:启用,是否,间隔,bootstrap,表单,过滤
From: https://www.cnblogs.com/ljingjing/p/17004986.html

相关文章

  • 【Vue.js入门到实战教程】14-基于 Laravel Jetstream 的Vue 技术栈编写表单组件
    Laravel8引入Jetstream作为前端UI库在本月8号,Laravel8.0正式发布,随后Vue3.0 也正式发布,不过围绕Vue3生态的很多库还处于beta阶段,所以目前学院君这里的Vu......
  • BootStrap响应式项目实战之世界杯网页设计
    ​​视频​​BootStrap实战目标响应式布局复习HTML5的复习CSS3的复习了解BootStrap一.复习响应式布局:页面可以随着设备的变化而动态改变。淘宝:pc端一套页面:不能随着屏幕的......
  • django中只使用ModleForm的表单验证,而不使用ModleForm来渲染
    主题众所周知,django.forms极其强大,不少的框架也借鉴了这个模式,如Scrapy。在表单验证时,django.forms是一绝,也是面向对象的经典表现。但要用它来渲染表单那就不好玩了,除非写......
  • Vue之表单元素
    <!DOCTYPEhtml><html><head><metacharset="UTF-8"/><title>收集表单数据</title><scripttype="text/javascript"src="../js/vue.j......
  • Spring Security系列教程05--实现Form表单认证
    实现Form表单认证前言在上一章节中,​​一一哥​​带大家认识了SpringSecurity中的第一种认证方式,但是这种基本认证的方式,UI效果不漂亮,安全性也很差,好像一无是处的样子,那么......
  • 解决表单action属性传参时值为null的问题
    一.异常重现最近壹哥有个学生在学习Servlet进行Web开发时,尝试着使用表单中的action传递参数,结果他发现在Servlet中无法接收到前端传过来的参数值。我们先来看看他的代码,具......
  • 前端表单生成器
    前言以表单为主的页面(中后台)编写起来很是苦恼,涉及到大量表单状态维护和校验。方案但是这里有两个表单生成插件start最多的:vue:http://www.form-create.comreact:https:......
  • 使用 Spring 创建和提交 Web 表单的过程
    本指南将引导您完成使用Spring创建和提交Web表单的过程。您将构建什么在本指南中,您将构建一个Web表单,可通过以下URL访问该表单:​​http://localhost:8080/greeting......
  • HTML-学习表单-2022-12-22
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>登录注册</title></head><body><h1>注册</h1><!--表单formaction提交的位置,可以是网站,......
  • HTML-表单-2022-12-22
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>登录注册</title></head><body><h1>注册</h1><!--表单formaction提交的位置,可以是网站,......