Tags
People
Badges
Help-
CORE FRAMEWORK
FEATURED COMPONENTS
-
RESOURCES
-
LEARN ZK
RESOURCES
Hello ZK Professionals
I m developing one application,in which i have created one zul named componets.zul....
i have created that zul for view propose only...
but i am unable to make all componets in readonly mode of that zul
so is there any way to set window component in readonly mode..or how should i make all componets of that window means textbox,doublebox,listbox
in readonly mode...?
plz help me ..i urgently need its solution....
An extended version of what 'jj' writes goes following.
only Pseudo code
// You can get a List of all components of that window.
List = window.getChildren();
for list.size() do
// look per reflection api in that component if the class
// have a method like setReadonly or setDisabled. If so do your stuff.
best
Stephan
Hi,
You can make a mask to cover the window to prevent the click, and then specify tabindex to prevent focus by Tab key,
please refer to the sample below:
<zk xmlns:w="client">
<script><![CDATA[
zk.afterLoad("zul.wnd", function () {
var _Winwgt = {};
zk.override(zul.wnd.Window.prototype, _Winwgt, {
bind_: function (desktop, skipper, after) {
var wgt = this;
_Winwgt.bind_.apply(this, arguments);
if (this._sclass == 'readOnlyWindow') {
createMask(wgt);
makeUnfoscableByTag(wgt);
}
},
doFocus_: function (evt) {
_Winwgt.doFocus_.apply(this, arguments);
if (this._sclass == 'readOnlyWindow') {
// check if any element still can be focused
jq(evt.domTarget).blur();
zk.log(' new focus');
zk.log(evt.domTarget);
}
}
});
function createMask (wgt) {
var cave = wgt.$n('cave'),
$cave = jq(cave),
offs = $cave.offset(),
mask = document.createElement("div"),
mstyle = mask.style;
document.body.appendChild(mask);
mstyle.height = $cave.outerHeight(true) + 'px';
mstyle.width = $cave.outerWidth(true) + 'px';
mstyle.position = 'absolute';
mstyle.left = offs.left + 'px';
mstyle.top = offs.top + 'px';
mstyle.zIndex = cave.zIndex + 1;
mask.innerHTML = ' ';
}
function makeUnfoscableByTag (wgt) {
var $wgt = jq(wgt),
inputs = $wgt.find('input'),
buttons = $wgt.find('button'),
as = $wgt.find('a'),
i;
for (i = 0; i < inputs.length; i++) {
inputs<i >.setAttribute('tabindex', -1);
}
for (i = 0; i < buttons.length; i++) {
buttons<i >.setAttribute('tabindex', -1);
}
for (i = 0; i < as.length; i++) {
as<i >.setAttribute('tabindex', -1);
}
}
});
]]></script>
<window title="test win" border="normal" sclass="readOnlyWindow">
<textbox value="test label" />
<button label="test button" />
<a href="http://www.zkoss.org" label="ZK" />
<image src="http://www.zkoss.org/zksandbox/img/battery.gif" />
<a href="http://www.zkoss.org" image="http://www.zkoss.org/zksandbox/img/battery.gif" />
</window>
<window title="test win" border="normal">
<textbox value="test label" />
<button label="test button" />
</window>
</zk>
Regards,
Ben
Asked: 2012-07-18 10:05:07 +0800
Seen: 249 times
Last updated: Jul 24 '12