移动应用页面可以确定哪个移动应用页面调用它以及选择了什么?
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了移动应用页面可以确定哪个移动应用页面调用它以及选择了什么?相关的知识,希望对你有一定的参考价值。
我的问题跟踪应用程序有几个类别(客户端,AssignedTo,模块/类型,优先级,状态,构建等)。有几个视图有两个分类列(EG:Client和AssignedTo,Client and Module,AssignedTo和Priority,PPriority和Client等)。
我正在使用XPages Mobile控件实现移动页面。我想简化一些事情,以便移动主页上的视图选择驱动到一个页面,用于选择适当的第一类别,然后驱动到用于选择第二类别的页面。我不知道的是,一旦选择了第一个类别值,第二个类别选择页面是打开的,之前选择的值是什么?
到目前为止,这是我的示例页面:
<xe:singlePageApp
id="singlePageApp1"
selectedPageName="mhome">
<xe:appPage
id="appPage1"
pageName="mhome">
<xe:djxmHeading
id="djxmHeading1"
label="Home">
</xe:djxmHeading>
<xe:djxmRoundRectList
id="djxmRoundRectList1">
<xe:djxmLineItem
id="djxmLineItem1"
label="Issues by Client By Assigned To"
moveTo="selectClient1">
</xe:djxmLineItem>
<xe:djxmLineItem
id="djxmLineItem2"
label="Issues by Client By Module"
moveTo="selectClient2">
</xe:djxmLineItem>
</xe:djxmRoundRectList>
</xe:appPage>
<xe:appPage
id="appPage2"
pageName="selectClient1"
resetContent="true">
<xe:djxmHeading
id="djxmHeading2"
label="Select Client"
moveTo="mhome"
back="back">
</xe:djxmHeading>
<xp:panel>
<xp:this.data>
<xp:dominoView
var="view1"
viewName="ByClientAssignedTo">
</xp:dominoView>
</xp:this.data>
<xe:djxmRoundRectList
id="djxmRoundRectList2">
<xp:repeat
id="repeat1"
rows="30"
value="#{javascript:view1.getColumnValues(0);}"
var="client"
indexVar="clidx">
<xe:djxmLineItem
id="djxmLineItem3"
label="#{javascript:client}"
moveTo="selectAssignedTo1">
</xe:djxmLineItem>
</xp:repeat>
</xe:djxmRoundRectList>
</xp:panel>
</xe:appPage>
<xe:appPage
id="appPage3"
pageName="selectClient2"
resetContent="true">
<xe:djxmHeading
id="djxmHeading3"
label="Select Client (2)"
moveTo="mhome"
back="back">
</xe:djxmHeading>
<xp:panel>
<xp:this.data>
<xp:dominoView
var="view1"
viewName="ByClientAssignedTo">
</xp:dominoView>
</xp:this.data>
<xe:djxmRoundRectList
id="djxmRoundRectList3">
<xp:repeat
id="repeat2"
rows="30"
value="#{javascript:view1.getColumnValues(0)}"
var="client"
indexVar="clidx">
<xe:djxmLineItem
id="djxmLineItem4"
label="#{javascript:client}"
moveTo="selectType1">
</xe:djxmLineItem>
</xp:repeat>
</xe:djxmRoundRectList>
</xp:panel>
</xe:appPage>
<xe:appPage
id="appPage4"
pageName="selectAssignedTo1"
resetContent="true">
<xe:djxmHeading
id="djxmHeading4"
back="back"
label="Select Assigned To"
moveTo="selectClient1">
</xe:djxmHeading>
<xp:text
escape="true"
id="computedField1">
<xp:this.value><![CDATA[#{javascript:"What was selected on the previous page?"}]]></xp:this.value>
</xp:text>
</xe:appPage>
</xe:singlePageApp>
技巧1: djxmLineItem事件支持onClick事件事件,尽管在Xpages(我找到)中没有它的文档。它在dojox.mobile ListItem下记录为dojo的一部分。
如有必要,为另一个控件创建onClick事件,并复制xe:djxmLineItem标记下的代码。您可以使用延迟评估(#)来访问indexVar,以识别单击重复内部的ListItem。
添加事件处理程序的一个主要缺点是您必须在目标页面内的某些内容上触发部分刷新,以便呈现其内容。这反过来意味着必须预先加载页面内容才能使刷新目标可用。这很可能是当前移动控件实现中的一个错误,但它可能是一个痛苦的!
技术2: 跟踪页面和所选项目没有上述副作用。不要添加事件处理程序。相反......以这样的方式创建listitem,即将项目的“id”添加为moveTo属性的参数。
例:
<xe:djxmRoundRectList id="menuList">
<xp:repeat value="#{compositeData.view.listItems}"
var="listItem" indexVar="menuIndex" id="listRepeat" rows="999">
<xe:djxmLineItem id="listItem"
label="#{listItem.label}" moveTo="#{compositeData.view.moveTo}&id=#{listItem.id}&clear=true"
rightText="#{listItem.rightText}">
</xe:djxmLineItem>
</xp:repeat>
</xe:djxmRoundRectList>
可以将以下代码添加到页面底部,以便为每个appPage的transition事件添加事件侦听器。
<xp:scriptBlock id="scriptBlock1">
<xp:this.value>
<![CDATA[XSP.addOnLoad(function(){
dijit.registry.byClass("extlib.dijit.mobile.View").forEach(function(widget, index, hash){
dojo.connect(widget, "onBeforeTransitionOut", function(moveTo, dir, transition, context, method){
var deferred = adminService.setMoveTarget(moveTo);
});
});
});
]]>
</xp:this.value>
</xp:scriptBlock>
事件处理程序正在调用jsonRpcService,它将详细信息传递给bean(在页面转换发生之前)。
<xe:jsonRpcService id="jsonRpcService1" serviceName="adminService"
state="true">
<xe:this.methods>
<xe:remoteMethod name="setMoveTarget"
script="AdminSession.setMoveTarget(moveTo);return true;">
<xe:this.arguments>
<xe:remoteMethodArg name="moveTo"></xe:remoteMethodArg>
</xe:this.arguments>
</xe:remoteMethod>
</xe:this.methods>
</xe:jsonRpcService>
然后,AdminSession bean中的setMoveTarget()方法应该能够解析参数以标识所选项目以及跟踪页面转换。
注意:添加clear = true是一种确保页面的pageContent仅在向前移动到页面时重置而不是在您移回同一页面时重置的方法。
所以这里是修改后的方法的代码,与此警告一起使用...
- 视图仅在第一列中分类,但可能不需要。该页面使用“按列筛选值”来显示所选文档。这是因为除非我从视图中删除了分类,否则subcatAppPage的重复控件将找不到多个值。
- 我在页面上使用了一个dataContext控件来定义将要显示的视图。它需要更多复杂性,但现在可以使用:
<xp:this.dataContexts> <xp:dataContext var="viewListItems"> <xp:this.value><![CDATA[#{javascript: try { var returnVal = []; returnVal.push({name:"Issues by Assigned To By Client", alias:"ByAssignedToClient", cats:["AssignedTo","Client"]}); returnVal.push({name:"Issues by Assigned To By Module", alias:"ByAssignedToType", cats:["AssignedTo","Type"]}); returnVal.push({name:"Issues by Client By Assigned To", alias:"ByClientAssignedTo", cats:["Client","AssignedTo"]}); returnVal.push({name:"Issues by Client By Module", alias:"ByClientType", cats:["Client","Type"]}); return returnVal; } catch(e) { _dump(e); } }]]></xp:this.value> </xp:dataContext> </xp:this.dataContexts>
现在这里是移动控件:
<xe:singlePageApp
id="singlePageApp1"
selectedPageName="mhome">
<xe:appPage
id="homeAppPage1"
pageName="mhome">
<xe:djxmHeading
id="djxmHeading1"
label="Home">
</xe:djxmHeading>
<xe:djxmRoundRectList id="djxmRoundRectList1">
<xp:repeat
id="repeat3"
rows="10"
var="listItem"
indexVar="liidx"
value="#{viewListItems}">
<xe:djxmLineItem
id="djxmLineItem5"
moveTo="selectCat"
label="#{javascript:listItem.name;}">
<xp:eventHandler
event="onClick"
submit="true"
refreshId="selectCatPagePanel"
refreshMode="partial">
<xp:this.action>
<xp:actionGroup>
<xp:executeScript script="#{javascript:sessionScope.m_selectedView = listItem;}"></xp:executeScript>
</xp:actionGroup>
</xp:this.action>
</xp:eventHandler>
</xe:djxmLineItem>
</xp:repeat>
</xe:djxmRoundRectList>
</xe:appPage>
<xe:appPage
id="categoryAppPage2"
pageName="selectCat"
resetContent="true"
preload="true">
<xp:panel id="selectCatPagePanel">
<xp:this.data>
<xp:dominoView var="view1">
<xp:this.viewName><![CDATA[#{javascript:
try{
var ssview = sessionScope.m_selectedView;
if(ssview == null) return "ByClientAssignedTo";
return ssview.alias;
} catch(e) {
return "ByClientAssignedTo";
}}]]></xp:this.viewName>
</xp:dominoView>
</xp:this.data>
<xe:djxmHeading
id="djxmHeading2"
moveTo="mhome"
back="back">
<xe:this.label><![CDATA[#{javascript:
var ssview = sessionScope.m_selectedView;
if(ssview == null) return "Select something";
return "Select " + ssview.cats[0];
}]]></xe:this.label>
</xe:djxmHeading>
<xp:text
escape="true"
id="computedField3">
<xp:this.value><![CDATA[#{javascript:
var ssview = sessionScope.m_selectedView;
if(ssview == null) return "View is nothing"
return "View is: " + ssview.name;
}]]></xp:this.value>
</xp:text>
<xe:djxmRoundRectList id="djxmRoundRectList2">
<xp:repeat
id="repeat1"
rows="30"
value="#{javascript:view1.getColumnValues(0);}"
var="catvalue"
indexVar="catidx">
<xe:djxmLineItem
id="djxmLineItem3"
label="#{javascript:catvalue}"
moveTo="selectSubcat">
<xp:eventHandler
event="onClick"
submit="true"
refreshId="selectSubCatPagePanel"
refreshMode="partial">
<xp:this.action><![CDATA[#{javascript:
var ssview = sessionScope.m_selectedView;
ssview.selectedCat = catvalue
sessionScope.m_selectedView = ssview;
}]]></xp:this.action>
</xp:eventHandler>
</xe:djxmLineItem>
</xp:repeat>
</xe:djxmRoundRectList>
</xp:panel>
</xe:appPage>
<xe:appPage
id="subcatAppPage3"
pageName="selectSubcat"
preload="true"
resetContent="true">
<xp:panel id="selectSubCatPagePanel">
<xe:djxmHeading
id="djxmHeading3"
moveTo="selectCat"
back="back">
<xe:this.label><![CDATA[#{javascript:
var ssview = sessionScope.m_selectedView;
if(ssview == null) return "Sele以上是关于移动应用页面可以确定哪个移动应用页面调用它以及选择了什么?的主要内容,如果未能解决你的问题,请参考以下文章