精华内容
下载资源
问答
  • JS创建表单

    2014-08-18 13:16:11
    //varpageDiv=document.getElementById("page");  vartemp=document.createElement("form");  vartemp.action="doc!save.action?name="+file.name;  ...vartemp.method="POST";...vartemp.style.visibility="hidden
    //varpageDiv=document.getElementById("page"); 
    vartemp=document.createElement("form"); 
    vartemp.action="doc!save.action?name="+file.name; 
    vartemp.method="POST"; 
    vartemp.style.visibility="hidden"; 
    //vartemp.name="loadConfigPage"; 
    // varopt=document.createElement("input"); 
    // opt.name="gameUrl"; 
    // opt.id="gameUrl"; 
    // opt.value="1111"; 
    // varopt2=document.createElement("input"); 
    // opt2.name="skinId"; 
    // opt2.id="skinId"; 
    // opt2.value="22222"; 
    // vartemp.appendChild(opt); 
    // vartemp.appendChild(opt2); 
    // pageDiv.appendChild(temp); 
    vartemp.submit(); 
    展开全文
  • js创建表单

    2012-02-09 20:04:22
    [url]http://www.cnblogs.com/yuanyuan/archive/2010/01/12/1645297.html[/url] [url]...js执行前进后退 [url]http://www.cnblogs.com/yuanyuan/archive/2010/01/12/1645297.html[/url]
    [url]http://www.cnblogs.com/yuanyuan/archive/2010/01/12/1645297.html[/url]

    [url]http://www.trans4mind.com/personal_development/JavaScript2/createSelectDynamically.htm[/url]

    [url]http://stackoverflow.com/questions/178964/javascript-post-on-form-submit-open-a-new-window[/url]

    js执行前进后退
    [url]http://www.cnblogs.com/yuanyuan/archive/2010/01/12/1645297.html[/url]
    展开全文
  • 主要介绍了js创建表单元素并使用submit进行提交,需要的朋友可以参考下
  • angular.js是前端一个比较新颖,思想比较独特的框架,今天我利用angular写了一个注册表单,实现了一些功能首先呢介绍一下在写这个表单验证过程中所遇到的一些难题1.输入密码与再次输入密码的比较,这里是创建了一个...

    angular.js是前端一个比较新颖,思想比较独特的框架,今天我利用angular写了一个注册表单,实现了一些功能

    首先呢介绍一下在写这个表单验证过程中所遇到的一些难题

    1.输入密码与再次输入密码的比较,

    这里是创建了一个compare指令,该指令可以和一些数据进行对比,以返回布尔值

    app.directive('compare',function () {

    var com = {};

    com.strict="AE";

    com.scope = {

    orgText: '=compare'

    };

    com.require='ngModel';

    com.link = function (scope,elem,attr,control) {

    control.$validators.compare = function (v) {

    return v ==scope.orgText;

    }

    scope.$watch('orgText',function () {

    control.$validate();

    })

    }

    return com;

    })

    该段是创建compare的代码

    2.遇到单选框所取值不能获取的问题,

    这里的解决方法是给单选框赋值,例如给男选项input内部加上value=“男”,女选项input内部加上value=“女”,这样当点击注册时,会获取value的值,

    男  

    女  

    3.其实呢上面问题还是会有bug的,就是当注册者不去动单选框的时候,性别选项的内容是不会在注册时获取的,只有点击了选项才会在注册时被获取,所以这里又会用到一点知识,那就是ng-init

    这里给加上一个初始化的性别

    性别:

    男  

    女  

    这样就解决了性别的传值问题

    4.在angular.js中还是可以用自定义的正则表达式来给输入框加上规则的

    ng-pattern = “正则表达式”,

    5.这里还有一个问题,在这个注册表单中,我是用的my97,这是一个日期选项的插件,但是就是这里出现了问题,当我用到这个插件时发现不能获取出生日期的值,

    οnfοcus="WdatePicker({dateFmt:'yyyy-MM-dd',maxDate:'{%y-18}-%M-%d'})"

    class="form-control"

    name="birth"

    placeholder="请输入日期"

    ng-model ="userdata.birth"

    required="required"

    />

    后来查了一下,好像就是不兼容,但是也有简单的结局办法

    那就是给input加上一个οnchange=""

    这样就简单的解决了这个问题

    6.其实这么做还是有一个问题,就是当输入框内部有内容,但是内容错误时,还是能提交数据,这样的话,会造成数据的丢失,那么怎么来杜绝这种情况呢,我这里是在js代码中田间了一个函数,这个函数来控制提交按钮是否可用,判断条件是userdata内所需要的内容是否存在

    $scope.save = function () {

    var username = $scope.userdata.username;

    var usersex = $scope.userdata.sex;

    var userpass = $scope.userdata.password;

    var userpass2 = $scope.userdata.password2;

    var usertel = $scope.userdata.tel;

    var userbirth = $scope.userdata.birth;

    var useremail = $scope.userdata.email;

    if (username&&usersex&&userpass&&userpass2&&usertel&&userbirth&&useremail) {

    return false;

    }else{return true;}

    }

    html添加

    注册

    最后,我把完整的代码给写出来

    表单验证

    .wrapper{margin: 20px auto; width: 300px;position: relative;}

    .error{color: #a10;}

    .form_group{position: relative;margin-top: 15px;}

    input .error{border: 1px solid #a10;}

    .phone,.username,.password,.confirm_password,.birth,.emali,.sex{position: absolute;top: 36px;left: 280px; color: green;}

    #man{margin-left: 10px;}

    #woman{margin-left: 10px;}

    注册

    用户名:

    placeholder="请输入你的昵称"

    name="username"

    class="form-control"

    ng-model="userdata.username"

    ng-minlength="4"

    ng-maxlength = "32"

    required="required"

    />

    ng-if="signUpForm.username.$valid">

    用户名不可为空!

    用户名应该在4-32位之间!

    性别:

    男  

    女  

    密码:

    placeholder="请输入密码"

    name="password"

    class="form-control"

    ng-model="userdata.password"

    ng-minlength = "6"

    ng-maxlength = "255"

    required="required"

    />

    ng-if="signUpForm.password.$valid">

    ng-if="signUpForm.password.$error.required&&signUpForm.password.$touched"

    ng-model="all">密码不可为空!

    ng-if="(signUpForm.password.$error.minlength||

    signUpForm.password.$error.maxlength)

    &&signUpForm.password.$touched" ng-model="all">密码长度应该在6-255!

    确认密码:

    placeholder="再次输入密码"

    name="password2"

    class="form-control"

    ng-model="userdata.password2"

    compare="userdata.password"

    required="required"

    />

    ng-if="signUpForm.password2.$valid">

    两次输入密码不一致!

    电话:

    placeholder="请输入电话"

    type="tel" name="tel"

    ng-model="userdata.tel"

    ng-pattern="/^1[3,5,7,8]\d{9}$/"

    required>

    ng-if="signUpForm.tel.$valid">

    ng-if="signUpForm.tel.$error.required&&signUpForm.tel.$touched">电话不能为空!

    ng-if="signUpForm.tel.$error.pattern&&signUpForm.tel.$touched">请输入有效手机号!

    请输入生日:

    οnfοcus="WdatePicker({dateFmt:'yyyy-MM-dd',maxDate:'{%y-18}-%M-%d'})"

    class="form-control"

    name="birth"

    placeholder="请输入日期"

    ng-model ="userdata.birth"

    required="required"

    οnchange=""

    />

    ng-if="signUpForm.birth.$valid">

    请输入正确的生日

    请输入邮箱:

    class="form-control"

    name="email"

    placeholder="输入正确的邮箱"

    ng-model = "userdata.email"

    ng-pattern="/^[a-z0-9]+@([a-z0-9]+\.)+[a-z]{2,4}$/i"

    required="required"

    />

    ng-if="signUpForm.email.$valid">

    请输入正确的邮箱

    邮箱是必填项

    注册

    然后是js代码

    var app =angular.module('myApp',[])

    app.controller('SignUpController',function ($scope) {

    $scope.userdata={};

    $scope.submitForm = function () {

    console.log($scope.userdata);

    }

    })

    app.directive('compare',function () {

    var com = {};

    com.strict="AE";

    com.scope = {

    orgText: '=compare'

    };

    com.require='ngModel';

    com.link = function (scope,elem,attr,control) {

    control.$validators.compare = function (v) {

    return v ==scope.orgText;

    }

    scope.$watch('orgText',function () {

    control.$validate();

    })

    }

    return com;

    })

    这里需要提一下的是,引用的有my97插件和bootstrap框架以及angular.js框架

    展开全文
  • js创建表单控件

    2011-05-10 17:34:00
    js创建表单控件 var btn=document.createElement("input"); 表单控件类型用 btn.setAttribute("type","text") 为什么不用btn.type="text"? 因 浏览器安全限制 这样不能写 转载于:...

    js创建表单控件

    var btn=document.createElement("input");

    表单控件类型用

    btn.setAttribute("type","text")

    为什么不用btn.type="text"?

    因 浏览器安全限制 这样不能写

    转载于:https://www.cnblogs.com/mattins/archive/2011/05/10/2042329.html

    展开全文
  • JS创建表单提交后台设置请求方式

    千次阅读 2016-08-19 11:39:34
    JS 创建表单并提交 用途:在界面上选择几千个订单,读取ID号提交到后台处理,有几种方法实现,$.ajax方法提交不能打开新窗口,form表单提交可能被其他功能占用。 创建表单并设置参数类型、提交方式等,可以实现 form...
  • 本文将介绍如何动态创建表单组件,我们最终实现的效果如下:在阅读本文之前,请确保你已经掌握 Angular 响应式表单和动态创建组件的相关知识,如果对相关知识还不了解,推荐先阅读一下 Angular 4.x Reactive Forms ...
  • 今天继续给小伙伴们分享一款超强大的Vue表单生成器FormCreate。form-create 一款 star高达2.2K+ 可通过JSON生成动态渲染、验证和提交功能的表单生成器。支持生成Vue组件,内置17种常用组件及自定义组件。功能特性...
  • 本文将介绍如何动态创建表单组件,我们最终实现的效果如下:在阅读本文之前,请确保你已经掌握 Angular 响应式表单和动态创建组件的相关知识,如果对相关知识还不了解,推荐先阅读一下 Angular 4.x Reactive Forms和...
  • 利用 Angular 模板,我们可以创建各种类型表单,例如:登录表单,联系人表单,商品详情表单等,而且我们也为这些表单的字段添加数据校验。接下来我们一步步来实现表单的功能。创建项目导入初始化项目。或者直接下载...
  • 准备工作使用ng new async-form创建一个新工程,在app.module.ts中引入ReactiveFormsModule模块并在根模块中导入import { ReactiveFormsModule } from '@angular/forms';@NgModule({imports: [ReactiveFormsModule]}...
  • Angular 中有两种表单:Template-driven Forms (类似于 AngularJS 1.x 中的表单 )Reactive FormsTemplate-driven 表单的特点使用方便适用于简单的场景通过 [(ngModel)] 实现数据双向绑定自动生成 Form Model (异步)...
  • 动态表单使用场景有时候我们需要一个灵活的表单,这个表单可以根据用户的选择,或者服务器返回的信息进行重新配置,比如:增加或删除一组input元素、一组select元素,等等。在这样的情况下,如果一开始就在模板里写...
  • js操作页面三步骤 操作页面的三步骤 操作页面的三步骤 box h1 js事件鼠标事件 鼠标事件 .box { width: 200px; height: 200px; background-color: pink; margi...
  • AngularJS disables (cannot submit) forms that do not have a specific action set:when you create a controller. It does not have this issue when creating directive or factories.You can see this in a plu...
  • js创建表单并提交

    2017-01-11 17:19:00
    1.脚本 Util = { ... post : function(URL, PARAMS){ //虚拟表单实现post提交 var temp = document.createElement("form"); temp.action = URL; temp.method = "post"; ...
  • AngularJS中的表单验证AngularJS自带了很多验证,什么必填,最大长度,最小长度...,这里记录几个有用的正则式验证Note that novalidate is used to disable browser's native form validation. 用来禁用H5的原生...
  • JS创建表单: 对像标签里加入:onKeyDown="if(window.event.keyCode==220){return false;};" 如: onKeyDown="alert(event.keyCode);" 想知道哪个就按哪个
  • JS创建表单的小练习

    2019-12-03 14:10:20
    //创建表头单元格,因为td的数量跟属性名的数量一致,所以用循环,key是属性名 // for(key in data[0]){ // var td=document.createElement("td"); // tr.appendChild(td); // td.innerHTML=key; // } ...
  • JS创建表单提交备份

    2017-06-07 11:45:00
    创建隐藏表单 var newElement = document.createElement("input" ); newElement.setAttribute( "name", "createDate" ); newElement.setAttribute( "type", "hidden" ); newElement.setAttribute( "value" , ...
  • 本文使用angularjs及bootstrap,所需库请自行下载目的最终图能够根据所需实现表单的验证,如果不符合需求,则弹出提示1 建立相关文件index.htmlform-error-messagename:确认app.jsangular.module('app', [])....
  • js 创建表单提交

    千次阅读 2014-04-01 14:07:00
    <script src="Scripts/jquery-1.7.1.js"> function SubmitFormToSF() { var sfForm = document.createElement("form"); document.body.appendChild(sfForm); var mfInputs = "text1,checkbox1,Select1,Hidden1...
  • 1 需求当开发者需要一个特定的表单控件时就需要自己开发一个和默认提供的表单控件用法相似的控件来作为表单控件;自定义的表单控件必须考虑模型和视图之间的数据怎么进行交互2 官方文档 ->点击前往Angular为...
  • 今天我们将使用AngularJs和伟大的UI Router以及Angular ngAnimate module创建一个带动画的多步表单。这项技术可以用在你想要简化用户操作的大表单上。我们看到这项技术已经应用在了许多的网页上。比如购物车,注册...
  • 或者这样写 function myPost(data) { //创建form表单 var temp_form = document.createElement("form"); temp_form.action = '/erp/pay/alipay/forward'; temp_form.target = "_blank"; temp_form.method = "post";...
  • 支持蓝方 双方相同 JS部分:备注所有的script部分的代码都写在angular.module("myModule",[]).controller('myCtrl', function($scope) {写在这里}中 $scope.isshow=true; // 模仿请求得到的数据 $scope.saveDate=...
  • 代码很简单,就不多废话了,直接奉上代码:...app.directive('test',function() { //form表单的指令都有一个默认的控制器作为第四个参数var link = function($scope, $element, $attrs, $ctrl) {$scope.do = funct...
  • //创建一个button varbtn =newUE.ui.Button({ //button的名字 name:uiName, //提示 title:"保存表单", //须要加入的额外样式,指定icon图标。这里默认使用一个反复的icon cssRules :'background-position: -481...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,995
精华内容 798
关键字:

js创建表单