关于Jquery框架下javascript combobox输入动态取值问题

fufujuan 2013-05-16 04:21:57

请问各位大侠，前段用Jquery框架+js后台处理+jsp展现，现在要在增加弹出框的输入里读取已输入的值，这个值是否可以从数据读取或是用数组保存然后读取，请问这样然后实现？

贴代码了：
Jsp：

<link rel="stylesheet" type="text/css"
href="jquery-easyui-1.3.2/themes/default/easyui.css">
<link rel="stylesheet" type="text/css"
href="jquery-easyui-1.3.2/themes/icon.css">
<script type="text/javascript"
src="jquery-easyui-1.3.2/jquery-1.8.0.min.js">
</script>
<script type="text/javascript"
src="jquery-easyui-1.3.2/jquery.easyui.min.js">
</script>
<script type="text/javascript"
src="jquery-easyui-1.3.2/locale/easyui-lang-zh_CN.js">
</script>

<script type="text/javascript"
src="jsp/system-manage/jw_datadictory.js">
</script>
</head>

<body class="easyui-layout" fit="true">
<div region="north" style="overflow: hidden; height: 120px;"
title="数据字典">
<fieldset style="padding: 5px; height: 40px; padding: 5px;">
<legend>
查询
</legend>
<table style="font-size: 12px;">
<form id="datadictorySearchForm" name="datadictorySearchForm" method="post" action="datadictoryAction!eachJsonSaveSmDataDictory.action">
<tr>
<td>
任务名称:
</td>
<td colspan="2">
<input id="nameSearch" name="datadictory.name" class="easyui-validatebox" style="width: 100px;" />
</td>
<td>
<a class="easyui-linkbutton" iconCls="icon-search" plain="true"
onclick="searchDataDictory();" href="javascript:void(0);">查找</a>
</td>
</tr>
</form>
</table>
</fieldset>
<div style="height: 20px;">
<a class="easyui-linkbutton" iconCls="icon-add"
onclick="appendDataDictory();" plain="true"
href="javascript:void(0);">增加</a>
<a class="easyui-linkbutton" iconCls="icon-edit"
onclick="editDataDictory();" plain="true" href="javascript:void(0);">编辑</a>
<a class="easyui-linkbutton" iconCls="icon-remove"
onclick="deleteDataDictory();" plain="true"
href="javascript:void(0);">删除</a>
</div>
</div>
<div region="center" title="数据字典列表"
style="background: #fafafa; width: auto;">
<table id="datadictoryDatagrid"></table>
<div id="menu" class="easyui-menu"
style="width: 120px; display: none;">
<div onclick="appendDataDictory();" iconCls="icon-add">
增加
</div>
<div onclick="editDataDictory();" iconCls="icon-edit">
编辑
</div>
<div onclick="deleteDataDictory();" iconCls="icon-remove">
删除
</div>
</div>
<div id="datadictoryDialog"
style="display: none;width:400px;overflow: hidden; padding: 20px;">
<table class="tableForm">
<form id="datadictoryForm" name="datadictoryForm" method="post">
<tr>
<td style="text-align: right;">
任务类型
</td>
<td>
<input name="datadictory.datadictoryId" type="hidden" />
<input name="datadictory.taskType" class="easyui-combobox" required="true" />
</td>
</tr>
<tr>
<td style="text-align: right;">
任务名称
</td>
<td>
<input name="datadictory.name" class="easyui-combobox" required="true" />
</td>
</tr>
<tr>
<td style="text-align: right;">
说明
</td>
<td >
<textarea name="datadictory.memo" class="easyui-validatebox" style="width: 300px; height : 100px;overflow: auto;"></textarea>
</td>
</tr>
</table>
</form>
</div>
</div>
</body>
</html>
js的代码：

var datadictoryDatagrid;
var datadictoryDialog;
var datadictoryForm;
$(function() {
datadictoryForm = $('#datadictoryForm').form();
datadictoryDialog = $('#datadictoryDialog').show().dialog({
modal : true,
title : '字典值编辑',
buttons : [ {
text : '保存',
handler : function() {
datadictoryForm.form('submit', {
url : 'datadictoryAction!eachJsonSaveOrUpdateSmDataDictory.action',
success : function(data) {
var d = $.parseJSON(data);
if(data.result == "failed"){
$.messager.alert('系统提示', decodeURI(d.msg), 'info');
}else{
datadictoryDialog.dialog('close');
$.messager.show({
msg : '编辑成功!',
title : '提示'
});
datadictoryDatagrid.datagrid('reload');
}
}
});
}
} ,{
text : '取消',
handler : function() {
datadictoryDialog.dialog('close');
}
}]
}).dialog('close');
datadictoryDatagrid = $('#datadictoryDatagrid').datagrid({
url : 'datadictoryAction!eachJsonQuerySmDataDictoryList.action',
title : '',
iconCls : 'icon-save',
pagination : true,
pageSize : 15,
pageList : [ 15, 30, 45, 60 ],
fit : true,
fitColumns : true,
nowrap : false,
border : false,
singleSelect : true,
idField : 'datadictoryId',
frozenColumns : [ [{
title : '',
field : 'datadictoryId',
checkbox : true
}, {
title : '序号',
field : 'index',
width : 30,
formatter : function(value, row, index) {
return index+1 + (datadictoryDatagrid.datagrid("getPager").pagination("options").pageNumber-1)*datadictoryDatagrid.datagrid("getPager").pagination("options").pageSize;
}
}, {
field : 'taskType',
title : '任务类型',
width : 200
},{
field : 'name',
title : '任务名称',
width : 200
}] ],
columns : [ [ {
field : 'memo',
title : '说明',
width : 300
} ] ],
onDblClickRow : function() {
},
onRowContextMenu : function(e, rowIndex, rowData) {
e.preventDefault();
$(this).datagrid('unselectAll');
$(this).datagrid('selectRow', rowIndex);
$('#menu').menu('show', {
left : e.pageX,
top : e.pageY
});
}
});

});

function searchDataDictory() {
datadictoryDatagrid.datagrid('load', {
"datadictory.name" : $('#nameSearch').val()
});

}

function appendDataDictory() {
datadictoryDialog.dialog('open');
datadictoryForm.form('clear');
}

function editDataDictory() {
var rows = datadictoryDatagrid.datagrid('getSelections');
if (rows.length != 1 && rows.length != 0) {
$.messager.show({
msg : '只能编辑一个字典值！',
title : '提示'
});
} else if (rows.length == 1) {
datadictoryDialog.dialog('open');
datadictoryForm.form('clear');
datadictoryForm.form('load', {
"datadictory.datadictoryId" : rows[0].datadictoryId,
"datadictory.taskType" : rows[0].taskType,
"datadictory.name" : rows[0].name,
"datadictory.memo" : rows[0].memo
});
} else {
$.messager.alert('提示', '请选择要编辑的字典值！', 'error');
}
}

function deleteDataDictory() {
var rows = datadictoryDatagrid.datagrid('getSelections');
if (rows.length != 1 && rows.length != 0) {
$.messager.show({
msg : '只能删除一个字典值！',
title : '提示'
});
} else if (rows.length == 1) {
$.messager.confirm('请确认', '您要删除当前所选字典值?', function(result) {
if (result) {
$.ajax({
url : 'datadictoryAction!eachJsonDeleteSmDataDictory.action?datadictory.datadictoryId=' + rows[0].datadictoryId,
cache : false,
dataType : "json",
success : function(data) {
if(data.result == "failed"){
$.messager.alert('系统提示', decodeURI(data.msg), 'info');
}else{
datadictoryDatagrid.datagrid('unselectAll');
datadictoryDatagrid.datagrid('reload');
$.messager.show({
title : '提示',
msg : '删除成功！'
});
}
}
});
}
});
} else {
$.messager.alert('提示', '请选择要删除的字典值！', 'error');
}
}

谢谢各位大侠在线等啊

...全文

287 5 打赏收藏转发到动态举报

写回复

用AI写文章

5 条回复

切换为时间正序

请发表友善的回复…

发表回复

fufujuan 2013-05-17

打赏
举报

引用楼主 fufujuan 的回复:

请问各位大侠，前段用Jquery框架+js后台处理+jsp展现，现在要在增加弹出框的输入里读取已输入的值，这个值是否可以从数据读取或是用数组保存然后读取，请问这样然后实现？贴代码了： Jsp：  <link rel="stylesheet" type="text/css" href="jquery-easyui-1.3.2/themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="jquery-easyui-1.3.2/themes/icon.css"> <script type="text/javascript" src="jquery-easyui-1.3.2/jquery-1.8.0.min.js"> </script> <script type="text/javascript" src="jquery-easyui-1.3.2/jquery.easyui.min.js"> </script> <script type="text/javascript" src="jquery-easyui-1.3.2/locale/easyui-lang-zh_CN.js"> </script>  <script type="text/javascript" src="jsp/system-manage/jw_datadictory.js"> </script> </head> <body class="easyui-layout" fit="true"> <div region="north" style="overflow: hidden; height: 120px;" title="数据字典"> <fieldset style="padding: 5px; height: 40px; padding: 5px;"> <legend> 查询 </legend> <table style="font-size: 12px;"> <form id="datadictorySearchForm" name="datadictorySearchForm" method="post" action="datadictoryAction!eachJsonSaveSmDataDictory.action"> <tr> <td> 任务名称: </td> <td colspan="2"> <input id="nameSearch" name="datadictory.name" class="easyui-validatebox" style="width: 100px;" /> </td> <td> <a class="easyui-linkbutton" iconCls="icon-search" plain="true" onclick="searchDataDictory();" href="javascript:void(0);">查找</a> </td> </tr> </form> </table> </fieldset> <div style="height: 20px;"> <a class="easyui-linkbutton" iconCls="icon-add" onclick="appendDataDictory();" plain="true" href="javascript:void(0);">增加</a> <a class="easyui-linkbutton" iconCls="icon-edit" onclick="editDataDictory();" plain="true" href="javascript:void(0);">编辑</a> <a class="easyui-linkbutton" iconCls="icon-remove" onclick="deleteDataDictory();" plain="true" href="javascript:void(0);">删除</a> </div> </div> <div region="center" title="数据字典列表" style="background: #fafafa; width: auto;"> <table id="datadictoryDatagrid"></table> <div id="menu" class="easyui-menu" style="width: 120px; display: none;"> <div onclick="appendDataDictory();" iconCls="icon-add"> 增加 </div> <div onclick="editDataDictory();" iconCls="icon-edit"> 编辑 </div> <div onclick="deleteDataDictory();" iconCls="icon-remove"> 删除 </div> </div> <div id="datadictoryDialog" style="display: none;width:400px;overflow: hidden; padding: 20px;"> <table class="tableForm"> <form id="datadictoryForm" name="datadictoryForm" method="post"> <tr> <td style="text-align: right;"> 任务类型 </td> <td> <input name="datadictory.datadictoryId" type="hidden" /> <input name="datadictory.taskType" class="easyui-combobox" required="true" /> </td> </tr> <tr> <td style="text-align: right;"> 任务名称 </td> <td> <input name="datadictory.name" class="easyui-combobox" required="true" /> </td> </tr> <tr> <td style="text-align: right;"> 说明 </td> <td > <textarea name="datadictory.memo" class="easyui-validatebox" style="width: 300px; height : 100px;overflow: auto;"></textarea> </td> </tr> </table> </form> </div> </div> </body> </html> js的代码： var datadictoryDatagrid; var datadictoryDialog; var datadictoryForm; $(function() { datadictoryForm = $('#datadictoryForm').form(); datadictoryDialog = $('#datadictoryDialog').show().dialog({ modal : true, title : '字典值编辑', buttons : [ { text : '保存', handler : function() { datadictoryForm.form('submit', { url : 'datadictoryAction!eachJsonSaveOrUpdateSmDataDictory.action', success : function(data) { var d = $.parseJSON(data); if(data.result == "failed"){ $.messager.alert('系统提示', decodeURI(d.msg), 'info'); }else{ datadictoryDialog.dialog('close'); $.messager.show({ msg : '编辑成功!', title : '提示' }); datadictoryDatagrid.datagrid('reload'); } } }); } } ,{ text : '取消', handler : function() { datadictoryDialog.dialog('close'); } }] }).dialog('close'); datadictoryDatagrid = $('#datadictoryDatagrid').datagrid({ url : 'datadictoryAction!eachJsonQuerySmDataDictoryList.action', title : '', iconCls : 'icon-save', pagination : true, pageSize : 15, pageList : [ 15, 30, 45, 60 ], fit : true, fitColumns : true, nowrap : false, border : false, singleSelect : true, idField : 'datadictoryId', frozenColumns : [ [{ title : '', field : 'datadictoryId', checkbox : true }, { title : '序号', field : 'index', width : 30, formatter : function(value, row, index) { return index+1 + (datadictoryDatagrid.datagrid("getPager").pagination("options").pageNumber-1)*datadictoryDatagrid.datagrid("getPager").pagination("options").pageSize; } }, { field : 'taskType', title : '任务类型', width : 200 },{ field : 'name', title : '任务名称', width : 200 }] ], columns : [ [ { field : 'memo', title : '说明', width : 300 } ] ], onDblClickRow : function() { }, onRowContextMenu : function(e, rowIndex, rowData) { e.preventDefault(); $(this).datagrid('unselectAll'); $(this).datagrid('selectRow', rowIndex); $('#menu').menu('show', { left : e.pageX, top : e.pageY }); } }); }); function searchDataDictory() { datadictoryDatagrid.datagrid('load', { "datadictory.name" : $('#nameSearch').val() }); } function appendDataDictory() { datadictoryDialog.dialog('open'); datadictoryForm.form('clear'); } function editDataDictory() { var rows = datadictoryDatagrid.datagrid('getSelections'); if (rows.length != 1 && rows.length != 0) { $.messager.show({ msg : '只能编辑一个字典值！', title : '提示' }); } else if (rows.length == 1) { datadictoryDialog.dialog('open'); datadictoryForm.form('clear'); datadictoryForm.form('load', { "datadictory.datadictoryId" : rows[0].datadictoryId, "datadictory.taskType" : rows[0].taskType, "datadictory.name" : rows[0].name, "datadictory.memo" : rows[0].memo }); } else { $.messager.alert('提示', '请选择要编辑的字典值！', 'error'); } } function deleteDataDictory() { var rows = datadictoryDatagrid.datagrid('getSelections'); if (rows.length != 1 && rows.length != 0) { $.messager.show({ msg : '只能删除一个字典值！', title : '提示' }); } else if (rows.length == 1) { $.messager.confirm('请确认', '您要删除当前所选字典值?', function(result) { if (result) { $.ajax({ url : 'datadictoryAction!eachJsonDeleteSmDataDictory.action?datadictory.datadictoryId=' + rows[0].datadictoryId, cache : false, dataType : "json", success : function(data) { if(data.result == "failed"){ $.messager.alert('系统提示', decodeURI(data.msg), 'info'); }else{ datadictoryDatagrid.datagrid('unselectAll'); datadictoryDatagrid.datagrid('reload'); $.messager.show({ title : '提示', msg : '删除成功！' }); } } }); } }); } else { $.messager.alert('提示', '请选择要删除的字典值！', 'error'); } } 谢谢各位大侠在线等啊

没分了这里不可以再编辑哦

fufujuan 2013-05-17