jQuery MiniUI

 找回密码
 立即注册
查看: 17184|回复: 10
打印 上一主题 下一主题

SCRIPT5022: form element not null [复制链接]

Rank: 1

跳转到指定楼层
楼主
发表于 2013-12-20 10:29:06 |只看该作者 |倒序浏览
本帖最后由 LotusTree 于 2013-12-20 11:24 编辑

IE10的时候还好,能在10兼容模式和IE7下正常工作,昨天升级到11了就不行了。从6到11只有一个版本能搞定。。这也太挑剔了。所以还是决定改下代码。不会,来着求教!!!
这是报错的部分。
throw new Error("form element not null");mini.Form[lol11][ol1loo][O1O01o](this)};O1oO(mini.Form,o0OOoo,{el:null,getFields:function(){if(!this.el)return[];var $=mini.findControls(function($){if(!$.el||$.formField!=true)return false;if(l0O1O(this.el,$.el))return true;return false},this);return $}

这是页面代码
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4.     <title>部门管理</title>
  5.     <script src="../scripts/boot.js" type="text/javascript"></script>
  6. </head>
  7. <body>
  8. <form id="form1" action="" method="post">
  9. <!--操作部分-->
  10. <div style="width: 800px;">
  11.     <div class="mini-toolbar" style="border-bottom: 0; padding: 0px;">
  12.         <table style="width: 100%;">
  13.             <tr>
  14.                 <td style="width: 100%;">
  15.                     <a class="mini-button" iconcls="icon-add" onclick="add()">增加</a> <a class="mini-button"
  16.                         iconcls="icon-add" onclick="edit()">编辑</a> <a class="mini-button" iconcls="icon-remove"
  17.                             onclick="remove()">删除</a>
  18.                 </td>
  19.                
  20.             </tr>
  21.         </table>
  22.     </div>
  23. </div>
  24. <!--数据表-->
  25. <div id="datagrid1" class="mini-datagrid" style="width:800px; height: 280px;" allowresize="true"
  26.     url="../ashx/Handler.ashx?method=SearchDepartment" idfield="id" multiselect="true">
  27.     <div property="columns">
  28.         <div type="indexcolumn"  width="5"></div>
  29.         <div type="checkcolumn"  width="5">
  30.         </div>
  31.         <div field="DepId"  width="15" headeralign="center" allowsort="true">
  32.             部门编号</div>
  33.         <div field="DepName" width="15" headeralign="center" allowsort="true">
  34.             名称</div>
  35.         <div field="Remark"width="70" headeralign="center" allowsort="true">
  36.             备注</div>
  37.     </div>
  38. </div>
  39. </form>
  40. <script type="text/javascript">
  41.     mini.parse();

  42.     var grid = mini.get("datagrid1");
  43.     grid.load();


  44.     function add() {

  45.         mini.open({
  46.             url: bootPATH + "../Department/DepartmentWindow.htm",
  47.             title: "新增部门", width: 250, height: 150,
  48.             onload: function () {
  49.                 var iframe = this.getIFrameEl();
  50.                 var data = { action: "new" };
  51.                 iframe.contentWindow.SetData(data);
  52.             },
  53.             ondestroy: function (action) {
  54.                
  55.                 grid.reload();
  56.             }
  57.         });
  58.     }
  59.     function edit() {

  60.         var row = grid.getSelected();
  61.         if (row) {
  62.             mini.open({
  63.                 url: bootPATH + "../Department/DepartmentWindow.htm",
  64.                 title: "编辑部门", width: 250, height: 150,
  65.                 onload: function () {
  66.                     var iframe = this.getIFrameEl();
  67.                     var data = { action: "edit", id: row.DepId };
  68.                     iframe.contentWindow.SetData(data);

  69.                 },
  70.                 ondestroy: function (action) {
  71.                     grid.reload();

  72.                 }
  73.             });

  74.         } else {
  75.             alert("请选中一条记录");
  76.         }

  77.     }
  78.     function remove() {

  79.         var rows = grid.getSelecteds();
  80.         if (rows.length > 0) {
  81.             if (confirm("确定删除选中记录?")) {
  82.                 var ids = [];
  83.                 for (var i = 0, l = rows.length; i < l; i++) {
  84.                     var r = rows[i];
  85.                     ids.push(r.DepId);
  86.                 }
  87.                 var id = ids.join(',');
  88.                 grid.loading("操作中,请稍后......");
  89.                 $.ajax({
  90.                     url: "../ashx/Handler.ashx?method=RemoveDepartment&id=" + id,
  91.                     success: function (text) {
  92.                         alert(text);
  93.                         grid.reload();
  94.                     },
  95.                     error: function () {

  96.                     }
  97.                 });
  98.             }
  99.         } else {
  100.             alert("请选中一条记录");
  101.         }
  102.     }
  103.     function search() {
  104.         var key = mini.get("key").getValue();
  105.         grid.load({ key: key });
  106.     }
  107.     function onKeyEnter(e) {
  108.         search();
  109.     }
  110.   
  111.     function onMarriedRenderer(e) {
  112.         if (e.value == 1) return "是";
  113.         else return "否";
  114.     }
  115.   

  116. </script>
  117. </body>
  118. </html>
复制代码

Rank: 8Rank: 8

沙发
发表于 2013-12-20 10:31:47 |只看该作者
IE11我们还在测试调试中
IE的话只支持IE6-10的标准模式

Rank: 1

板凳
发表于 2013-12-20 10:39:22 |只看该作者
felt 发表于 2013-12-20 10:31
IE11我们还在测试调试中
IE的话只支持IE6-10的标准模式

不怀疑控件的问题,我有两个页面有添加编辑的选项,另一个如你所说,6-10都没问题。就是部门这个页面有问题。所以请教一下,上面的代码我是不是少写了什么。这个也面的代码基本上是康吹加威过来的。只是开始的时候我没写表单标签。后来加上去了还是不行。还有一个不同是另一个正常的页面跳转的添加和编辑是分开的页面,而这个是跳转到同一个页面。
                                                                                                                  小白求教!

Rank: 8Rank: 8

地板
发表于 2013-12-20 10:50:37 |只看该作者
LotusTree 发表于 2013-12-20 10:39
不怀疑控件的问题,我有两个页面有添加编辑的选项,另一个如你所说,6-10都没问题。就是部门这个页面有问 ...

你看下子页面的SetDate()方法有没有问题

Rank: 1

5#
发表于 2013-12-20 11:01:15 |只看该作者
本帖最后由 LotusTree 于 2013-12-20 11:25 编辑
felt 发表于 2013-12-20 10:50
你看下子页面的SetDate()方法有没有问题


刚刚说,IE7的浏览器模式可以搞定,那么代码上我就真看不出什么东西来了。面对浏览器的什么所谓解析方式我实在是太纯洁了!!!所以还是请高人您帮我看看吧!
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4.     <script src="../scripts/boot.js" type="text/javascript"></script>
  5.     <style type="text/css">
  6.         html, body
  7.         {
  8.             font-size: 12px;
  9.             padding: 0;
  10.             margin: 0;
  11.             border: 0;
  12.             height: 100%;
  13.             overflow: hidden;
  14.         }
  15.     </style>
  16.     <title>部门面板</title>
  17. </head>
  18. <body>
  19.     <form name="form1" method="post">
  20.     <input name="DepId" class="mini-hidden" />
  21.     <table style="table-layout: fixed;">
  22.         <tr>
  23.             <td style="width: 70px;">
  24.                 部门名称:
  25.             </td>
  26.             <td style="width: 150px;">
  27.                 <input name="DepName" class="mini-textbox" onvalidation="onChineseValidation" required="true" emptytext="请输入部门名称" vtype="maxLength:10" />
  28.             </td>
  29.         </tr>
  30.         <tr>
  31.             <td style="width: 70px;">
  32.                备注:
  33.             </td>
  34.             <td style="width: 150px;">
  35.                 <input   name="Remark" class="mini-textbox"  required="false"  vtype="maxLength:50" />
  36.             </td>
  37.         </tr>
  38.     </table>
  39.      <div style="text-align:center;padding:10px;">               
  40.             <a class="mini-button" onclick="onOk" style="width:60px;margin-right:20px;">确定</a>      
  41.             <a class="mini-button" onclick="onCancel" style="width:60px;">取消</a>      
  42.         </div>
  43.     </form>
  44. </body>
  45. <script type="text/javascript">
  46.     mini.parse();
  47.     var form = new mini.Form("form1");

  48.     function SaveData() {
  49.         var o = form.getData();

  50.         form.validate();
  51.         if (form.isValid() == false) return;

  52.         var json = mini.encode([o]);
  53.         $.ajax({
  54.             url: "../ashx/Handler.ashx?method=SaveDepartment",
  55.             type: 'post',
  56.             data: { data: json },
  57.             cache: false,
  58.             success: function (text) {
  59.                 alert(text);
  60.                 CloseWindow("save");
  61.             },
  62.             error: function (jqXHR, textStatus, errorThrown) {
  63.                 alert(jqXHR.responseText);
  64.                 CloseWindow();
  65.             }
  66.         });
  67.     }
  68.     function SetData(data) {
  69.         if (data.action == "edit") {
  70.             //跨页面传递的数据对象,克隆后才可以安全使用
  71.             data = mini.clone(data);

  72.             $.ajax({
  73.                 url: "../ashx/Handler.ashx?method=GetDepartment&id=" + data.id,
  74.                 cache: false,
  75.                 success: function (text) {
  76.                     var o = mini.decode(text);
  77.                     form.setData(o);
  78.                     form.setChanged(false);
  79.                 }
  80.             });
  81.         }
  82.     }
  83.     function GetData() {
  84.         var o = form.getData();
  85.         return o;
  86.     }
  87.     function CloseWindow(action) {
  88.         if (action == "close" && form.isChanged()) {
  89.             if (confirm("数据被修改了,是否先保存?")) {
  90.                 return false;
  91.             }
  92.         }
  93.         if (window.CloseOwnerWindow) return window.CloseOwnerWindow(action);
  94.         else window.close();
  95.     }
  96.     function onOk(e) {
  97.         SaveData();
  98.     }
  99.     function onCancel(e) {
  100.         CloseWindow("cancel");
  101.     }

  102.     //验证
  103.     function onChineseValidation(e) {
  104.         if (e.isValid) {
  105.             if (isChinese(e.value) == false) {
  106.                 e.errorText = "必须输入中文";
  107.                 e.isValid = false;
  108.             }
  109.         }
  110.     }
  111.     /* 是否汉字 */
  112.     function isChinese(v) {
  113.         var re = new RegExp("^[\u4e00-\u9fa5]+$");
  114.         if (re.test(v)) return true;
  115.         return false;
  116.     }

  117. </script>
  118. </html>
复制代码

Rank: 8Rank: 8

6#
发表于 2013-12-20 11:09:15 |只看该作者
LotusTree 发表于 2013-12-20 11:01
刚刚说,IE7的浏览器模式可以搞定,那么代码上我就真看不出什么东西来了。面对浏览器的什么所谓解析方式 ...

你运行哪个会有问题?
另外上传页面可以用高级模式打包的

Rank: 1

7#
发表于 2013-12-20 11:19:23 |只看该作者
本帖最后由 LotusTree 于 2013-12-20 11:21 编辑
felt 发表于 2013-12-20 11:09
你运行哪个会有问题?
另外上传页面可以用高级模式打包的


从这个页面
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4.     <title>部门管理</title>
  5.     <script src="../scripts/boot.js" type="text/javascript"></script>
  6. </head>
  7. <body>
  8. <form id="form1" action="" method="post">
  9. <!--操作部分-->
  10. <div style="width: 800px;">
  11.     <div class="mini-toolbar" style="border-bottom: 0; padding: 0px;">
  12.         <table style="width: 100%;">
  13.             <tr>
  14.                 <td style="width: 100%;">
  15.                     <a class="mini-button" iconcls="icon-add" onclick="add()">增加</a> <a class="mini-button"
  16.                         iconcls="icon-add" onclick="edit()">编辑</a> <a class="mini-button" iconcls="icon-remove"
  17.                             onclick="remove()">删除</a>
  18.                 </td>
  19.                
  20.             </tr>
  21.         </table>
  22.     </div>
  23. </div>
  24. <!--数据表-->
  25. <div id="datagrid1" class="mini-datagrid" style="width:800px; height: 280px;" allowresize="true"
  26.     url="../ashx/Handler.ashx?method=SearchDepartment" idfield="id" multiselect="true">
  27.     <div property="columns">
  28.         <div type="indexcolumn"  width="5"></div>
  29.         <div type="checkcolumn"  width="5">
  30.         </div>
  31.         <div field="DepId"  width="15" headeralign="center" allowsort="true">
  32.             部门编号</div>
  33.         <div field="DepName" width="15" headeralign="center" allowsort="true">
  34.             名称</div>
  35.         <div field="Remark"width="70" headeralign="center" allowsort="true">
  36.             备注</div>
  37.     </div>
  38. </div>
  39. </form>
  40. <script type="text/javascript">
  41.     mini.parse();

  42.     var grid = mini.get("datagrid1");
  43.     grid.load();


  44.     function add() {

  45.         mini.open({
  46.             url: bootPATH + "../Department/DepartmentWindow.htm",
  47.             title: "新增部门", width: 250, height: 150,
  48.             onload: function () {
  49.                 var iframe = this.getIFrameEl();
  50.                 var data = { action: "new" };
  51.                 iframe.contentWindow.SetData(data);
  52.             },
  53.             ondestroy: function (action) {
  54.                
  55.                 grid.reload();
  56.             }
  57.         });
  58.     }
  59.     function edit() {

  60.         var row = grid.getSelected();
  61.         if (row) {
  62.             mini.open({
  63.                 url: bootPATH + "../Department/DepartmentWindow.htm",
  64.                 title: "编辑部门", width: 250, height: 150,
  65.                 onload: function () {
  66.                     var iframe = this.getIFrameEl();
  67.                     var data = { action: "edit", id: row.DepId };
  68.                     iframe.contentWindow.SetData(data);

  69.                 },
  70.                 ondestroy: function (action) {
  71.                     grid.reload();

  72.                 }
  73.             });

  74.         } else {
  75.             alert("请选中一条记录");
  76.         }

  77.     }
  78.     function remove() {

  79.         var rows = grid.getSelecteds();
  80.         if (rows.length > 0) {
  81.             if (confirm("确定删除选中记录?")) {
  82.                 var ids = [];
  83.                 for (var i = 0, l = rows.length; i < l; i++) {
  84.                     var r = rows[i];
  85.                     ids.push(r.DepId);
  86.                 }
  87.                 var id = ids.join(',');
  88.                 grid.loading("操作中,请稍后......");
  89.                 $.ajax({
  90.                     url: "../ashx/Handler.ashx?method=RemoveDepartment&id=" + id,
  91.                     success: function (text) {
  92.                         alert(text);
  93.                         grid.reload();
  94.                     },
  95.                     error: function () {

  96.                     }
  97.                 });
  98.             }
  99.         } else {
  100.             alert("请选中一条记录");
  101.         }
  102.     }
  103.     function search() {
  104.         var key = mini.get("key").getValue();
  105.         grid.load({ key: key });
  106.     }
  107.     function onKeyEnter(e) {
  108.         search();
  109.     }
  110.   
  111.     function onMarriedRenderer(e) {
  112.         if (e.value == 1) return "是";
  113.         else return "否";
  114.     }
  115.   

  116. </script>
  117. </body>
  118. </html>
复制代码
到这个页面
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4.     <script src="../scripts/boot.js" type="text/javascript"></script>
  5.     <style type="text/css">
  6.         html, body
  7.         {
  8.             font-size: 12px;
  9.             padding: 0;
  10.             margin: 0;
  11.             border: 0;
  12.             height: 100%;
  13.             overflow: hidden;
  14.         }
  15.     </style>
  16.     <title>部门面板</title>
  17. </head>
  18. <body>
  19.     <form name="form1" method="post">
  20.     <input name="DepId" class="mini-hidden" />
  21.     <table style="table-layout: fixed;">
  22.         <tr>
  23.             <td style="width: 70px;">
  24.                 部门名称:
  25.             </td>
  26.             <td style="width: 150px;">
  27.                 <input name="DepName" class="mini-textbox" onvalidation="onChineseValidation" required="true" emptytext="请输入部门名称" vtype="maxLength:10" />
  28.             </td>
  29.         </tr>
  30.         <tr>
  31.             <td style="width: 70px;">
  32.                备注:
  33.             </td>
  34.             <td style="width: 150px;">
  35.                 <input   name="Remark" class="mini-textbox"  required="false"  vtype="maxLength:50" />
  36.             </td>
  37.         </tr>
  38.     </table>
  39.      <div style="text-align:center;padding:10px;">               
  40.             <a class="mini-button" onclick="onOk" style="width:60px;margin-right:20px;">确定</a>      
  41.             <a class="mini-button" onclick="onCancel" style="width:60px;">取消</a>      
  42.         </div>
  43.     </form>
  44. </body>
  45. <script type="text/javascript">
  46.     mini.parse();
  47.     var form = new mini.Form("form1");

  48.     function SaveData() {
  49.         var o = form.getData();

  50.         form.validate();
  51.         if (form.isValid() == false) return;

  52.         var json = mini.encode([o]);
  53.         $.ajax({
  54.             url: "../ashx/Handler.ashx?method=SaveDepartment",
  55.             type: 'post',
  56.             data: { data: json },
  57.             cache: false,
  58.             success: function (text) {
  59.                 alert(text);
  60.                 CloseWindow("save");
  61.             },
  62.             error: function (jqXHR, textStatus, errorThrown) {
  63.                 alert(jqXHR.responseText);
  64.                 CloseWindow();
  65.             }
  66.         });
  67.     }
  68.     function SetData(data) {
  69.         if (data.action == "edit") {
  70.             //跨页面传递的数据对象,克隆后才可以安全使用
  71.             data = mini.clone(data);

  72.             $.ajax({
  73.                 url: "../ashx/Handler.ashx?method=GetDepartment&id=" + data.id,
  74.                 cache: false,
  75.                 success: function (text) {
  76.                     var o = mini.decode(text);
  77.                     form.setData(o);
  78.                     form.setChanged(false);
  79.                 }
  80.             });
  81.         }
  82.     }
  83.     function GetData() {
  84.         var o = form.getData();
  85.         return o;
  86.     }
  87.     function CloseWindow(action) {
  88.         if (action == "close" && form.isChanged()) {
  89.             if (confirm("数据被修改了,是否先保存?")) {
  90.                 return false;
  91.             }
  92.         }
  93.         if (window.CloseOwnerWindow) return window.CloseOwnerWindow(action);
  94.         else window.close();
  95.     }
  96.     function onOk(e) {
  97.         SaveData();
  98.     }
  99.     function onCancel(e) {
  100.         CloseWindow("cancel");
  101.     }

  102.     //验证
  103.     function onChineseValidation(e) {
  104.         if (e.isValid) {
  105.             if (isChinese(e.value) == false) {
  106.                 e.errorText = "必须输入中文";
  107.                 e.isValid = false;
  108.             }
  109.         }
  110.     }
  111.     /* 是否汉字 */
  112.     function isChinese(v) {
  113.         var re = new RegExp("^[\u4e00-\u9fa5]+$");
  114.         if (re.test(v)) return true;
  115.         return false;
  116.     }

  117. </script>
  118. </html>
复制代码
删除可以,添加和修改都不行

Rank: 8Rank: 8

8#
发表于 2013-12-20 13:26:00 |只看该作者
LotusTree 发表于 2013-12-20 11:19
从这个页面到这个页面删除可以,添加和修改都不行

var form = new mini.Form("form1");   // 你的代码
莫非是这个var form = new mini.Form("#form1");?
压缩打包页面上传,不要直接贴

Rank: 1

9#
发表于 2013-12-20 14:40:01 |只看该作者
felt 发表于 2013-12-20 13:26
var form = new mini.Form("form1");   // 你的代码
莫非是这个var form = new mini.Form("#form1");?
压 ...

算了,我再研究研究吧!我这贴代码不也是为了方便其他看客么,要是人家和我一个问题都省得下载了。。。。。

Rank: 1

10#
发表于 2017-1-24 09:58:12 |只看该作者
LotusTree 发表于 2013-12-20 14:40
算了,我再研究研究吧!我这贴代码不也是为了方便其他看客么,要是人家和我一个问题都省得下载了。。。。 ...

楼主你好,我最近也遇到了 Form Element is not null 的问题了,你还记得你是什么原因导致的吗?

Archiver|普加软件

GMT+8, 2024-5-18 18:33 , Processed in 1.031488 second(s), 9 queries .

Powered by Discuz! X2

© 2001-2011 Comsenz Inc.

回顶部