[jqgrid] 单元格编辑选项的3个问题( setColProp, editoptions )

[Julian Wong]

这些问题都在：webcontent/ralasafe/query/designTables.jsp里面，我今天下午将代码提交了，大家可以下载，在本地重现。

问题1：动态设置单元格的编辑选项（使用下拉框），下拉框里面莫名其妙的多了个选项“Undefined”。

场景重现：

1. 打开：http://localhost:8080/rs/ralasafe/query/designQuery?oper=designQuery&queryId=5  （假设你的web context是rs）
2. 在mapping class文本框里面输入：org.ralasafe.demo.Company， 回车或者点击网页其他任何地方
3. 在Property [Java Type]列里面，单击看看，下拉框里面多了个Undefined
4. 在mapping class文本框里面输入：org.ralasafe.demo.Employee，也是一样

问题2：修改完值后，当点击其他行的时候，怎样让刚才的行，正常显示内容呢？我的意思是：单元格就不要显示下拉框了，直接显示刚才设置的值就可以了。

问题3：为什么我将select tab html内容copy下来，然后单独显示效果和在tab里面不同呢？我觉得在tab里面显示的比较丑。

但，我没有查到是css文件路径不对（难道是我查的方式不对？？？？）

--

Julian Wong

汪金保

Founder and Team Leader

Open Source Access Control Middleware
http://www.ralasafe.org

http://twitter.com/ralasafe

http://t.sina.com.cn/ralasafe

[Leegorous]

undefined 的问题是因为 editoptions 的值最后多了个分号 ";"

designTables.jsp line 219 用下面的写法更加方便 + 安全

var text=[];

for( var i=0; i<types.length; i++ ) {

var value=properties[i]+" ["+types[i]+"]";

text.push(value+":"+value);

}

text = text.join(";");

2011/1/3 Julian Wong <rala...@gmail.com>

--
You received this message because you are subscribed to the Google Groups "Ralasafe dev" group.
To post to this group, send email to ralasa...@googlegroups.com.
To unsubscribe from this group, send email to ralasafe-dev...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/ralasafe-dev?hl=en.

--
猛击 http://leegorous.net/blog/ 吧！

[Julian Wong]

嘿嘿，按照

Leegorous

 方案，问题3迎刃而解。THX。

2011/1/3 Leegorous <leeg...@gmail.com>

[Julian Wong]

看到不少jqgrid的editRow教程，有这么一行：

if(id && id!==lastSelectRowId){

jQuery('#mappingColumns').restoreRow( lastSelectRowId );

jQuery('#mappingColumns').editRow( id,true );

lastSelectRowId=id;

}

这么一行能够让该行的编辑状态消除，但数据也恢复了最原始模样，编辑数据也随着小时了

2011/1/3 Julian Wong <rala...@gmail.com>

[Leegorous]

修改完值之後，點擊其它行切換回非編輯狀態，可以

                        if(id && id!==lastSelectRowId){

   jQuery('#mappingColumns').jqGrid('restoreRow',lastSelectRowId);

   //jQuery('#mappingColumns').jqGrid('saveRow',lastSelectRowId, checksave);

jQuery('#mappingColumns').jqGrid('editRow',id,true);

lastSelectRowId=id;

}

可以參考 jqGrid saveRow 的配置說明，有服務器協作的部分，我沒有在代碼裡面直接嘗試。

BTW, 如果像恢復到原先的狀態，是用 restoreRow

另外不同明白問題3 中所指的 css 是什麼狀況。用 tabs 加載的方式並不是用 iframe 的方式，而是直接 ajax 內容並添加到頁面中。tab 頁中的 css 並沒有加載的。同時你可以看到多了幾個加載 jquery 和 jquery-ui 的庫腳本動作，雖然最終效果看起來沒什麼影響，但這些都是多餘的。

另外，如果可以的話，在開發階段，引入的 jquery 庫文件最好的未經壓縮的，調試起來比較好方便一點。

2011/1/3 Julian Wong <rala...@gmail.com>

[Julian Wong]

采用这句话就可以了：

jQuery('#mappingColumns').saveRow( lastSelectRowId, false, 'clientArray' );

我目前采用的方式是：全部编辑完毕后，才保存到后台。

2011/1/3 Leegorous <leeg...@gmail.com>

--
<a href="http://www.ralasafe.org">Ralasafe web site</a>
<a href="http://groups.google.com/group/ralasafe-dev?hl=en?hl=en">Visit group</a>
<a href="ralasafe-dev...@googlegroups.com">Unsubscribe</a>

[Julian Wong]

结合我刚才做了详细比较，做了一个小实验，对第三个问题再解释一下。

比如：先打开这个URL   http://localhost:8080/rs/ralasafe/query/queryMng

然后：修改 webconent/ralasafe/query/index.jsp里面这么CSS引用两行调换一下位置。形成如下：

<link rel="stylesheet" type="text/css" media="screen" href="../css/flick/jquery-ui-1.8.5.custom.css" />

<link rel="stylesheet" type="text/css" media="screen" href="../css/ui.jqgrid.css" />

保存后，刷新刚才URL。发现字体变换了。

但：问题是：我将webconent/ralasafe/query/designQuery.jsp里面的CSS调换位置，没有效果。清空浏览器COOKIE等后，还是没有作用。

2011/1/3 Julian Wong <rala...@gmail.com>

[Leegorous]

嗯，我明白了。

这里是因为 designQuery 里面是有个嵌套，tabs 里面套 grid，触发了 /css/flick/jquery-ui-1.8.5.custom.css line 60 的效果。

看了下 jquery-ui css，它的字体是以 em 作单位的。但是没有定义基准值，也就是用浏览器的默认值。

这里为了使各个浏览器里面的表现比较一致，可以自行设定这个基准值。

在 link css 之前加入这个，或者，我觉得这里应该有一份统一的 css 修订，例如包含一些 css reset 之类的东西。

<style type="text/css">

body {

    font-size: 0.75em;  /* 你也可以使用绝对值 12px，0.75em 视觉上接近 12px */

}

</style>

是要这样的效果么？

2011/1/3 Julian Wong <rala...@gmail.com>

--
猛击 http://leegorous.net/blog/ 吧！

[Julian Wong]

好的。是这效果！

那么，这个topic问题全解决了！

2011/1/4 Leegorous <leeg...@gmail.com>