{assign var=emp_sts value=$sm.emp_sts}
<div style="width:405px;">
    <div class="modal_heading">
        <div class="lft fltlft"></div>
        <div class="mdl fltlft" style="width:333px;">
            Job profile for <b>{$smarty.session.fullname}</b>
        </div>
        <div class="rht fltlft"></div>
        <div class="clear"></div>
    </div>
    <div class="modal_body">

    <form id="job_info" name="job_info" method="post" action="javascript:void(0);">
    <table>
      <tr>
        <td align="right"><b>First name: &nbsp; </b></td>
        <td>
            <input type="text" name="emp[firstname]" id="fname" class="text" value="{$sm.res_emp.firstname}">
        </td>
      </tr>
      <tr>
        <td align="right"><b>Middle name: &nbsp; </b></td>
        <td>
            <input type="text" name="emp[middlename]" id="mname" class="text" value="{$sm.res_emp.middlename}">
        </td>
      </tr>
      <tr>
        <td align="right"><b>Last name: &nbsp; </b></td>
        <td>
            <input type="text" name="emp[lastname]" id="lname" class="text" value="{$sm.res_emp.lastname}">
        </td>
      </tr>
      <tr>
        <td align="right">
            <b>Division: &nbsp;  </b>
        </td>
        <td>
            <select name="emp[division]" id="dvision" onchange="showDepartmentTeamJob(this,'dpartment','tm','jobtitle','1');" >
                <option value="">-- Select --</option>
                {html_options options=$sm.division selected=$sm.res_emp.division}
            </select>
        </td>
      </tr>
      <tr>
        <td align="right">
            <b>Department: &nbsp;  </b>
        </td>
        <td>
            <select name="emp[department]" onchange="showDepartmentTeamJob(this,'tm','jobtitle','','2');" id="dpartment">
                <option value="">-- Select --</option>
                {html_options options=$sm.department selected=$sm.res_emp.department}
            </select>
        </td>
      </tr>
       <tr>
        <td align="right">
            <b>Team: &nbsp;  </b>
        </td>
        <td>
            <select name="emp[team]" onchange="showDepartmentTeamJob(this,'jobtitle','','','3');" id="tm">
                <option value="">-- Select --</option>
                {html_options options=$sm.team selected=$sm.res_emp.team}
            </select>
        </td>
      </tr>
      <tr>
        <td align="right">
            <b>Job title: &nbsp;  </b>
        </td>
        <td>
            <select name="emp[job_title]" id="jobtitle" >
                <option value="">-- Select --</option>
                {html_options options=$sm.job_title selected=$sm.res_emp.job_title}
            </select>
        </td>
      </tr>
      <tr>
        <td align="right">
            <b>Employment: &nbsp; </b>
        </td>
        <td>
            <select name="emp[emp_status]" id="emp_status" >
                {html_options options=$emp_sts selected=$sm.res_emp.emp_status}
            </select>
        </td>
      </tr>
      <tr>
        <td></td>
        <td><input type="button" value="Save" onclick="saveJobProfile();" class="login_btn"></td>
      </tr>
    </table>
    </form>
    
	</div>
</div>
{literal}
<script type="text/javascript"> 
function showDepartmentTeamJob(obj,id1,id2,id3,lvl){
	var id = obj.value;
	var url = "##LBL_SITE_URL##index.php/";
	$.post(url,{page:"employee",choice:"showDepartmentTeamJob",ce:0,id:id,flg:id1},function(res){
		$('#'+id1).html(res);
		if(lvl==1){
			$('#'+id2).html('<option value="">-- Select --</option>');
			$('#'+id3).html('<option value="">-- Select --</option>');
		}else if(lvl==2){
			$('#'+id3).html('<option value="">-- Select --</option>');
		}
	});
}
function saveJobProfile(){
	var res = jobInfo();
	if(res){
		cShowActivity('2');
		var flag = $("#chc").val();
		var data=$("#job_info").serialize();
		var url="##LBL_SITE_URL##index.php/employee/updateJobProfile?"+data;
		$.post(url,{ce:0,flag:flag},function (res){
			$("#target").html($("#jmsg").val());
			$("#leftpan").html(res);
			$.fancybox.close();
			cHideActivity();
		});
	}else
		return false;
}
function jobInfo(){		
	var validator_job_info=$("#job_info").validate({
		rules: {
			"emp[firstname]": {
				required:true
			},
			"emp[division]": {
				required:true
			},
			"emp[department]": {
				required:true
			}
		},
		messages: {
			"emp[firstname]":{
				required:flexymsg.required
			},
			"emp[division]":{
				required:flexymsg.required
			},
			"emp[department]":{
				required:flexymsg.required
			}
		}
	});
	return validator_job_info.form();
}
forminfo('#job_info');
</script>
<style type="text/css">
#job_info .text {
	width:250px;
	margin-right:10px;
	padding:3px;
	border:1px solid #ccc;
	letter-spacing:1px;
}
#job_info select {
	border:1px solid #ccc;
	width:259px;	
	padding:4px;
}
</style>
{/literal}