shivavalkyre
Newbie
Posts: 39
|
|
« Reply #2 on: April 21, 2016, 12:24:48 AM » |
|
Hi, stworthy thanks for quick reply, but i have tried that code but it still not work for me here my complete code <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" type="text/css" href="./themes/bootstrap/easyui.css"> <link rel="stylesheet" type="text/css" href="./themes/color.css"> <link rel="stylesheet" type="text/css" href="./themes/icon.css"> <link rel="stylesheet" type="text/css" href="./css/demo.css"> <link rel="stylesheet" type="text/css" href="./css/navpanel.css"> <script type="text/javascript" src="./js/jquery.min.js"></script> <script type="text/javascript" src="./js/jquery.easyui.min.js"></script> <script type="text/javascript" src="./js/jquery.edatagrid.js"></script> <script type="text/javascript" src="../js/accounting.js"></script>
<script type="text/javascript"> function codeClose() { //alert('ok'); //$('#cc').panel('close'); //$('#cc').layout('panel','west').panel('close'); //$('#cc').layout('panel','center').panel('close'); //$('#cc').layout('resize'); $('#cc').hide(); //$('#tt').tabs('close', 'About'); $('#tt').tabs('close', 'Dependents'); $('#tt').tabs('close', 'Job Historical'); $('#tt').tabs('close', 'Salary'); $('#tt').tabs('close', 'Report To'); $('#tt').tabs('close', 'Document List'); $('#tt').tabs('close', 'Qualification'); $('#tt').tabs('close', 'Work Schedule'); } window.onload = codeClose; </script> </head> <body> <div id="p" class="easyui-panel" title="Employee Information" style="width:1480px"> <table border="0" width="100%"> <tr> <td> <input id="sb" class="easyui-searchbox" data-options="prompt:'Please Input Value',menu:'#mm',searcher:doSearch" style="width:300px;border-radius:8px;"></input> <div id="mm"> <div data-options="name:'employeename'">Employee Name</div> <div data-options="name:'supervisor'">Supervisor Name</div> <div data-options="name:'jobtitle'">Job Title</div> <div data-options="name:'employmentstatus'">Employment Status</div> <div data-options="name:'subunit'">Sub Unit</div> </div> <hr> </td> </tr> <tr> <td> <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add'">New Data</a> <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-delete'">Delete</a> <hr> <table id="dg" class="easyui-datagrid" title="Employee List" style="width:1470px;" pagination="true" data-options="singleSelect:true,collapsible:true,url:'./control/get_personel.php',pagePosition:'both',onDblClickRow:onDblClickRow"> <thead> <tr> <th data-options="field:'kryid',width:80, sortable:true">ID</th> <th data-options="field:'nama',width:190,sortable:true">Employee Name</th> <th data-options="field:'JABATAN',width:250,align:'left',sortable:true">Job Title</th> <th data-options="field:'StatusKry',width:180,align:'left',sortable:true">Employment Status</th> <th data-options="field:'BagianName',width:200,sortable:true">Sub unit</th> <th data-options="field:'location',width:280,align:'left',sortable:true">Location</th> <th data-options="field:'supervisorid',width:280,align:'left',sortable:true">Supervisor</th> <th data-options="field:'TGLMSK',width:50,align:'left',sortable:true,hidden:true">Join Date</th> <th data-options="field:'TGLLHR',width:50,align:'left',sortable:true,hidden:true">Date of Birth</th> <th data-options="field:'nokry',width:50,align:'left',sortable:true,hidden:true">Other No Employee</th> <th data-options="field:'jkid',width:10,align:'left',sortable:true,hidden:true">JKID</th> <th data-options="field:'Status_Nikah',width:10,align:'left',sortable:true,hidden:true">Marital Status</th> <th data-options="field:'email',width:10,align:'left',sortable:true,hidden:true">Email</th> <th data-options="field:'HP1',width:10,align:'left',sortable:true,hidden:true">Phone</th> </tr> </thead> </table> <div id="cc" style="width:99.9%;height:520px;"> <div data-options="region:'west'" style="width:215px;"> <div id="photo" class="easyui-panel" title="Photo" style="width:212px;height:240px;"><center><img src="../image/blank.jpg" style=" width:200;height:210;display: block;" border="0"> </img> </div> <div style="padding:4;margin-left:5"> <a href="#" class="easyui-linkbutton c7" style="width:190px" onclick="javascript:$('#tt').tabs('select', 'About')">About</a> </div> <div style="padding:4;margin-left:5"> <a href="#" class="easyui-linkbutton c2" style="width:190px" onclick="javascript:addTab('Dependents','http://localhost/BT/content/content_dependents.html')">Dependents</a> </div> <div style="padding:4;margin-left:5"> <a href="#" class="easyui-linkbutton c7" style="width:190px" onclick="javascript:addTab('Job Historical')">Job Historical</a> </div> <div style="padding:4;margin-left:5"> <a href="#" class="easyui-linkbutton c2" style="width:190px" onclick="javascript:addTab('Salary')">Salary</a> </div> <div style="padding:4;margin-left:5"> <a href="#" class="easyui-linkbutton c7" style="width:190px" onclick="javascript:addTab('Report To')">Report To</a> </div> <div style="padding:4;margin-left:5"> <a href="#" class="easyui-linkbutton c5" style="width:190px"onclick="javascript:addTab('Document List')">Document List</a> </div> <div style="padding:4;margin-left:5"> <a href="#" class="easyui-linkbutton c7" style="width:190px"onclick="javascript:addTab('Qualification')">Qualification</a> </div> <div style="padding:4;margin-left:5"> <a href="#" class="easyui-linkbutton c6" style="width:190px"onclick="javascript:addTab('Work Schedule')">Work Schedule</a> </div> </div> <div data-options="region:'center'"> <div id ="tt" class="easyui-tabs" style="width:1250px;height:500px"> <div title="About"> <!-- start tab --> <ul> <li> <label style="width:20px">Full Name</label> <span style="margin-left:6.2em"> <input id="fullname" name="fullname" class="easyui-textbox" disabled="true" style="width:16%;height:25px;border-radius:4px;"> </span> <span style="margin-left:6.2em"> <label style="width:30px">Sub Unit</label> <span style="margin-left:6.1em"> <input id="subunit" class="easyui-textbox" disabled="true" style="width:16%;height:25px;border-radius:4px;"> </span> </span> </li> <div style="margin:10"> </div> <li> <label style="width:30px">Date of Birth</label> <span style="margin-left:4.8em"> <input id="dob" class="easyui-datebox" disabled="true" data-options="formatter:myformatter,parser:myparser" style="width:190px;height:25px;border-radius:4px;"> </span> <span style="margin-left:6.5em"> <label style="width:30px">Location</label> <span style="margin-left:6.4em"> <input id="location" class="easyui-textbox" disabled="true" style="width:16%;height:25px;border-radius:4px;"> </span> </span> </li> </ul> <div style="margin:0.5"> </div> <hr width="99%"> <ul> <div style="margin:10"> </div> <li> <label style="width:30px">Employee ID</label> <span style="margin-left:4.8em"> <input id="employeeid" class="easyui-textbox" disabled="true" style="width:16%;height:25px;border-radius:4px;"> </span> <span style="margin-left:6.2em"></span> <label style="width:30px">Other Emp.No</label> <span style="margin-left:3.5em"> <input id="othnoemp" class="easyui-textbox" disabled="true" style="width:16%;height:25px;border-radius:4px;"> </span> </li> <div style="margin:10"> </div> <li> <label style="width:30px">Job Title</label> <span style="margin-left:7.2em"> <input id="jobtitle" class="easyui-textbox" disabled="true" style="width:16%;height:25px;border-radius:4px;"> </span> <span style="margin-left:6.2em"></span> <label style="width:30px">Supervisor</label> <span style="margin-left:5.2em"> <input id="supervisor" class="easyui-textbox" disabled="true" style="width:16%;height:25px;border-radius:4px;"> </span> </li> <div style="margin:10"> </div> <li> <label style="width:30px">Employment Status</label> <span style="margin-left:1.3em"> <input id="employeestatus" class="easyui-textbox" disabled="true" style="width:16%;height:25px;border-radius:4px;"> </span> </li> <div style="margin:10"> </div> <li> <label style="width:30px">Join Date</label> <span style="margin-left:6.7em"> <input id="joindate" class="easyui-datebox" disabled="true" data-options="formatter:myformatter,parser:myparser" style="width:190px;height:25px;border-radius:4px;"> </span> </li> <div style="margin:10"> </div> <li> <label style="width:30px">Gender</label> <span style="margin-left:7.7em"> <select id="gender" class="easyui-combobox" disabled="true" name="gender" style="width:190px;"> <option value="ML">Male</option> <option value="FM">Female</option> </select> </span> </li> <div style="margin:10"> </div> <li> <label style="width:30px">Marital Status</label> <span style="margin-left:4.3em"> <select id="maritalstatus" class="easyui-combobox" disabled="true" name="gender" style="width:190px;"> <option value="SL">Single</option> <option value="MR">Married</option> <option value="OT">Other</option> </select> </span> </li> </ul> <ul> <div style="margin:10"> </div> <label style="width:30px"><b>Contact</b></label> <span style="margin-left:0em"> </span> </ul> <div style="margin:0.5"> </div> <hr width="99%"> <ul> <li> <div style="margin:10"> </div> <label style="width:30px">Email</label> <span style="margin-left:8.5em"> <input id="email" class="easyui-textbox" disabled="true" style="width:16%;height:25px;border-radius:4px;" data-options="validType:'email'"> </span> </li> <li> <div style="margin:10"> </div> <label style="width:30px">Phone</label> <span style="margin-left:8.2em"> <input id="phone" class="easyui-textbox" disabled="true" style="width:16%;height:25px;border-radius:4px;"> </span> </li> </ul> <hr> <hr> <span style="margin-left:2.0em"> <a id="edit" href="#" class="easyui-linkbutton c1" style="width:120px;height:25x" onClick="editData()">Edit</a> </span> <span style="margin-left:2.0em"> <a href="javascript:void(0)" id="mb" class="easyui-menubutton" style="width:150px" data-options="menu:'#mm1',iconCls:'icon-edit'">Create Document</a> <div id="mm1" style="width:150px;"> <div data-options="iconCls:'icon-warning'">Warning Letter</div> <div data-options="iconCls:'icon-memo'">Memo</div> </div> </span> </div> <!-- tutup tab about--> <div data-options="closable:true" style="overflow:hidden" title="Dependents">
</div> <!-- tutup tab dependent--> <div data-options="closable:true" title="Job Historical">
</div> <!-- tutup tab job historical--> <div data-options="closable:true" title="Salary">
</div> <!-- tutup tab salary--> <div data-options="closable:true" title="Report To">
</div> <!-- tutup tab report to--> <div data-options="closable:true" title="Document List">
</div> <!-- tutup tab Document List--> <div data-options="closable:true" title="Qualification">
</div> <!-- tutup tab Document Qualification--> <div data-options="closable:true" title="Work Schedule">
</div> <!-- tutup tab Document Qualification--> </div> <!-- tutup tab --> </div> <!-- Tutup Region Center --> </div> <script type="text/javascript"> $(function(){ $('#cc').layout(); setHeight(); }); function setHeight(){ var c = $('#cc'); var p = c.layout('panel','center'); // get the center panel var oldHeight = p.panel('panel').outerHeight(); p.panel('resize', {height:'auto'}); var newHeight = p.panel('panel').outerHeight(); c.layout('resize',{ height: (c.height() + newHeight - oldHeight) }); } </script> <!--<div id="photo" class="easyui-panel" title="Photo" Style="width:200px;height:250px"></div>--> </td> </tr> </table> </div> <script> var collapse= false; function doSearch(value,name){
if (collapse==true){ //alert('You input: ' + value); //$('#dg').edatagrid('load',{nama: 'Sugino',}); if(name=='employeename'){ $('#dg').datagrid({url:'./control/get_personel.php?nama='+ value +'&name='+ name});} else if(name=='supervisor'){ $('#dg').datagrid({url:'./control/get_personel.php?supervisor='+ value +'&name='+ name}); } else if(name=='jobtitle'){ $('#dg').datagrid({url:'./control/get_personel.php?jobtitle='+ value +'&name='+ name}); } else if(name=='employmentstatus'){ $('#dg').datagrid({url:'./control/get_personel.php?employmentstatus='+ value +'&name='+ name}); } else if(name=='subunit'){ $('#dg').datagrid({url:'./control/get_personel.php?subunit='+ value +'&name='+ name}); } //$('#dg').datagrid({collapsed:true}); collapse= false; $('#dg').datagrid({title:"Employee List",collapsed:false}); } else{ $('#dg').datagrid({collapsed:false}); if(name=='employeename'){ $('#dg').datagrid({url:'./control/get_personel.php?nama='+ value +'&name='+ name});} else if(name=='supervisor'){ $('#dg').datagrid({url:'./control/get_personel.php?supervisor='+ value +'&name='+ name}); } else if(name=='jobtitle'){ $('#dg').datagrid({url:'./control/get_personel.php?jobtitle='+ value +'&name='+ name}); } else if(name=='employmentstatus'){ $('#dg').datagrid({url:'./control/get_personel.php?employmentstatus='+ value +'&name='+ name}); } else if(name=='subunit'){ $('#dg').datagrid({url:'./control/get_personel.php?subunit='+ value +'&name='+ name}); } } } function onDblClickRow(index,row){ var kryid= row.kryid; //alert (document.getElementById("dg").parentElement.nodeName); if (collapse==false){ $('#dg').datagrid({title:"Personal Details",collapsed:true, onExpand:onExpand}); $('#cc').show(); //Proses Baca Database $('#fullname').val(row.nama); //$('#fullname').textbox({disabled: t}); $('#subunit').val(row.BagianName); $('#employeeid').val(row.kryid); $('#jobtitle').val(row.JABATAN); $('#employeestatus').val(row.StatusKry); $('#dob').datebox('setValue',row.TGLLHR); $('#joindate').datebox('setValue',row.TGLMSK); $('#othnoemp').val(row.nokry); if (row.jkid==1){ $('#gender').combobox('setValue','ML') }else{ $('#gender').combobox('setValue','FM') } if (row.Status_Nikah=="Menikah") { $('#maritalstatus').combobox('setValue','MR') }else { $('#maritalstatus').combobox('setValue','SL') } $('#email').val(row.email); $('#phone').val(row.HP1); } }
function onExpand(){ //$('#p1').html(''); $('#dg').datagrid({title:"Employee List",collapsed:false}); $('#dg').datagrid('reload'); $('#tt').tabs('close', 'Dependents'); $('#tt').tabs('close', 'Job Historical'); $('#tt').tabs('close', 'Salary'); $('#tt').tabs('close', 'Report To'); $('#tt').tabs('close', 'Document List'); $('#tt').tabs('close', 'Qualification'); $('#cc').hide(); } //$(window).resize(function(){location.reload();});
function addTab(title,url){ if ($('#tt').tabs('exists', title)){ $('#tt').tabs('select', title); //alert(title); } else { var content = '<iframe scrolling="yes" frameborder="0" src="'+url+'" style="width:100%;height:100%;display: block;"></iframe>'; //alert (content); $('#tt').tabs('add',{ title: title, content:content, closable: true, fit: true }); } //$('#cc').layout('collapse','west'); //$('#ttab').tabs('close', 'Welcome'); } function myformatter(date){ var y = date.getFullYear(); var m = date.getMonth()+1; var d = date.getDate(); return y+'-'+(m<10?('0'+m):m)+'-'+(d<10?('0'+d):d); } function myparser(s){ if (!s) return new Date(); var ss = (s.split('-')); var y = parseInt(ss[0],10); var m = parseInt(ss[1],10); var d = parseInt(ss[2],10); if (!isNaN(y) && !isNaN(m) && !isNaN(d)){ return new Date(y,m-1,d); } else { return new Date(); } } function currdate(){ var today = new Date(); var dd = today.getDate(); var mm = today.getMonth()+1; //January is 0! var yyyy = today.getFullYear();
if(dd<10) { dd='0'+dd }
if(mm<10) { mm='0'+mm }
today = yyyy+'-'+mm+'-'+dd; return today; } document.getElementById("tanggal").innerHTML = currdate(); function editData(){ //$('#fullname').textbox({disabled: false}); $('#fullname').textbox('enable'); //alert(hasil); } </script> </body> </html>
i have several input where disabled true inside Tab 'About' and it will be enable when i click Edit Button using function edit Data. Perhaps i can find solution for my problem. Thanks Shiva
|