JS中artdialog弹出框控件之提交表单思路详解_javascript技巧

artDialog是一个基于javascript编写的对话框组件,它拥有精致的界面与友好的接口。

前言:

自适应内容

artDialog的特殊UI框架能够适应内容变化,甚至连外部程序动态插入的内容它仍然能自适应,因此你不必去考虑消息内容尺寸使用它。它的消息容器甚至能够根据宽度让文本居中或居左对齐——这一切全是XHTML+CSS原生实现。

完善的接口

它的接口完善,可以轻易与外部程序配合使用。如异步写入消息、控制位置、尺寸、显示与隐藏、关闭等。

细致的体验

如果不是在输入状态,它支持Esc快捷键关闭;可指定在元素附近弹出,让操作更便捷;智能给按钮添加焦点;黄金比例垂直居中;超大响应区域特别为ipad等触屏设备优化;预先缓存皮肤图片更快响应……

跨平台兼容

兼容:IE6+、Firefox、Chrome、Safari、Opera以及iPad等移动设备。并且IE6下也能支持现代浏览器的静止定位(fixed)、覆盖下拉控件、alpha通道png背景。

步入正题:

artdialog 不错的弹出框控件

接触artdialog已经有一段时间了,觉得其用起来还不错,比较轻量级,javascript的插件我比较喜欢轻量级的,加载速度快。

其功能也很不错,功能很齐全,相对于其它弹出插件,这个插件不仅还在维护,而且bug也少,用起来也挺方便,是国内比较出众的插件之一。

调用方法如下:

//说明下面是一段通过artdialog弹出form表单,并通过ajaxform来提交的js(表单可以采用jquery validate验证控件来验证表单)
$(document).ready(function() {
var options = {
target: '#output2',
success: showResponse // post-submit callback
};
$('#myForm').ajaxForm(options);
var alt =null;
$("#addHname").click(function(){
alt=art.dialog({
title:'新增花名',
content: document.getElementById('g_cn'),
width:750,
button: [
{
name: '保存',
focus: true,
callback: function () {
$('#myForm').submit();
return false;
}
},
{
name: '关闭',
callback: function () {
}
}
]
});
});
function showResponse(data){
if(alt !=null){
alt.close();
}
if(data=='success'){
artDialog.alert('保存成功');
}else{
art.dialog.close();
artDialog.alert('保存失败');
}
}
});

以上所述是小编给大家介绍的JS中artdialog弹出框控件之提交表单思路详解,希望对大家有所帮助!

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索artdialog表单
artdialog提交表单
artdialog提交表单、dialog提交表单、弹出dialog 提交表单、easyui dialog 表单、dialog 验证表单,以便于您获取更多的相关知识。

时间: 2024-08-01 06:46:12

JS中artdialog弹出框控件之提交表单思路详解_javascript技巧的相关文章

JS实现弹出浮动窗口(支持鼠标拖动和关闭)实例详解_javascript技巧

本文实例讲述了JS实现弹出浮动窗口.分享给大家供大家参考.具体如下: 这里介绍的JS弹出浮动窗口,支持鼠标拖动和关闭,点击链接文字后弹出层窗口,也称作是弹出式对话框吧. 关于一些参数说明: bodycontent:要在窗口中显示的内容 title:窗口的标题 removeable:窗口是否能拖动 注意:内容窗体的高度是height-30px,请计算好要显示的内容高度和宽度. 注:在火狐或chrome下效果最佳,IE8下可能有些小问题. 点击此处查看运行效果: http://demo.jb51.n

jQuery validate+artdialog+jquery form实现弹出表单思路详解_jquery

功能描述: 在页面弹出一个form表单,ajax无刷新提交表单,表单需通过验证. 适用范围: 适用于在列表页面新增,修改记录. 需要加载的js文件: jquery.min.js artDialog.js iframeTools.js jquery.form.js jquery.validate.js 实现思路: 在页面中将表单放到一个隐藏的容器中,用artdialog弹出该form并对form加上jqueryvalidate验证,提交采用jqueryform ajax提交,由于都是用现成的插件写

Web开发中的弹出对话框控件介绍

Web开发中,目前由于Jquery的大行其道,因此很多弹出对话框,都用到了Jquery技术,反而原始的弹出对话框的方式较为少用了.不过基于JQuery的方式实现对话框窗口弹出,也有很多控件可以利用,由于工作需要及业余兴趣所至,我比较了近10种的对话框控件,其中发现有一些做得很好的,除了功能强大,而且也支持多种皮肤样式,甚至有些对话框的居中都考虑到了,细节决定体验,有些真的不错. 1.原始的弹出对话框实现(弹出窗口也可以) 我们知道,以前在没有应用其他javascript库(例如各种类型的Jque

Bootstrap弹出框modal上层的输入框不能获得焦点问题的解决方法_javascript技巧

Bootstrap 弹出框modal上层的输入框不能获得焦点问题,具体内容如下 1.在使用Bootstrap框架中目前modal弹出框只支持一层 即在当前弹出框上不能再使用modal弹出框. 如果使用自定义的弹出框,例如:http://my.oschina.net/tianma3798/blog/737232 如果自定义弹出框中有input输入框,如果input 输入框不能获得焦点,则可能原因如下: 许多使用定义弹出层 <div class="modal fade" tabind

Js制作简单弹出层DIV在页面居中 中间显示遮罩的具体方法_javascript技巧

这两天要用到正好练练手,比想象中碰到的问题要多,比如: ie6背景透明 ie6居中显示 还有对js对象的理解 openID=显示按钮,conID=需要显示的div,closeID=关闭按钮 解决了: 1.可以遮挡ie6下的select元素 但是在ie6下div没有透明度 2.弹出的div可以一直在浏览器屏幕中间显示 问题: 1.目前不支持.class 只支持#id 2.需要显示的div需要自己设置css 3.在ie6下需要设置css 例如div {_position: absolute;_top

JS中的form.submit()不能提交表单的错误原因_javascript技巧

直接上代码把: 复制代码 代码如下: <div id="register">      <h4>会员注册</h4>      <div class="formdiv">          <form method="post" action="register.php?action=register" name="register" id="r

js判断所有表单项不为空则提交表单的实现方法_javascript技巧

demo1.html <html> <head> <title>提交表单页</title> <script type="text/javascript"> function myCheck() { for(var i=0;i<document.form1.elements.length-1;i++) { if(document.form1.elements[i].value=="") { alert(

php中限制ip段访问、禁止ip提交表单的代码分享_php技巧

在需要禁止访问或提交表单的页面添加下面的代码进行判断就可以了. 注意:下边只是一个PHP限制IP的实例代码,如果您打算应用到CMS中,请自行修改. <?php /加IP访问限制 if(getenv('HTTP_CLIENT_IP') && strcasecmp(getenv('HTTP_CLIENT_IP'), 'unknown')) { $userip = getenv('HTTP_CLIENT_IP'); } elseif(getenv('HTTP_X_FORWARDED_FOR

关于javascript中限定时间内防止按钮重复点击的思路详解_javascript技巧

前面的话 有一天心血来潮,1分钟内重复点击了多次博客园首页的刷新博文列表的刷新按钮.果不其然,ip当时就被禁用了.后来,重启自己的路由器,重新获取ip才可以访问博客园主页.那么,设置一个限定时间内(比如1秒)防止按钮被重复点击的方法会不会更好一点呢? 思路一 最直接的思路可能就是点击按钮后,按钮的事件绑定函数解绑,1s后重新绑定函数 <button id="btn">0</button> <script> btn.onclick = function