當前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
Easyui+Spring+Mybatis完整示例(前台)
生活随笔
收集整理的這篇文章主要介紹了
Easyui+Spring+Mybatis完整示例(前台)
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
典型的Easyui+Spring+Mybatis例子,方便自己的記憶. JSP: <%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>軟件信息管理</title>
<%@include file="../include/head.jsp"%>
<script type="text/javascript" src="<%=basePath%>/resources/js/deploySoftware/deploySoftwareInfo.js"></script>
</head>
<body><table id="softDg" ></table><div id="toolbar" style="height: auto"><div id="pFilter"><a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add", οnclick="addSoftwareInfo()">新增</a><a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit", οnclick="editSoftwareInfo()">修改</a><a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel", οnclick="delrow()">刪除</a>??<span class="filterTip">程序名</span><input id="qSoftName" name="qSoftName" class="easyui-textbox"/>??<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-reload", οnclick="searchSoftware()">查詢</a></div></div><div id="editSoftwareDg" data-options="minimizable:false, maximizable:false, modal:true,closed:true,width:350,height:300" ></div>
</body>
</html>新增|修改JSP: <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<form id="editSoftwareInfo" method="post" ><input type="hidden" name="id" value="${deploySoftwareInfo.id }"><div style="width: 220px;height:200px;padding: 20px 0px 0px 40px" ><div class="fitem" style="padding: 5px 0px 5px 0px"><label style="position: relative;text-align: left" >軟件名：</label> <br><input id='softName' name="softName" value="${deploySoftwareInfo.softName}" class="easyui-validatebox" style="width:100px;border:1px solid #ccc;" data-options="required:true" /></div><div class="fitem" style="padding: 5px 0px 5px 0px"><label style="position: relative;text-align: left" >安裝路徑：</label> <input id='installPath' name="installPath" value="${deploySoftwareInfo.installPath}" class="easyui-validatebox" style="width:250px;border:1px solid #ccc;" data-options="required:true" /> </div><div class="fitem" style="padding: 5px 0px 5px 0px"><label style="position: relative;text-align: left" >軟件描述：</label> <input id='softDesc' name="softDesc" value="${deploySoftwareInfo.softDesc}" class="easyui-textbox" style="width:250px;height:70px;border:1px solid #ccc;" data-options="multiline:true" /> </div></div><div align="center" style="line-height: 30px;"><a href="javascript:void(0)" class="easyui-linkbutton" id="saveBtn" iconcls="icon-ok" οnclick="submitSoft();">保?存</a>?<a href="javascript:void(0)" class="easyui-linkbutton" iconcls="icon-no" οnclick='$("#editSoftwareDg").dialog("close")'>關?閉</a></div>
</form>
<script type="text/javascript">function submitSoft(){var softName = $('#softName').val();var installPath = $('#installPath').val();if(softName==""||installPath==""){$.messager.alert('提示信息','程序名和安裝路徑不能為空！'); return;}$('#editSoftwareInfo').form("submit",{url: 'deploySoftware/editSoftwareInfo',onSubmit:function(){},success:function(res){if(res == "success"){$("#editSoftwareDg").dialog('close');$("#softDg").datagrid('reload');}else{$.messager.alert("提示",res);}}})}
</script>
JS: /**軟件管理界面JS*/ $(document).ready(function() {loadSoftwareInfo(); }); function loadSoftwareInfo(){$('#softDg').datagrid({url : 'deploySoftware/getSoftwareInfoList',checkbox : true,fitColumns : true,pagination : true,striped : true,remoteFilter:true,pageList : [ 20, 30 ],rownumbers : true,pageSize : 20,singleSelect : false,method : 'get',fit : true,queryParams :{},toolbar : '#toolbar'/*[{iconCls: 'icon-add',text : "新增",handler: addSoftwareInfo},{iconCls: 'icon-edit',text : "修改",handler: editSoftwareInfo},{iconCls: 'icon-cancel',text : "刪除",handler : delrow}]*/,frozenColumns : [ [ { field : 'Id', title : '虛屬性', checkbox : true} ] ],columns : [[{field : "softName",title : "軟件名",halign : 'center',sortable : false,width : $(this).width() * 0.27},{field : "installPath",title : "安裝路徑",halign : 'center',sortable : false,width : $(this).width() * 0.27},{field : "softDesc",title : "軟件描述",halign : 'center',sortable : false,width : $(this).width() * 0.27 }/*{field : "operator",title : "操作",halign : 'center',formatter: softwareFormatter}*/]]}); } /* function softwareFormatter(value,row,index) {var str = '';str+="????<a href=\"javascript:void(0)\" class=\"easyui-linkbutton\" iconCls=\"icon-edit\" οnclick=\"editSoftwareInfo("+row.id+")\">修改</a>";str+="????<a href=\"javascript:void(0)\" class=\"easyui-linkbutton\" iconCls=\"icon-delete\" οnclick=\"delSoftwareInfo("+row.id+");\">刪除</a>";return str; }*/ /** 修改*/ function editSoftwareInfo(){var rows = $('#softDg').datagrid('getChecked');if(rows.length == 1){var id = rows[0].id;$('#editSoftwareDg').dialog({title : "編輯軟件",href : "deploySoftware/toEditSoftwareInfo/"+id,cache : false}).dialog('open');}else{$.messager.alert("提示","一次修改一個程序");} } /** 新增*/ function addSoftwareInfo(){$('#editSoftwareDg').dialog({title : "新增軟件",href : "deploySoftware/toEditSoftwareInfo/"+"-1",cache : false}).dialog('open'); } /** 刪除*/ function delrow(){var rows = $('#softDg').datagrid('getChecked');if(rows.length<1){$.messager.alert("提示","請選擇至少一個程序");retutn;}var ids = [];for(var i in rows){ids.push(rows[i].id);}$.post("deploySoftware/delDeploySoftwareInfo/"+ids,{},function(callbackData){$('#softDg').datagrid('reload'); /*$('#ed').dialog('close'); */}); } /** 搜索*/ function searchSoftware(){var queryParams = $('#softDg').datagrid('options').queryParams;queryParams.softName = $('#qSoftName').val();$("#softDg").datagrid("reload",queryParams); }
JS: /**軟件管理界面JS*/ $(document).ready(function() {loadSoftwareInfo(); }); function loadSoftwareInfo(){$('#softDg').datagrid({url : 'deploySoftware/getSoftwareInfoList',checkbox : true,fitColumns : true,pagination : true,striped : true,remoteFilter:true,pageList : [ 20, 30 ],rownumbers : true,pageSize : 20,singleSelect : false,method : 'get',fit : true,queryParams :{},toolbar : '#toolbar'/*[{iconCls: 'icon-add',text : "新增",handler: addSoftwareInfo},{iconCls: 'icon-edit',text : "修改",handler: editSoftwareInfo},{iconCls: 'icon-cancel',text : "刪除",handler : delrow}]*/,frozenColumns : [ [ { field : 'Id', title : '虛屬性', checkbox : true} ] ],columns : [[{field : "softName",title : "軟件名",halign : 'center',sortable : false,width : $(this).width() * 0.27},{field : "installPath",title : "安裝路徑",halign : 'center',sortable : false,width : $(this).width() * 0.27},{field : "softDesc",title : "軟件描述",halign : 'center',sortable : false,width : $(this).width() * 0.27 }/*{field : "operator",title : "操作",halign : 'center',formatter: softwareFormatter}*/]]}); } /* function softwareFormatter(value,row,index) {var str = '';str+="????<a href=\"javascript:void(0)\" class=\"easyui-linkbutton\" iconCls=\"icon-edit\" οnclick=\"editSoftwareInfo("+row.id+")\">修改</a>";str+="????<a href=\"javascript:void(0)\" class=\"easyui-linkbutton\" iconCls=\"icon-delete\" οnclick=\"delSoftwareInfo("+row.id+");\">刪除</a>";return str; }*/ /** 修改*/ function editSoftwareInfo(){var rows = $('#softDg').datagrid('getChecked');if(rows.length == 1){var id = rows[0].id;$('#editSoftwareDg').dialog({title : "編輯軟件",href : "deploySoftware/toEditSoftwareInfo/"+id,cache : false}).dialog('open');}else{$.messager.alert("提示","一次修改一個程序");} } /** 新增*/ function addSoftwareInfo(){$('#editSoftwareDg').dialog({title : "新增軟件",href : "deploySoftware/toEditSoftwareInfo/"+"-1",cache : false}).dialog('open'); } /** 刪除*/ function delrow(){var rows = $('#softDg').datagrid('getChecked');if(rows.length<1){$.messager.alert("提示","請選擇至少一個程序");retutn;}var ids = [];for(var i in rows){ids.push(rows[i].id);}$.post("deploySoftware/delDeploySoftwareInfo/"+ids,{},function(callbackData){$('#softDg').datagrid('reload'); /*$('#ed').dialog('close'); */}); } /** 搜索*/ function searchSoftware(){var queryParams = $('#softDg').datagrid('options').queryParams;queryParams.softName = $('#qSoftName').val();$("#softDg").datagrid("reload",queryParams); }
總結
以上是生活随笔為你收集整理的Easyui+Spring+Mybatis完整示例(前台)的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 程序员在未来会变成廉价劳动力（农民工）吗
- 下一篇： hinton、李飞飞支持的NLP明星创企