form:select 的二级联动

最新推荐文章于 2024-02-01 19:42:30 发布

dxyzhbb

最新推荐文章于 2024-02-01 19:42:30 发布

阅读量983

点赞数 2

分类专栏： # SpringMvc

原文链接：https://blog.youkuaiyun.com/jasyca503/article/details/97249355

版权

SpringMvc 专栏收录该内容

26 篇文章

订阅专栏

<div class="control-group">
            <label class="control-label">类型:</label>
            <div class="controls">
                <form:select id="type" name="type" path="type" class="input-xlarge" onchange="findtemplate(this.options[this.options.selectedIndex].value);" style="width:180px;">
                    <form:options items="${fns:getDictList('upl_type')}" itemLabel="label" itemValue="value" htmlEscape="false" />
                </form:select>
            </div>
        </div>

其中最主要的是οnchange="findtemplate(this.options[this.options.selectedIndex].value);" 拿到选择第一个的值；

    <div class="control-group">
            <label class="control-label">选择模板:</label>
            <div class="controls">
                <form:select id="template" name="template" path="type" class="input-xlarge" style="width:180px;">
                    <form:options id="wordTemplate" items="${fns:getDictList('upc_word')}"
                        itemLabel="label" itemValue="value" htmlEscape="false" />
                </form:select>
            </div>
        </div>

function findtemplate(v) {
		$.ajax({
			type : "post",
			async : false,
			url : "getPostTemplateJson",
			data : {
				'type' : v
			},
			dataType : "json",
			success : function(msg) {
				$("#template").empty();
				if (msg.length > 0) {
					for (var i = 0; i < msg.length; i++) {
							var partId = msg[i].value;
							var partName = msg[i].label;
							var $option = $("<option>").attr({
								"value" : partId
							}).text(partName);
							$("#template").append($option);
					}
					$("#template").change();
 
				}
			},
			error : function(json) {
				$.jBox.alert("网络异常！");
			}
		});
	}