Hi! Can anyone help me with my datagrid..Please!
All are functioning properly except my Save button... Whenever I create new user or edit user information then I clicked SAVE button it doesn't save.. It seems that the error is in part of saveuser() function in my script, but I don't how to debug it.. Please help me.
Here is my Script:
<script type="text/javascript">
$(function(){
$('#dg').datagrid({
pageSize:25,
pageList:[25,50,75,100]
});
});
var url;
function newUser(){
$('#dlg').dialog('open').dialog('setTitle','New Computer Information');
$('#fm').form('clear');
url = 'dissave.php';
obj1 = document.getElementById('exportword');
obj1.style.visibility = 'hidden';
obj2 = document.getElementById('exportexcel');
obj2.style.visibility = 'hidden';
obj3 = document.getElementById('printdoc');
obj3.style.visibility = 'hidden';
}
function editUser(){
var row = $('#dg').datagrid('getSelected');
if (row){
$('#dlg').dialog('open').dialog('setTitle','Edit Computer Information');
$('#fm').form('load',row);
url = 'disupdate.php?id='+row.id;
}
obj1 = document.getElementById('exportword');
obj1.style.visibility = 'visible';
obj2 = document.getElementById('exportexcel');
obj2.style.visibility = 'visible';
obj3 = document.getElementById('printdoc');
obj3.style.visibility = 'visible';
}
function saveUser(){
$('#fm').form('submit',{
url: url,
onSubmit: function(){
return $(this).form('validate');
},
success: function(result){
var result = eval('('+result+')');
if (result.success){
$('#dlg').dialog('close'); // close the dialog
$('#dg').datagrid('reload'); // reload the user data
} else {
$.messager.show({
title: 'Error',
msg: result.msg
});
}
}
});
}
function removeUser(){
var row = $('#dg').datagrid('getSelected');
if (row){
$.messager.confirm('Confirm','Are you sure you want to remove this user?',function(r){
if (r){
$.post('disremove.php',{id:row.id},function(result){
if (result.success){
$('#dg').datagrid('reload'); // reload the user data
} else {
$.messager.show({ // show error message
title: 'Error',
msg: result.msg
});
}
},'json');
}
});
}
}
function doSearch(){
if (window.event.keyCode == 13){
$('#dg').datagrid('load',{
search1: $('#search1').val(),
});
}
}
function doSearch1(){
$('#dg').datagrid('load',{
search1: $('#search1').val(),
});
}
function logout(){
var conlog = confirm("Are you sure you wish to logout?");
if (conlog){
return true;
}
else{
return false;
}
}
</script>
Here is my datagrid html code with edit form:
<div id='middle'>
<table border='0' align='center' style="border-collapse:collapse" >
<tr height='30px'>
<td></td>
</tr>
<tr>
<td>
<!-- datagrid-->
<table id="dg" class="easyui-datagrid" style="width:1100px;height:740px"
url="disget.php"
toolbar="#toolbar" pagination="true"
rownumbers="true" fitColumns="false" singleSelect="true" nowrap="true">
<thead>
<tr>
<th field="item" auto="true" sortable='true' editor="{type:'validatebox',options:{required:true}}">Item Name</th>
<th field="brand" sortable="true" auto="true" editor="{type:'validatebox',options:{required:true}}">Brand Name</th>
<th field="model" sortable="true" auto="true" editor="text">Model Name</th>
<th field="color" sortable="true" auto="true" editor="text">Color</th>
<th field="desc" sortable="true" auto="true" editor="text">Item Description</th>
<th field="serial" sortable="true" auto="true" editor="text">Serial No.</th>
<th field="date" sortable="true" auto="true" editor="text">Date Given</th>
<th field="dept" sortable="true" auto="true" editor="text">Department</th>
<th field="status" sortable="true" auto="true" editor="text">Status</th>
<th field="others" sortable="true" auto="true" editor="text">Others/Problems</th>
<th field="history" sortable="true" auto="true" editor="text">Item History</th>
</tr>
</thead>
</table>
<div id="toolbar">
<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newUser()">New Item Information</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editUser()">Edit/Print Item Information</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="removeUser()">Delete</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-print2" plain="true" onclick="printsample()">Print</a>
<input id="search1" style="line-height:26px;border:1px solid #ccc" hidden='true'>
</div>
<div id="dlg" class="easyui-dialog" style="width:680px;height:700px; background:#f1f1f1"
closed="true" buttons="#dlg-buttons">
<!-- FORM -->
<form id="fm" method="post" novalidate>
<div class="fitem"><br>
<table border='0' align='center' style='font-size:12px;
font-weight:bold;' cellpadding='10px'>
<tr>
<td>Item Name<br><input style='padding-left: 10px;height: 30px;width: 267px;' name="item" class="easyui-validatebox" required="false"></td><td>
<br><input style='height: 30px;width: 20px;' name="id" id="computerid" hidden='true'>
</td><td>Date Given<br><input style='padding-left: 10px;height: 30px;width: 267px;' name="date"></td>
</tr>
<tr>
<td colspan='2'>Brand Name<br><input style='padding-left: 10px;height: 30px;width: 267px;' name="brand"></td>
<td>Model Name<br><input style='padding-left: 10px;height: 30px;width: 267px;' name="model"></td>
</tr>
<tr>
<td colspan='2'>Color<br><input style='padding-left: 10px;height: 30px;width: 267px;' name="color"></td>
<td>Serial No.<br><input style='padding-left: 10px;height: 30px;width: 267px;' name="serial"></td>
</tr>
<tr>
<td>Department<br>
<select style='padding-left: 10px;height: 30px;width: 267px;' name='dept'>
<option value="MIS">Management Information System</option>
<option value="Crew">Personal Injury</option>
<option value="Marine">Marine Claims</option>
<option value="Billing">Billing</option>
<option value="Treasury">Treasury</option>
<option value="HRD">Human Resources</option>
<option value="OP">Office of the President</option>
<option value="OEVP">Office of the Executive Vice President</option>
<option value="Accounting">Accounting</option>
<option value="Endorsement">Endorsement</option>
<option value="Medical">Medical</option>
</select>
</td></td><td>
<td>Status<br><input style='padding-left: 10px;height: 30px;width: 267px;' name="status"></td>
</tr>
<tr>
<td colspan='2' valign='top'>Item Description<br><textarea rows="6" cols="31" name='desc' ></textarea></td>
<td valign='top'>Others/Problems<br><textarea rows="6" cols="31" name='others' placeholder='*include date'></textarea></td>
</tr>
<tr>
<td colspan='3' valign='top'>Item History<br><textarea rows="6" cols="70" name='history' placeholder='*include date'></textarea></td>
</tr>
</table>
</div>
</form>
</div>
<div id="dlg-buttons">
<a href="#" class="easyui-linkbutton" id ="exportword" iconCls="icon-word" onclick="doExportword()">Word</a>
<a href="#" class="easyui-linkbutton" id ="exportexcel" iconCls="icon-excel" onclick="doExportexcel()">Excel</a>
<a href="#" class="easyui-linkbutton" id ="printdoc" iconCls="icon-print" onclick="doPrint()">Print</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-ok" onclick="saveUser()">Save</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')">Cancel</a>
</div>
<!-- datagrid-->
</td>
</tr>
<tr height='30px'>
<td></td>
</tr>
</table>
</div>
