提交 c0c40d22 编写于 作者: M MaxKey

remove json2form

上级 7567c195
/* jQuery json2form Plugin
* version: 1.0 (2011-03-01)
*
* Copyright (c) 2011, Crystal, shimingxy@163.com
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
* Date: 2011-03-01 rev 1
*/
;(function ($) {
$.json2form = $.json2form||{};
$.fn.json2form = function(config ) {
var config=$.extend({
url :null,
elem :this.attr("id"),
type :'POST'
}, config || {});
if(config.url){
$.ajax({type: config.type,url: config.url,data:$.extend({json2form:config.elem},config.data||{}),dataType: "json",async: false,
success: function(data){
config.data=data;
}
});
}
if(!$("#"+config.elem).attr("loadedInit")){//init checkbox radio and select element ,label
if(config.data.init){
for (var elem in config.data.init){
var arrayData=config.data.init[elem];
if($("#"+config.elem+" input[name='"+elem+"']")){
var elemType=$("#"+config.elem+" input[name='"+elem+"']").attr("type");
var elemName=$("#"+config.elem+" input[name='"+elem+"']").attr("name");
var initElem=$("#"+config.elem+" input[name='"+elem+"']");
switch(elemType){
case "checkbox":
case "radio":
for (var initelem in arrayData){
initElem.after('<input type="'+elemType+'" name="'+elemName+'" value="'+arrayData[initelem].value+'" />'+arrayData[initelem].display);
}
initElem.remove();
break;
}
}
if($("#"+config.elem+" select[name='"+elem+"']")){
for (var initelem in arrayData){
$("#"+config.elem+" select[name='"+elem+"']").append("<option value='"+arrayData[initelem].value+"'>"+arrayData[initelem].display+"</option>");
}
}
}
}
if(config.data.label){//label
$("#"+config.elem+" label").each(function(){
var labelFor=$(this).attr("for");
if(config.data.label[labelFor]){
$(this).html(config.data.label[labelFor]);
}
});
}
}
if(config.data){//input text password hidden button reset submit checkbox radio select textarea
$("#"+config.elem+" input,select,textarea").each(function(){
var elemType=$(this).attr("type")==undefined?this.type:$(this).attr("type");
var elemName=$(this).attr("name");
var elemData=config.data[elemName];
if(!$("#"+config.elem).attr("loadedInit")&&$(this).attr("loadurl")){
switch(elemType){
case "checkbox":
case "radio":
case "select":
case "select-one":
case "select-multiple":{
var _this =this;
$.ajax({type: config.type,url: $(this).attr("loadurl"),dataType: "json",async: false,success: function(data){
if(elemType=="select"||elemType=="select-one"||elemType=="select-multiple"){
$(_this).empty();
}
for (var elem in data){
if(elemType=="select"||elemType=="select-one"||elemType=="select-multiple"){
$(_this).append("<option value='"+data[elem].value+"'>"+data[elem].display+"</option>");
}else{
$(_this).after('<input type="'+elemType+'" name="'+elemName+'" value="'+data[elem].value+'" />'+data[elem].display);
}
}
if(elemType=="checkbox"||elemType=="radio")$(_this).remove();
}
});
break;
}
}
}
if(elemData){
switch(elemType){
case undefined:
case "text":
case "password":
case "hidden":
case "button":
case "reset":
case "textarea":
case "submit":{
if(typeof(elemData)=="string"){
$(this).val(elemData.toUpperCase()=="NULL"?"":elemData);
}else{
$(this).val(elemData+"");
}
break;
}
case "checkbox":
case "radio":{
$(this).attr("checked",false);
if(elemData.constructor==Array){//checkbox multiple value is Array
for (var elem in elemData){
if(elemData[elem]==$(this).val()){
$(this).attr("checked",true);
}
}
}else{//radio or checkbox is a string single value
if(elemData==$(this).val()){
$(this).attr("checked",true);
}
}
break;
}
case "select":
case "select-one":
case "select-multiple":{
$(this).find("option:selected").attr("selected",false);
if(elemData.constructor==Array){
for (var elem in elemData){
$(this).find("option[value='"+elemData[elem]+"']").attr("selected",true);
}
}else{
$(this).find("option[value='"+elemData+"']").attr("selected",true);
}
break;
}
}
}
});
}
$("#"+config.elem).attr("loadedInit","true");//loadedInit is true,next invoke not need init checkbox radio and select element ,label
};
})(jQuery);
\ No newline at end of file
<html>
<head>
<title>Json2form Demo</title>
<script src="jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="json2form.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
var objdata ={
txt:'文字输入',
pwd:'密码输入',
hd:'隐藏',
are:'多行文字json2form',
btn:'按钮',
rt:'重置按钮',
sb:'提交按钮',
rad:'',
chk:'chk1',
chk:['美国','中国'],
sl:['法国','日本'],
label:{
txt:'自定义文本框标签',
sl :'自定义下拉列表标签'
},
init:{
chk444:[{"value":"comm","display":"一般资源"},{"value":"system","display":"系统"},{"value":"page","display":"页面"},{"value":"url","display":"链接"},{"value":"model","display":"模块"},{"value":"data","display":"数据"}],
chk555:[{"value":"comm","display":"一般资源"},{"value":"system","display":"系统"},{"value":"page","display":"页面"},{"value":"url","display":"链接"},{"value":"model","display":"模块"},{"value":"data","display":"数据"}],
slinit:[{"value":"comm","display":"一般资源"},{"value":"system","display":"系统"},{"value":"page","display":"页面"},{"value":"url","display":"链接"},{"value":"model","display":"模块"},{"value":"data","display":"数据"}]
}
};
$("#json2form").json2form({data:objdata});
$("#json2form").json2form({data:objdata});
});
</script>
<style type="text/css">
table, td {
border:1px solid #cccccc;
border-collapse:collapse;
}
</style>
</head>
<body>
<div align="center">
<form id="json2form" name="json2form">
<table>
<tr>
<td colspan="2" bgcolor="#FFFFFF"><div align="center"><strong>Aduby json2formDemo</strong></div></td>
</tr>
<tr>
<td>1. text(文本框)</td>
<td>
<label for="txt">1 text(文本框)</label>
<input type="text" id="txt" name="txt" value="输入内容" />
</td>
</tr>
<tr>
<td>2. password(密码框)</td>
<td>
<input type="password" id="pwd" name="pwd" value="值" />
</td>
</tr>
<tr>
<td>3. hidden(隐藏域)</td>
<td>
<input type="hidden" id="hd" name="hd" value="值"/>
</td>
</tr>
<tr>
<td>4. checkbox(复选框)</td>
<td>
<input type="checkbox" id="chk1" name="chk" value="中国" checked="checked" />中国<label for="chk1"></label>
<input type="checkbox" id="chk2" name="chk" value="美国" />美国<label for="chk2"></label>
</td>
</tr>
<tr>
<td>5. checkbox(动态复选框)</td>
<td>
<input type="checkbox" id="chk444" name="chk444" value="动态复选框" />
</td>
</tr>
<tr>
<td>6. radion(单选按钮)</td>
<td>
<input type="radio" id="rd1" name="rad" value="男" checked="checked" />
<input type="radio" id="rd2" name="rad" value="女" />
</td>
</tr>
<tr>
<td>7. radion(动态单选按钮)</td>
<td>
<input type="radio" id="chk555" name="chk555" value="动态单选按钮" />
</td>
</tr>
<tr>
<td>8. file(文件)</td>
<td>
<input type="file" id="fl" name="file" value="呵呵" size="20" />
</td>
</tr>
<tr>
<td>9. textare(文本域)</td>
<td>
多行文本输入框。<br>
<textarea id="are" name="are" cols="10" rows="10" ></textarea>
</td>
</tr>
<tr>
<td>10. select(下拉列表框)</td>
<td>
用户选择的下拉列表。<br>
<label for="sl">下拉列表</label><br>
<select id="sl" name="sl" multiple="multiple" >
<option id="op1" value="美国" selected="selected">美国</option>
<option id="op2" value="中国">中国</option>
<option id="op3" value="日本">日本</option>
<option id="op4" value="法国">法国</option>
</select>
</td>
</tr>
<tr>
<td>11. select(动态下拉列表框)</td>
<td>
<select id="slinit" name="slinit" ><option value="null">动态下拉列表框</option> </select>
</td>
</tr>
<tr>
<td>12. button(普通按钮)</td>
<td>
<input type="button" id="btn" name="btn" value="普通按钮">
</td>
</tr>
<tr>
<td>13. reset(重置按钮)</td>
<td>
<input type="reset" id="rt" name="rt" value="重置按钮" />
</td>
</tr>
<tr>
<td>14. submit(提交按钮)</td>
<td>
<input type="submit" id="sb" name="sb" value="提交按钮" />
</td>
</tr>
</table>
</form>
</div>
</body>
</html>
\ No newline at end of file
/* jQuery json2form Plugin
* version: 1.0 (2011-3-01)
*
* Copyright (c) 2011, Crystal, shimingxy@163.com
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
* Date: 2011-3-01 rev 1
*/
;(function ($) {
$.json2form = $.json2form||{};
$.fn.json2form = function(config ) {
var config=$.extend({
url : null,//remote url for ajax data
elem : this.attr("id"),//id
type : "POST",//remote data method type ,GET or POST default is POST
}, config || {});
if(config.url){
$.ajax({type: config.type,url: config.url,dataType: "json",async: false,
success: function(data){
config.data=data;
}
});
}
alert();
if(config.init){
//init
for (var elem in config.init){
if(typeof(elem) != 'function'){
var arrayObject=config.init[elem];
if($("#"+config.elem+" input[name='"+elem+"']")){
var elemtype=$("#"+config.elem+" input[name='"+elem+"']").attr("type");
var elemName=$("#"+config.elem+" input[name='"+elem+"']").attr("name");
var initElem=$("#"+config.elem+" input[name='"+elem+"']");
switch(elemtype){
case "checkbox":
for (var initelem in arrayObject){
initElem.after('<input type="checkbox" name="'+elemName+'" value="'+arrayObject[initelem].value+'" />'+arrayObject[initelem].display);
}
initElem.remove();
break;
case "radio":
for (var initelem in arrayObject){
initElem.after('<input type="radio" name="'+elemName+'" value="'+arrayObject[initelem].value+'" />'+arrayObject[initelem].display);
}
initElem.remove();
break;
}
}
if($("#"+config.elem+" select[name='"+elem+"']")){
for (var initelem in arrayObject){
$("#"+config.elem+" select[name='"+elem+"']").append("<option value='"+arrayObject[initelem].value+"'>"+arrayObject[initelem].display+"</option>");
}
}
}
}
}
if(config.data){
//input text password hidden button reset submit checkbox radio
$("#"+config.elem+" input").each(function(){
var elemtype=$(this).attr("type");
if($(this).attr("action")){
var elemName=$(this).attr("name");
switch(elemtype){
case "checkbox":
var checkbox =this;
$.ajax({type: "POST",url: $(this).attr("action"),dataType: "json",async: false,success: function(data){
for (var elem in data){
$(checkbox).after('<input type="checkbox" name="'+elemName+'" value="'+data[elem].value+'" />'+data[elem].display);
}
$(checkbox).remove();
}
});
break;
case "radio":
var radio =this;
$.ajax({type: "POST",url: $(this).attr("action"),dataType: "json",async: false,success: function(data){
for (var elem in data){
$(radio).after('<input type="radio" name="'+elemName+'" value="'+data[elem].value+'" />'+data[elem].display);
}
$(radio).remove();
}
});
break;
}
}
switch(elemtype){
case "text":
case "password":
case "hidden":
case "button":
case "reset":
case "submit":{
for (var elem in config.data){
if(typeof(elem) != 'function'){
if(($(this).attr("name"))==elem){
$(this).val(config.data[elem]);
}
}
}
break;
}
case "checkbox":
case "radio":{
for (var elem in config.data){
if(typeof(elem) != 'function'){
if(($(this).attr("name"))==elem&&($(this).val())==$(this).val()){
$(this).attr("checked",true);
}
}
}
break;
}
}
});
//select
$("#"+config.elem+" select").each(function(){
var select =this;
if($(this).attr("action")){
$.ajax({type: "POST",url: $(this).attr("action"),dataType: "json",async: false,success: function(data){
for (var elem in data){
$(select).append("<option value='"+data[elem].value+"'>"+data[elem].display+"</option>");
}
}
});
}
for (var elem in config.data){
if(typeof(elem) != 'function'){
if(($(this).attr("name"))==elem){
$(this).val(config.data[elem]);
}
}
}
});
//textarea
$("#"+config.elem+" textarea").each(function(){
for (var elem in config.data){
if(typeof(elem) != 'function'){
if(($(this).attr("name"))==elem){
$(this).val(config.data[elem]);
}
}
}
});
}
if(config.label){
//label
$("#"+config.elem+" label").each(function(){
for (var elem in config.label){
if(typeof(elem) != 'function'){
if(($(this).attr("for"))==elem){
$(this).html(config.label[elem]);
}
}
}
});
}
};
})(jQuery);
\ No newline at end of file
......@@ -28,7 +28,6 @@
<script src ="<@base />/static/jquery/jquery.cookie.js" type="text/javascript" ></script>
<#-- form -->
<script src ="<@base />/static/jquery/jquery.form.js" type="text/javascript" ></script>
<script src ="<@base />/static/jquery/json2form/json2form.js" type="text/javascript" ></script>
<#-- blockUI -->
<script src ="<@base />/static/jquery/jquery.blockUI.js" type="text/javascript" ></script>
<#-- serializeObject -->
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册