dojo中form应用示例

最新推荐文章于 2018-05-15 14:07:19 发布
最新推荐文章于 2018-05-15 14:07:19 发布
阅读量312 收藏
点赞数
分类专栏： dojo学习 文章标签： dojo dijit 


<html dir="ltr">
<head>
    <title>Using Dijit</title>
	<link rel="stylesheet" href="dijit/themes/soria/soria.css" />
	<style type="text/css">
		body, html { font-family:helvetica,arial,sans-serif; font-size:90%; }
		table { border: 1px solid #ccc; border-collapse: collapse; margin-bottom: 6px;}
		table td { border: 1px solid #ccc;}
		table tr td.label { background-color: #eee;}
		label { font-weight: bold;}
	</style>
</head>
<body class="soria">
	<div dojoType="dijit.form.Form" align="center" style="width: 280px;margin: 0px auto">
		<h1>Reservation Form</h1>
		<table cellpadding="10" cellspacing="0">
			<tr>
				<td class="label"><label>Hotel:</label></td>
				<td><select dojoType="dijit.form.ComboBox">
					<option>Grand Canal Hotel</option>
				</select></td>
			</tr>
			<tr>
				<td class="label"><label>No. of Guests:</label></td>
				<td>
					<div dojoType="dijit.form.HorizontalSlider" value="2" minimum="1" maximum="4" discreteValues="4" style="width: 153px">
						<ol dojoType="dijit.form.HorizontalRuleLabels" container="bottomDecoration" style="height:1em;font-size:75%;color:gray;">
				        <li>
				            1
				        </li>
				        <li>
				            2
				        </li>
				        <li>
				            3
				        </li>
						<li>
							4
						</li>
				    </ol>
					</div>
				</td>
			</tr>
			<tr>
				<td class="label"><label>Smoking:</label></td>
				<td>
					<input type="radio" dojoType="dijit.form.RadioButton" />
					<label>Yes</label>  
					<input type="radio" dojoType="dijit.form.RadioButton" checked />
					<label>No</label>
				</td>
			</tr>
			<tr>
				<td class="label"><label>Sea View:</label></td>
				<td>
					<input type="checkbox" dojoType="dijit.form.CheckBox" checked />
				</td>
			</tr>
			<tr>
				<td class="label"><label>Nights:</label></td>
				<td><input dojoType="dijit.form.NumberSpinner" value="3" /></td>
			</tr>
			<tr>
				<td class="label"><label>Arrival Time:</label></td>
				<td><input dojoType="dijit.form.TimeTextBox" value="T14:00:00" /></td>
			</tr>
			<tr>
				<td class="label"><label>Arrival Date:</label></td>
				<td><input dojoType="dijit.form.DateTextBox" value="2010-12-31" /></td>
			</tr>
		</table>
		
		<button dojoType="dijit.form.Button">
			Submit
		</button>
	</div>

	<script src="dojo/dojo.js" djConfig="parseOnLoad: true"></script>
	<script>
	dojo.require("dijit.dijit");
	dojo.require("dijit.form.Form");
	dojo.require("dijit.form.DateTextBox");
	dojo.require("dijit.form.NumberSpinner");
	dojo.require("dijit.form.Button");
	dojo.require("dijit.form.TimeTextBox");
	dojo.require("dijit.form.ComboBox");
	dojo.require("dijit.form.HorizontalSlider");
	dojo.require("dijit.form.HorizontalRuleLabels");
	dojo.require("dijit.form.RadioButton");
	dojo.require("dijit.form.CheckBox");
	
	dojo.addOnLoad(function() {		

	});
	</script>
</body>
</html>


qingqingzijinxin
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Dojo构建Ajax应用程序
03-16
7. **实际应用示例**：为了使理论知识更易于理解，书中很可能包含丰富的实际应用示例和案例研究，展示如何在真实项目中应用Dojo来解决实际问题。 8. **工具支持**：Dojo提供了如`dojo.build`工具，用于构建和优化...
dojo中文文档-dojo手册
04-19
压缩包中的Dojo+hand+book.chm文件包含了以上所有内容的详细解释和示例，是学习和使用Dojo的宝贵资料。通过阅读和实践，开发者可以深入理解Dojo的精髓，提高开发效率，打造出更加优秀的Web应用。
认识Dojo中的表单：Form
热门推荐
Dojo中文博客
08-26 2万+
认识Dojo中的表单：Form 正如“认识Dojo中的界面控件”一文中提到的，Dijit库提供了一整套极其强大且灵活的基于Dojo的小部件(Widget)，帮助你很方便地增强Web应用的界面和功能。这些小部件包括下拉菜单、弹出菜单、对话框、页面布局、树、进度条、以及表单元素。很显然Dijit让这些控件变得很漂亮，但本文所关注的是它们增强的功能，尤其是对一个基本表单在可用性和有效性方面的增强。Dijit实现的快速回顾 要在一个页面中使用Dijit所要做的第一件事情就是引入Dojo
dojo/dom-form
weixin_34166472的博客
11-14 89
　　表单的处理在前端开发中一样意义非凡，dojo/dom-form模块提供了一系列方法来处理表单元素。比如： fieldToObject： 将一个表单字段转化成JavaScript原生类型，可能是string、array等 toObject：将一个表单元素转化成JavaScript对象 toQuery： 将一个表单元素转化成编码后的query字符串 toJson： 将一个表单元素转化成...
dojo---在线编辑器案例
孤独剑客
12-23 127
前台页面部分： &lt;%@ page language="java" pageEncoding="UTF-8"%&gt; &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&gt; &lt;html&gt; &lt;head&gt; &lt;title&a
dojo dom-form模块
v5browser
04-17 110
Email:longsu2010 at yeah dot net 假设一个场景，现在有一个一百个表单项的表单要提交到服务器端，你可能谨慎的选择了POST方式。再加一个条件，使用websocket与服务器端通信，那么表单提交那套用不上了。如果说让你一个一个表单拼接的话，是不是想掏刀子杀人了？ 当人谁都会用程序搞定，首先获取到form节点，之后再通过form的elements获取到所有的input...
javascript中的dijit/form/HorizontalSlider地用法
whynotybb的博客
06-06 547
data-dojo-props="             container: 'topDecoration',             style: 'height: 1.2em; font-weight: bold; margin: 0 12px;'">                     0                     200                  
DOJO-API中文参考手册附加注解实例.rar_dojo
09-15
压缩包中的注解实例文档可能包含对DOJO API的详细解释，通过具体代码示例展示了如何使用DOJO的各种功能。这对于初学者来说，是一份很好的学习材料，能够快速上手并深入理解DOJO的工作原理和用法。 总的来说，DOJO ...
Dojo实例应用演示源码收集.zip
最新发布
11-02
这个压缩包“Dojo实例应用演示源码收集.zip”显然包含了与 Dojo 相关的示例代码，可以帮助开发者深入理解和学习 Dojo 框架的应用。 **1. Dojo 的核心特性** - **模块化系统（AMD - Asynchronous Module Definition...
dwr,dojo框架应用实例
05-18
在"Ajaxapp"这个实例中，很可能是演示了如何结合使用DWR和Dojo来创建一个基于Ajax的应用。可能包含了使用Dojo创建交互式的前端界面，以及通过DWR实现前后端数据交换的代码示例。学习这个实例可以帮助你理解这两个...
HorizontalSlider VerticalSlider
u014054098的博客
03-03 501
using UnityEngine; using System.Collections; public class slideTest : MonoBehaviour { // Use this for initialization float horValue; float verValue; void Start () { } // Update i
Dojo学习笔记（一）
黑鸟酱
08-30 173
创建一个HelloWorld级别的Dojo 表单Demo有一下几个步骤: 在&lt;head&gt;部分添加标准的Dojo首部（路径根据自己本地目录修改） &lt;style type="text/css"&gt; @import "../lib/dojoroot/dijit/themes/tundra/tundra.css"; @import "../l...
Dojo学习笔记（十五）：Dojo滑动条Slider
weixin_34067049的博客
11-09 388
Slider没有相对应的 HTML 控件，是一个相对独立的图形化的组件，可以通过鼠标、方向键来控制刻度尺的刻度。Dijit提供了水平和垂直滑动条。 Slider widget的使用却如同使用 CheckBox widget一样的方便。用户可以用鼠标点击、拖拉、中键滚动或者用键盘的上、下、左、右按键来选择Slider widget的刻度。 ...
从零开始学_JavaScript_系列（22）——dojo(9)（表单、JsonRest的post方法，widget的使用思路）...
weixin_34112208的博客
05-29 89
（74）dojo的表单模块 插件：dojo/dom-form 参数：domForm 解释： 当我们需要像服务器提交很多内容时（比如很多个input输入框，还有一些单选按钮、多选按钮），我们必须将这些输入框的值变成一个对象（也许还要转为一个json字符串），在post的时候将其传递给服务器； 假如一个一个读过去，这也太傻了...
关于dojo的dialog和form的最佳用法
earthhour的专栏
10-16 1909
在使用dojo中dialog组件时，经常会遇到和form表单一同使用的情况，这时候就需要快速的建立表单,提交表单和修改表单项的功能。 关于dojo中组件的写法分为编程的方式和声明方式，声明方式快速但是有时候略显不灵活，编程的方式有时候又会很繁琐。 所以需要将两种方式结合起来使用 dialog声明使用编程方式，建立表单使用声明方式: 目录结构: myModule -|
dojo常用组件案例
qq_35372414的博客
05-15 1033
dojo作为一个JavaScript框架，使用量个人感觉很少，使用文档也不想jQuery那样全面。最近在做政府项目时，调用政府的本地地图，要用arcgis for js，而arcgis for js就是建立在dojo上开发的。于是研究了一下dojo。。。上代码： &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"...
二次封装dojo slider
hyhbyl的专栏
06-14 937
上次的二次封装timeslider，挺有意思，又来封装一个dojo的，样式还是用arcgis的。 实现更多功能，包括HorizontalSlider和VerticalSlider， 刻度的显示隐藏，标签的显示和隐藏，上刻度和下刻度的显示隐藏， 无序数显示刻度，标签图标的自由选择，大小选择。。。。更多功能大家看完code也可以自己慢慢加进去哈~~~ code有点长，先上slider的class
dojo表格操作的简单示例（建立表格）
weixin_34144848的博客
07-26 185
代码示例： <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <link rel="stylesheet" href="js/dojo/dojo/resou...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值