java的ssm框架简单实现ajax搜索功能

<script type="text/javascript">
	function searchCompany(){	        		
	       $("#companyTable").hide();//隐藏原来表格内容

			var companyName = $.trim($("#companyName").val());//获取搜索框内容
											
			
			
				$.ajax({
					type : "post",
					dataType : "json",
					
					url : "/admin/searchCompany.do",
					data : {
						companyName : companyName
						
					},
					success : function(data) {
						
						
					
						
							var tableStr = "<table class='table table-border table-bordered table-bg table-hover table-sort' id='orgtable' style='width: 95%; margin-top:90px;margin-left: 2%;'>";
							if (data.length > 0) {
								tableStr = tableStr
										+ "<thead><tr class='text-c'>"
										+ "<th width='50'>机构名称</th>"																														
										+ "<th width='50'>账号</th>"
										+ "<th width='50'>注册时间</th>"
										+ "<th width='50'>联系方式</th>"
										+ "<th width='50'>评测人数</th></tr></thead>"										
							
								for (var i = 0; i < data.length; i++) {																		
									tableStr = tableStr
											+ "<tbody> <tr class='text-c'>"
											+ "<td >"
											+ data[i].zbxCompany.zbxCompanyname
											+ "</td>"
											+ "<td>"
											+ data[i].zbxAccount
											+ "</td>"
											+ "<td >"
											+ data[i].zbxCreatetime
											+ "</td>"
											+ "<td>"
											+ data[i].zbxPhone
											+ "</td>"
											+ "<td  >"
											+ data[i].userCount
											+ "</td>"
										
											
											
											;


								}
										}
								if (data.length == 0) {
									
									tableStr = tableStr
									+ "<thead><tr class='text-c'>"
									+ "<th width='50'>机构名称</th>"																														
									+ "<th width='50'>账号</th>"
									+ "<th width='50'>注册时间</th>"
									+ "<th width='50'>联系方式</th>"
									+ "<th width='50'>评测人数</th></tr></thead>"
								
									tableStr = tableStr
											+ "<tbody id='orgquerytableData'><tr style='text-align: center'>"
											+ "<tr><td colspan='5'>暂无数据...</td></tr></tbody>";
								}											
								
								 $(".table-responsive").html(tableStr); 
								 tableStr = tableStr
									+ "</table>";
									
								
							
							 	} 
				});									


	 
		 }
	
	
	
	
	</script>
	function searchCompany(){	        		
	       $("#companyTable").hide();//隐藏原来表格内容

			var companyName = $.trim($("#companyName").val());//获取搜索框内容
											
			
			
				$.ajax({
					type : "post",
					dataType : "json",
					
					url : "/admin/searchCompany.do",
					data : {
						companyName : companyName
						
					},
					success : function(data) {
						
						
					
						
							var tableStr = "<table class='table table-border table-bordered table-bg table-hover table-sort' id='orgtable' style='width: 95%; margin-top:90px;margin-left: 2%;'>";
							if (data.length > 0) {
								tableStr = tableStr
										+ "<thead><tr class='text-c'>"
										+ "<th width='50'>机构名称</th>"																														
										+ "<th width='50'>账号</th>"
										+ "<th width='50'>注册时间</th>"
										+ "<th width='50'>联系方式</th>"
										+ "<th width='50'>评测人数</th></tr></thead>"										
							
								for (var i = 0; i < data.length; i++) {																		
									tableStr = tableStr
											+ "<tbody> <tr class='text-c'>"
											+ "<td >"
											+ data[i].zbxCompany.zbxCompanyname
											+ "</td>"
											+ "<td>"
											+ data[i].zbxAccount
											+ "</td>"
											+ "<td >"
											+ data[i].zbxCreatetime
											+ "</td>"
											+ "<td>"
											+ data[i].zbxPhone
											+ "</td>"
											+ "<td  >"
											+ data[i].userCount
											+ "</td>"
										
											
											
											;


								}
										}
								if (data.length == 0) {
									
									tableStr = tableStr
									+ "<thead><tr class='text-c'>"
									+ "<th width='50'>机构名称</th>"																														
									+ "<th width='50'>账号</th>"
									+ "<th width='50'>注册时间</th>"
									+ "<th width='50'>联系方式</th>"
									+ "<th width='50'>评测人数</th></tr></thead>"
								
									tableStr = tableStr
											+ "<tbody id='orgquerytableData'><tr style='text-align: center'>"
											+ "<tr><td colspan='5'>暂无数据...</td></tr></tbody>";
								}											
								
								 $(".table-responsive").html(tableStr); 
								 tableStr = tableStr
									+ "</table>";
									
								
							
							 	} 
				});									


	 
		 }
	
	
	
	
	</script>

前端部分代码

<div  >
	<div class="row text-right text-center margin_bottom">
			<div class="col-md-4 col-sm-4 col-xs-6 margin_bottom">
				<label for="name" class="col-md-4 col-sm-6 col-xs-10">机构名称</label> 
				<div class="col-md-8 col-sm-6 col-xs-12" style="margin-left:-15%;">
					<input  id="companyName" name="companyName" type="text" class="input-text">
				</div>
			</div>
			<div class="col-md-4 col-sm-4 col-xs-6 margin_bottom" style="margin-left:-5%;">
				<button onclick="searchCompany()" id="btnSearch" class="btn btn-success btn-sm  radius" type="button" >
				<i class="Hui-iconfont"></i> 搜索
				</button>
			</div>
			
		</div>

controller层

@RequestMapping(value = "/admin/searchCompany.do")
	@ResponseBody
	public List<ZbxAdmin> searchAdminList(String companyName,HttpServletRequest request, HttpServletResponse response,Model model){
		ZbxAdmin admin=(ZbxAdmin) request.getSession().getAttribute("admin");
		List<ZbxAdmin> adminList=null;
		
			
		    adminList=adminService.searchAdminBycompanyName(companyName);	
		  
							 return adminList;
												
	}

service层和dao层根据业务来写。