`
shappy1978
  • 浏览: 707385 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

Kuix教程4 级联下拉框

    博客分类:
  • J2ME
阅读更多

    网上JSP有很多级联下拉框的教程,通过第一个下拉框动态修改第二个下拉框的列表数值,这里也提供一种级联下拉框的实现方式:简单的过滤

<?xml version="1.0" encoding="UTF-8"?>
<screen title="Dynamic combo">
	<scrollPane style="align:fill-center;layout:inlinelayout(false,fill);gap:0 5">
    <container class="formEntry" style="layout:gridlayout(2,1)">
    	first combo:
    	<choice>
		    <choiceradiogroup id="chk1" onchange="filter(#chk1.value)">
		    	<radiobutton value="1">1</radiobutton>
		    	<radiobutton value="2">2</radiobutton>
		    </choiceradiogroup>
		</choice>
	</container>
	<container class="formEntry" style="layout:gridlayout(2,1)">
    	second combo:  
    	<choice>
		    <choiceradiogroup>
		        <_renderer>
		        <![CDATA[<radiobutton><_value>${itemValue}</_value>${itemName}</radiobutton>]]>
		        </_renderer>
		        <_items>@{itemList}</_items>
		    </choiceradiogroup>
		</choice>
	</container>
	</scrollPane>
    <screenFirstMenu onAction="back">Back</screenFirstMenu>
</screen> 
     其中renderer的用法为用provider来产生列表。

    Java稍微复杂一点,必须嵌套两个provider

import java.util.Hashtable;

import org.kalmeo.kuix.core.Kuix;
import org.kalmeo.kuix.core.model.DataProvider;
import org.kalmeo.kuix.widget.Screen;
import org.kalmeo.util.frame.Frame;


public class combo implements Frame {
	protected Screen screen;
    // Associate our data provider to the frame
    protected MyDataProvider dataProvider = new MyDataProvider();
    
	public void onAdded() {
		// TODO Auto-generated method stub
		dataProvider.initializeChoices();
		screen = Kuix.loadScreen("combo.xml", dataProvider);
        screen.setCurrent();
	}

	public boolean onMessage(Object identifier, Object[] arg1) {
		// TODO Auto-generated method stub
	    if ("back".equals(identifier)) {
	        // remove the current frame from the framehandler stack
	        Kuix.getFrameHandler().removeFrame(this);

	        // and display the main screen
	        Kuix.getFrameHandler().getTopFrame().onAdded();

	        // do not propagate the message through the rest of the frame stack
	        return false;
	    }
	    
	    if ("filter".equals(identifier)) {
	    	String sFilter=(String)arg1[0];
	    	dataProvider.getList(sFilter);
	    }

	    // let the next frames in the stack, process the message
	    return true;
	}

	public void onRemoved() {
		// TODO Auto-generated method stub
		screen.cleanUp();
        // unreference the screen object to free the memory
        screen = null;
	}

}

class MyDataProvider extends DataProvider {
    private static final String ITEM_LIST = "itemList";
    
    private Hashtable data=new Hashtable();
    
    public void getList(String sFilter){
    	int i=0;
    	ChoiceListItem o=(ChoiceListItem)data.get(String.valueOf(i));
    	removeAllItems(ITEM_LIST);
    	while(o!=null){
    		if(sFilter.equals("") || o.getItemName().indexOf(sFilter)>=0){
    			addItem(ITEM_LIST, o);
    		}
    		i++;
    		o=(ChoiceListItem)data.get(String.valueOf(i));
    	}
    }
    
    public void initializeChoices() {
        for(int i=0;i<20;i++) {
            ChoiceListItem item = new ChoiceListItem();
            item.setItemName("ItemName " + i);
            item.setItemValue("ItemValue " + i);
            data.put(String.valueOf(i), item);
            addItem(ITEM_LIST, item);
        }
    }
}

class ChoiceListItem extends DataProvider{
	private String itemValue;
	private String itemName;
	public String getItemName() {
		return itemName;
	}
	public void setItemName(String itemName) {
		this.itemName = itemName;
	}
	public String getItemValue() {
		return itemValue;
	}
	public void setItemValue(String itemValue) {
		this.itemValue = itemValue;
	}
	
    protected Object getUserDefinedValue(String property) {
        // handle custom properties requests
        if ("itemName".equals(property)) {
            return this.itemName;
        }
        if ("itemValue".equals(property)) {
            return this.itemValue;
        }

        // default behavior if the property has not been found
        return null;
    }	
}
     这种实现方式为官方比较推荐的,即通过provider来控制界面上的数据,必须注意下面几点:

1 这种控制实机上是单向的,例如你用provider的一个属性控制文本域中的文本,但是你修改界面上的文本域内容,provider的属性值不会产生改变。必须自己用代码获取。

2 从测试的情况下看,可能是由于一个窗口的代码不能操作另外一个窗口的provider(或者其他原因?),实际上我发现有出现更新了provider界面不刷新的情况

3 上面的方法只是一种实现方式,实际上我更喜欢通过代码来控制界面,直接修改列表的子对象。


分享到:
评论

相关推荐

    好用简单的可编辑级联下拉框

    4. **异步加载**:对于大数据量的级联选择,可能需要在每次选择后异步加载下一级的选项,以提高页面性能。 5. **样式定制**:为了保证组件的美观和一致性,需要了解CSS或CSS预处理器(如Sass或Less)来定制组件样式...

    级联下拉框效果 jquery

    级联下拉框(Cascading Dropdown)是一种常见的前端交互设计,它允许用户在选择一个选项后,根据所选选项动态加载并显示下一个下拉框的内容。这种效果在多级分类、地区选择、产品配置等场景中十分常见。在本教程中,...

    超简单的级联下拉框例子

    级联下拉框是一种常见的用户界面元素,常用于在多个相关选项之间建立关联,例如国家、省份、城市的三级选择。这种交互方式可以帮助用户快速浏览和选择层级结构中的数据,而无需打开多个独立的下拉菜单。在网页开发或...

    excel 级联下拉框用法

    在本教程中,我们将深入探讨如何在Excel中创建级联下拉框,并通过提供的`excle动态级联.xls`示例文件来理解其实现方法。 1. **什么是级联下拉框** 级联下拉框是由两个或多个相互关联的下拉列表组成,当用户在第一...

    Android城市级联下拉框(自定义Spinner)

    在Android开发中,有时...总之,实现Android城市级联下拉框(自定义Spinner)需要对Spinner的基本使用、事件监听、数据更新以及界面定制有深入了解。通过不断实践和优化,我们可以创建出用户体验优秀的级联选择组件。

    layui-级联下拉框-可配置开启多选-HTML源码

    级联下拉框是一种常见的UI组件,它允许用户在一个下拉框的选择基础上动态加载并显示另一个相关的下拉框,这种联动效果在数据筛选、地区选择等场景中非常常见。 1. HTML基础: HTML(HyperText Markup Language)...

    省份-市-区及镇街道级联下拉框加载

    内部为四级的级联下拉框,分别为省份,市,县及区和镇及街道四级下拉框;(适用任何语言的纯HTML)详细截图可访问:https://blog.csdn.net/weixin_43972758/article/details/86510419 进行查询。

    仿美团网团购搜索级联下拉框DEMO

    2. **级联下拉框**: 级联下拉框是一种交互设计,它允许用户在一个下拉框的选择基础上,打开另一个相关的下拉框,形成一种递进的筛选过程。例如,用户先选择城市,接着在选择的城市基础上展示相应的商圈或者类别。...

    动态级联下拉框构件

    动态级联下拉框构件是一种常见的前端交互组件,主要用于实现多级联动选择的效果。在网页设计中,这种组件常用于地址选择、分类筛选等场景,用户在选择一级选项后,二级甚至多级相关的下拉框内容会随之更新,提供更...

    AJAX级联下拉框源码

    AJAX级联下拉框是一种常见的前端交互设计,它利用Ajax技术实现在用户选择一个下拉选项时,动态地更新另一个相关联的下拉框内容。这种功能在数据关联、筛选和表单填写中非常常见,例如省份和城市的选择,类别和子类别...

    jQuery实现级联下拉框实战(5)

    在本文中,我们将探讨如何使用jQuery实现级联下拉框的效果,这是一个常见的前端交互功能,常用于数据筛选和表单填写。级联下拉框允许用户在一个下拉框中做出选择后,根据所选内容动态更新下一个下拉框的选项。这种...

    省市地区 局部刷新 级联下拉框

    在ASP.Net开发中,"省市地区 局部刷新 级联下拉框"是一个常见的需求,它涉及到前端用户界面的交互以及后端数据的动态加载。局部刷新技术可以提高用户体验,因为它仅更新页面的特定部分,而不是整个页面,这在处理...

    使用jquery写的级联下拉框

    使用jquery写的级联下拉框,使用jquery写的级联下拉框

    用Struts+hibernate+SQLServer2000写的级联下拉框程序

    4. **Action处理**:在Action中,根据用户在第一个下拉框中的选择,使用Hibernate查询数据库获取关联的子类别数据。 5. **JSP渲染**:Action将查询结果传递给JSP页面,JSP使用JavaScript或jQuery库(如AJAX)来动态...

    数据库动态级联下拉框

    asp读取access数据库数据,在html页面动态生成多级级联的下拉框,摆脱静态级联下拉框数据变更烦恼。

    级联下拉框(支持火狐和IE)

    级联下拉框是一种常见的用户界面元素,常用于在网页或应用程序中提供多级选择功能。在.NET框架中,实现这种交互通常涉及到HTML、CSS、JavaScript(如jQuery)以及服务器端的技术,例如ASP.NET。本示例可能是一个...

    无限极级联下拉框的封装

    在网页开发中,级联下拉框(Cascading Dropdown)是一种常见的交互设计,它用于在两个或更多下拉框之间建立关联,当用户在一个下拉框中选择一个选项时,其他下拉框的选项会根据所选内容动态更新。在本案例中,我们将...

    ajax+servlet两级动态级联下拉框

    4. **级联下拉框**:级联下拉框是指两个或更多下拉框之间存在依赖关系,即一个下拉框的选择会影响另一个下拉框的选项。例如,选择一个国家后,下一个下拉框会显示该国的省份或者城市。这种功能常用于地理信息选择、...

    ajax实现可配置无刷新级联下拉框

    **Ajax 实现可配置无刷新级联下拉框** 在 Web 开发中,为了提供用户友好的交互体验,级联下拉框(Cascading Dropdown)是一个常见的需求。级联下拉框允许用户在一个下拉框中选择一个选项后,根据所选的选项动态更新...

    使用JQuery实现漂亮的三级级联下拉框

    在网页设计中,级联下拉框是一种常见的交互元素,尤其在处理层级关系的数据时,如地区选择、产品分类等。三级级联下拉框则是指三个互相联动的下拉菜单,当用户在一个下拉框中选择一个选项时,其他关联的下拉框会根据...

Global site tag (gtag.js) - Google Analytics