Yii - 连动下拉菜单，可多级哦...-select中选择option其中一个选项...-Struts自定义Converter

当前位置: 编程技术>WEB前端

本页文章导读:

▪Yii - 连动下拉菜单，可多级哦视图文件<?php echo CHtml::activeDropDownList($model,'zmg_id',MemGroup::model()->getMemGroup(),array( 'class'=>'s_ipt w_120', 'empty'=>'请选择会员组', 'ajax' =>array( 'type'=>'GET', 'url'=>CController::cre.........

▪select中选择option其中一个选项，显示相关的内容图片：代码： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> .........

▪Struts自定义Converter 上篇写了JSTL自定义函数，这篇本来想写DWR的（因为觉得它俩有些相似：都是前台调用后台代码），准备不充分，下次写吧。 Struts自定义Converter 一、简单测试ActionForm的类型的自动转换 1.编.........

[1]Yii - 连动下拉菜单，可多级哦

来源: 互联网发布时间: 2013-11-06

视图文件

<?php echo CHtml::activeDropDownList($model,'zmg_id',MemGroup::model()->getMemGroup(),array(
		'class'=>'s_ipt w_120',
		'empty'=>'请选择会员组',
		'ajax' =>array(
					'type'=>'GET',
					'url'=>CController::createUrl('/blog_article/cmpTemplates/getMemType/index.html'),
					'update'=>'#CmpTemplates_zmg_ids',
					'data'=>array('mid'=>"js:this.value")
					),
		))?>
<?php echo $form->dropDownList($model,'zmg_ids',array(),array('class'=>'s_ipt w_120','empty'=>'选择会员等级'))?>

控制器

/**
 * 获取会员组,对应的会员等级，用于下拉菜单
 */
public function actionGetMemType($mid=0)
 {
 	$criteria=new CDbCriteria;
 	$criteria->compare('zmg_id',$mid);
	$memType = MemType::model()->findAll($criteria);
	
	$name = '选择会员等级';
	echo CHtml::tag('option', array('value'=>0), $name, true);
	foreach($memType as $val) {
		echo CHtml::tag('option', array('value'=>$val->zmt_id),CHtml::encode($val->zmt_title),true);
	}
}

模型

	/*
	 * 取会员组信息	 
	 */
   public function getMemGroup($type=null){
	   	if($type==null){
	   		$criteria=new CDbCriteria;
	   		$criteria->compare('type','1');
	   		$memGroup = MemGroup::model()->findAll($criteria);
	   		return CHtml::listData($memGroup,'zmg_id','zmg_title');
	   	}else{
	   		$level = $this->getMemGroup();
	   		if(array_key_exists($type,$level)){
	   			return $level[$type];
	   		}
	   	}
   }

作者：dreamzml 发表于2013-3-6 14:20:20 原文链接

阅读：69 评论：0 查看评论

[2]select中选择option其中一个选项，显示相关的内容

来源: 互联网发布时间: 2013-11-06

图片：

代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
.hide{
display:none;
}
</style>
<script type="text/javascript" src=/blog_article/"js/jquery-1.7.2.min.js"></script>_br/index.html> <script type="text/javascript">
$(function(){
$('select').change(function(){

var value=$("select").find("option:selected").val();

if(value=='1'){
$('#Cont_1').removeClass('hide');
$('#Cont_2,#Cont_3').addClass('hide');
}
if(value=='2'){
$('#Cont_2').removeClass('hide');
$('#Cont_1,#Cont_3').addClass('hide');
}
if(value=='3'){
$('#Cont_3').removeClass('hide');
$('#Cont_1,#Cont_2').addClass('hide');
}

});

});

</script>
</head>

<body>
<select>
<option value='1'>第一条新闻标题</option>
<option value='2'>第二条新闻标题</option>
<option value='3'>第三条新闻标题</option>
</select>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<div id='info_box'>
<div id='Cont_1'>第一条新闻内容</div>
<div id='Cont_2' class="hide">第二条新闻内容</div>
<div id='Cont_3' class="hide">第三条新闻内容</div>
</div>






</body>

</html>

例子2：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
#info_box div {
display:block;
}
</style>
<script type="text/javascript" src=/blog_article/"js/jquery-1.7.2.min.js"></script>_br/index.html> <script type="text/javascript">

(function($){
$.fn.selectTab = function(o){
var d = {
select:'select', //定义下拉对象
con:'p' //定义切换对象
};
var o = $.extend(d,o);
var $option = $(d.select).find('option');//遍历下拉对象下的option
for(var i = 0; i < $option.length; i++){
$option.eq(i).attr('i',i); //设置option 属性i从下标为0开始赋值
}
selectFn();
$(d.select).change(function(){
selectFn();
})
function selectFn(){
var selectedIndex = $(d.select).find('option:selected').attr('i'); //保存被选中的option的属性i的值
$(d.con).eq(selectedIndex).show().siblings(d.con).hide(); //显示对应显示的对象
}
}
})(jQuery);
$(function(){
$().selectTab();
})

</script>
</head>

<body>

<select name="">
<option value="" selected="true">选择内容1</option>
<option value="">选择内容2</option>
<option value="">选择内容3</option>
<option value="">选择内容4</option>
</select>
<p>要显示的内容1</p>
<p style="display:none;" id="one">要显示的内容2</p>
<p style="display:none;">要显示的内容3</p>
<p style="display:none;">要显示的内容4</p>

</body>
</html>

作者：wangxiaohui6687 发表于2013-3-6 16:00:10 原文链接

阅读：55 评论：0 查看评论

[3]Struts自定义Converter

来源: 互联网发布时间: 2013-11-06

上篇写了JSTL自定义函数，这篇本来想写DWR的（因为觉得它俩有些相似：都是前台调用后台代码），准备不充分，下次写吧。

Struts自定义Converter 一、简单测试ActionForm的类型的自动转换 1.编写页面，index.jsp

<body>
	<h1>测试ActionForm</h1>
	<li>测试struts的类型转换器</li><br>
	<form action="type_convert.do" method="post">
		intValue:<input type="text" name="intValue"><br>
		doubleValue:<input type="text" name="doubleValue"><br>
		booleanValue:<input type="text" name="booleanValue"><br>
		java.sql.date:<input type="text" name="sqlDate"><br>
		java.util.date:<input type="text" name="utilDate"><br>
		<input type="submit" value="提交">
	</form>	
</body>

2.编写ActionForm/Action，TypeConvertActionForm.java，TypeConvertTestAction.java

public class TypeConvertActionForm extends ActionForm {

	private int intValue;
	
	private double doubleValue;
	
	private boolean booleanValue;
	
	private java.sql.Date sqlDate;
	
	private java.util.Date utilDate;
	//省略get()/set()方法
}public class TypeConvertTestAction extends Action {

	@Override
	public ActionForward execute(ActionMapping mapping, ActionForm form,
			HttpServletRequest request, HttpServletResponse response)
			throws Exception {		
		return mapping.findForward("success");
	}
}

3.编写“success”跳转页面，展示ActionForm收集数据、并自动转换类型之后的结果。
type_converter_success.jsp
<body>
	intValue:${typeConvertForm.intValue }<br>
	doubleValue:${typeConvertForm.doubleValue }<br>
	booleanValue:${typeConvertForm.booleanValue }<br>
	sqlDate:${typeConvertForm.sqlDate }<br>
	utilDate:${typeConvertForm.utilDate }<br>
</body>
4.编写struts配置文件，struts-config.xml
<struts-config>
	<form-beans>	
		<form-bean name="typeConvertForm" type="com.ys.struts.TypeConvertActionForm" />
	</form-beans>
	
	<action-mappings>
		<action path="/type_convert"
				type="com.ys.struts.TypeConvertTestAction"
				name="typeConvertForm"
				scope="request">
			<forward name="success" path="/type_convert_success.jsp" />
		</action>
	</action-mappings>
</struts-config>
5.结果：

(1)int，double，boolean自动转换。
boolean: yes, y, 1, on, true都会转换成True类型，而且忽略大小写，其他情况转换成false。
(2)Date类型的转换：
如果是java.sql.Date，页面日期的格式必须为yyyy-mm-dd，才可以转换

如果是java.util.Date，默认情况下struts无法转换
二、Struts自定义转换器
1.实现converter接口，实现convert方法
/**
 * 自定义转换器
 * @author ys
 *
 */
public class UtilDateConverter implements Converter {

	@Override
	public Object convert(Class type, Object value) {
		if (value instanceof Date) {
			return (value);
		}
		Date date = null;
		if (value instanceof String) {
			try {
				date = new SimpleDateFormat("yyyy-MM-

dd").parse((String)value);
			} catch (ParseException e) {
				e.printStackTrace();
			}
		}
		return date;
	}
}
2.将实现的converter注册
(1)方法一：通常情况采用servlet注册
/**
 * 采用servlet初始化UtilDateConverter
 * @author ys
 *
 */
public class UtilDateConverterInitWithServlet extends HttpServlet {

	@Override
	public void init() throws ServletException {
		System.out.println("UtilDateConverterInitWithServlet.init()");
		ConvertUtils.register(new UtilDateConverter(), java.util.Date.class);	
	}
}
采用servlet注册，web.xml文件的配置
  <servlet>
  	<servlet-name>UtilDateConverterInitWithServlet</servlet-name>
  	<servlet-class>com.ys.struts.UtilDateConverterInitWithServlet</servlet-class>
  	<load-on-startup>10</load-on-startup>
  </servlet>
(2)方法二：采用struts plugin注册
public class UtilDateConverterInitWithPlugIn implements PlugIn {

	@Override
	public void destroy() {
		// TODO Auto-generated method stub

	}

	@Override
	public void init(ActionServlet servlet, ModuleConfig config)
			throws ServletException {
		System.out.println("UtilDateConverterInitWithPlugIn.init()");
		ConvertUtils.register(new UtilDateConverter(), java.util.Date.class);
	}
}
在struts-config.xml中注册plugin
<struts-config>
	<form-beans>	
		<form-bean name="typeConvertForm" type="com.ys.struts.TypeConvertActionForm" />
	</form-beans>
	
	<action-mappings>
		<action path="/type_convert"
				type="com.ys.struts.TypeConvertTestAction"
				name="typeConvertForm"
				scope="request">
			<forward name="success" path="/type_convert_success.jsp" />
		</action>
	</action-mappings>
	
	<plug-in className="com.ys.struts.UtilDateConverterInitWithPlugIn" />
</struts-config>

        
            作者：linjingj 发表于2013-3-6 19:28:57 原文链接
        
        
            阅读：0 评论：0 查看评论