表单验证 | 易学教程

ASP.NET MVC使用Bootstrap系统（2）——使用Bootstrap CSS和HTML元素

阅读更多关于 ASP.NET MVC使用Bootstrap系统（2）——使用Bootstrap CSS和HTML元素

Bootstrap提供了一套丰富CSS设置、HTML元素以及高级的栅格系统来帮助开发人员快速布局网页。所有的CSS样式和HTML元素与移动设备优先的流式栅格系统结合，能让开发人员快速轻松的构建直观的界面并且不用担心在较小的设备上响应的具体细节。 Bootstrap 栅格（Grid）系统在移动互联网的今天，越来越多的网站被手机设备访问，移动流量在近几年猛增。Bootstrap 提供了一套响应式、移动设备优先的流式栅格系统，随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多12列。栅格参数 Bootstrap 3提供了一系列的预定义class来指定列的尺寸，如下所示： Bootstrap 栅格系统被分割为12列，当布局你的网页时，记住所有列的总和应该是12。为了图示，请看如下HTML所示： <div class="container"> <div class="row"> <div class="col-md-3" style="background-color: green;"> <h3>green</h3> </div> <div class="col-md-6" style="background-color: red;"> <h3>red</h3> </div> <div class="col-md-3" style="background-color:

【思路】表单控件和查询控件，整理一下思路。

阅读更多关于【思路】表单控件和查询控件，整理一下思路。

这回不分页了，改成添加修改数据了。您是如何添加数据的呢？使用ORM、LinQ、.net2.0新增加的 FormView + SqlDataSource，还是其他？我还是喜欢自己动手丰衣足食。自己做一个表单控件来玩玩。以前也写了几个关于表单控件的 post ： 1、表单控件续（1）——应用接口来简化和分散代码 2、能自己“跑”的表单控件，思路，雏形，源码。vs2005版本我简单的看了一下 FormView + SqlDataSource 的方式，ms还真是厉害，拖拽几个控件，点击下鼠标，基本功能就出来了。挺简单的吧，但是还是有几个缺点： 1、虽然能够根据字段来生成控件，但是好像只有文本框，下拉列表不能自动生成出来吧。 2、我的字段名是“ Title ”，那么他就把 Title 当成标签了，其实我是想用“新闻标题”来显示给用户看的。 3、aspx页面里一大堆的字段名和SQL语句，当然这些都是 FormView 和 SqlDataSource的属性的内容。这么分散不便于管理吧，有个风吹草动的话怎么办呢？我还没有深入了解，不知道 FormView 和 SqlDataSource 有没有好的应对方法。分析一下 FormView 和 SqlDataSource都做了哪些事情， FormView 主要是绘制各种控件，保存数据，提取数据这些工作好像都交给 SqlDataSource

创建表单

阅读更多关于创建表单

创建表单表单 <form action="" method="post"> <p>用户名：<input name="user" id="name" type="text" size="15" /></p> <p>密码： <input name="password" type="password" size="15" /></p> <p>性别：男 <input type="radio" name="sex" value="1" checked /> 女 <input type="radio" name="sex" value="2" /></p> <p>爱好：<input name="fav1" type="checkbox" value="1"/>跳舞 <input name="fav1" type="checkbox" value="2"/>散步 <input name="fav1" type="checkbox" value="3"/>唱歌</p> <p>所在地：<select name="addr"> <option value="1">河北</option> <option value="2">北京</option> <option value="3">天津</option> </select></p> <p>个性签名：<br/><textarea name="sign

bootstrap 基础表单

阅读更多关于 bootstrap 基础表单

表单中常见的元素主要包括：文本输入框、下拉选择框、单选按钮、复选按钮、文本域和按钮等。其中每个控件所起的作用都各不相同，而且不同的浏览器对表单控件渲染的风格都各有不同。 ☑ LESS版本：对应源文件 forms.less ☑ Sass版本：对应源文件 _forms.scss 对于基础表单，Bootstrap并未对其做太多的定制性效果设计，仅仅对表单内的 fieldset 、 legend 、 label 标签进行了定制 fieldset { min-width: 0; padding: 0; margin: 0; border: 0; } legend { display: block; width: 100%; padding: 0; margin-bottom: 20px; font-size: 21px; line-height: inherit; color: #333; border: 0; border-bottom: 1px solid #e5e5e5; } label { display: inline-block; margin-bottom: 5px; font-weight: bold; } 1、宽度变成了100% 2、设置了一个浅灰色（#ccc）的边框 3、具有4px的圆角 4、设置阴影效果，并且元素得到焦点之时，阴影和边框效果会有所变化

Bootstrap 基础讲解2

阅读更多关于 Bootstrap 基础讲解2

-------------------------------------------思想是行动的先导，心理问题直接作用并影响人的思想。知识预览 bootstrap简介 CSS栅格系统四表格表单回到顶部 bootstrap简介 http://v3.bootcss.com/ Bootstrap优点：下载： Bootstrap引入 1 2 3 4 < meta name="viewport" content="width=device-width, initial-scale=1"> < link href="dist/css/bootstrap.min.css" rel="stylesheet"> < script type="application/javascript" src="dist/jquery-3.1.1.js"></ script > < script type="application/javascript" src="dist/js/bootstrap.min.js"> 回到顶部 CSS栅格系统 Bootstrap 提供了一套响应式、移动设备优先的流式栅格系统，随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多12列。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8

基于spring自动注入及AOP的表单二次提交验证

阅读更多关于基于spring自动注入及AOP的表单二次提交验证

这几天在网上闲逛，看到了几个关于spring的token二次提交问题，受到不少启发，于是自己动手根据自己公司的项目框架结构，制作了一个基于spring自动注入加上AOP的表单二次提交。原理：建立两个注解类，一个进行token的设置，一个进行token的验证。在一个Aspect中，对这两个注解进行捕获并进行相应的验证。废话不多说，下面是代码： Token注解类，标记需要设置token的方法。 @Documented @Retention(RetentionPolicy.RUNTIME) @Target(ElementType.METHOD) //设定此注解对应的是方法。 public @interface Token { } TokenValid注解类，标记需要验证token的方法。 @Documented @Retention(RetentionPolicy.RUNTIME) @Target(ElementType.METHOD) public @interface TokenValid { } TokenAspect类，对上面两个注解标识的方法的访问进行捕获并处理。 @Aspect @Component public class TokenAspect { @Around("@annotation(token)") //可以直接捕获下面这个方法中参数所设定的注解类型

Node.js+express实现博客管理项目

阅读更多关于 Node.js+express实现博客管理项目

前言: 经过一段时间的前端学习,终于到了开始做一些项目来进行自我检验的时候了.下面我把本次项目的内容和过程加以总结,希望可以得到大家的支持,有需要源码的可以关注我私信,或者留邮箱地址. 1. 项目环境搭建 1.1 项目介绍博客的内容展示页面博客的管理页面 1.2 项目需要的文件夹及用到的技术主要技术 1.express框架 2.node.js 3.mongodb 文件夹 2. 项目功能 2.1 登录创建用户集合，初始化用户连接数据库创建用户集合初始化用户为登录表单项设置请求地址、请求方式以及表单项name属性当用户点击登录按钮时，客户端验证用户是否填写了登录表单如果其中一项没有输入，阻止表单提交服务器端接收请求参数，验证用户是否填写了登录表单如果其中一项没有输入，为客户端做出响应，阻止程序向下执行 2.2 新增用户为用户列表页面的新增用户按钮添加链接添加一个连接对应的路由，在路由处理函数中渲染新增用户模板为新增用户表单指定请求地址、请求方式、为表单项添加name属性增加实现添加用户的功能路由接收到客户端传递过来的请求参数对请求参数的格式进行验证验证当前要注册的邮箱地址是否已经注册过对密码进行加密处理将用户信息添加到数据库中重定向页面到用户列表页面 2.3 数据翻页当数据库中的数据非常多是，数据需要分批次显示，这时就需要用到数据分页功能。

前端如何利用form表单传数组

阅读更多关于前端如何利用form表单传数组

在写前端的时候碰到了传数组的问题，于是我利用form表单测试了一下。如何利用form表单传数组 form表单的常用形式如下： <form action="http://192.168.43.158:8082/uploadImage" method="post" enctype="multipart/form-data"> <input type="file" name="filename" size="45"><br> <input type="submit" name="submit" value="submit"> </form> 根据我目前的需求：传数组 <form action="http://192.168.43.158:8082/game/examination/addMul" method="post" enctype="multipart/form-data"> <form> <div class="form-control"> books1: <input type="text" name="books[]" /> </div> <br> <div class="form-control"> books2: <input type="text" name="books[]" /> </div> <input type="submit" value="Submit

03- web表单测试

阅读更多关于 03- web表单测试

软件分为 b/s c/s两种架构表单测试 1.用户注册，登录，信息提交。 2.用户查询商品。 3.用户订购商品。 4.用户查询订单等。表单测试实例表单数据添加测试（一）添加按钮可用，测试点击添加按钮，能够进入响应的添加页面；进入添加页面，验证输入字段和需求描述一致；所有的输入字段输入合法数据；表单数据添加测试（二）重复提交信息，如一条已经成功的提交的记录，返回后在提交，看看系统是否做了处理。例如：12306网站重复预定一张相同车次和时间段的车次。表单数据添加测试（三）如果需求规定输入字段不能为空，验证程序对非空数据有明显标识或说明，对非空输入字段输入空数据有控制。如果需求规定字段需要选择输入，验证程序对选择数据有控制。例如：上面不填写验证码，会不会有响应的提示。表单数据修改测试修改按钮可用，测试点击修改按钮，能够进入相应的修改页面。修改各字段信息时，验证方法同添加，但是还需验证添加和修改的一致性。保存修改内容，重新查询修改后的内容。一条数据引用另一个数据，修改被引用数据后，引用数据中是否发生变化。表单数据删除测试（一）可能造成严重后果的删除操作，系统是否支持执行可逆或给出警告，删除前是否要求确认。删除操作是否正确执行，若删除的内容在文件或数据库中，应做实际校验。对于批量删除记录的系统，删除一个或多个记录，检查能否正确执行。

html5自带表单验证-美化改造

阅读更多关于 html5自带表单验证-美化改造

神奇的代码暂且叫做html5.css /* === HTML5 validation styles === */ .myform select:required, .myform input:required, .myform textarea:required { background: #fff url(../img/red_asterisk.png) no-repeat 99% center; } .myform select:required:valid, .myform input:required:valid, .myform textarea:required:valid { background: #fff url(../img/valid.png) no-repeat 99% center; box-shadow: 0 0 5px #5cd053; border-color: #28921f; } .myform select:focus:invalid, .myform input:focus:invalid, .myform textarea:focus:invalid { background: #fff url(../img/invalid.png) no-repeat 99% center; box-shadow: 0 0 5px #d45252;

订阅表单验证