Progress Bar of Completion of Profile

Screen Shot

prog

index.php

<?php
session_start();

$nfconx = mysql_connect(“localhost”, “root”, “”);
mysql_select_db(“jobsite”,$nfconx);
?>
<style>
.progres-bar{ margin:70px 40px 20px 0px; font-size:12px; font-family:sans-serif;}
.progres-bar li{ list-style:none; padding:4px 10px; border-bottom:1px #2B69B0 dotted;}
.progres-bar li span{display:block; padding:0 0 4px 0;}
.progres-bar li>div{ background:#666; display:inline-block; width:200px; box-shadow:inset 0 0 3px #000; padding:3px; border-radius:30px; }
.progres-bar li div div{ background:#69EA69; width:30px; background: -moz-linear-gradient(top, #e5f46e 0%, #b0e868 100%);background: -webkit-linear-gradient(top, #e5f46e 0%, #b0e868 100%); border:none; border-radius:20px; height:13px;}

.seeker-login {
width:354px; float:left; margin-left:20px;
margin: 5px;
border: 1px #7aabe8 solid;
background: url(images/reapeat-back.png) repeat-x;
}

.seeker-login h2
{
background: url(images/search-job-hed.png) no-repeat;
width: 250px;
height: 56px;
position: absolute;
z-index: 1;
font-family: Arial, Helvetica, sans-serifl;
font-size: 14px;
text-indent: 20px;
line-height: 40px;
color: #FFF;
margin: 5px 0px 0px 0px;
margin-left: -7px;
padding: 2px 0px 0px 0px;
}

</style>
<?php
//////////////////////////Personal details bar start///////////////////////
$pdq=”select * from personal_details where user_id=31″;
//$pdq=”select * from personal_details where user_id='”.$_SESSION[‘uid’].”‘”;
$pdrw=mysql_query($pdq);
$pdreslt=mysql_fetch_array($pdrw);

// personal_details table
// index 0 1 2 3 4 5 6
// id user_id first_name last_name state city gender
// 1 21 nitin sangal UP MU male
// 2 33 hjbhj bhjbhj AS SI male
//#########################################################################
//#########################################################################
//##### loop start from 2 because in result_row index 2 is first name######
//##### loop end from 6 because last field index of table is 6 ######
//##### we increase 10 to calculate percentage suppose user fill ######
//##### 3 fields then 30 out of 50(totalfields*10=5*10) ######
//##### width of progress bar Div is Percentage ######
//#########################################################################
//#########################################################################
$i=0;
for($k=2;$k<=6;$k++) {
if($pdreslt[$k]<>””)
{ $i=$i+10;}

}

$pdtotal = 50;// Total processes/Total fields * 10
$pdpercent = intval($i/$pdtotal * 100).”%”; // Calculate the percentage
//Personal details bar end
// Work experience bar start /////
$weq=”select * from work_exp where user_id=’31′”;
//$weq=”select * from work_exp where user_id='”.$_SESSION[‘uid’].”‘”;
$werw=mysql_query($weq);
$wereslt=mysql_fetch_array($werw);
//print_r($wereslt);
for($k=2;$k<12;$k++) {
if($wereslt[$k]<>””)
{$wei=$wei+10;}

}
$wetotal = 100;// Total processes

$wepercent = intval($wei/$wetotal * 100).”%”; // Calculate the percentage

// Work experience bar end //
// Education Details bar start //
$edq=”select * from education_details where user_id='”.$_SESSION[‘uid’].”‘”;
$edrw=mysql_query($edq);
$edreslt=mysql_fetch_array($edrw);
//print_r($wereslt);
for($k=2;$k<6;$k++) {
if($edreslt[$k]<>””)
{$edi=$edi+10;}

}
$edtotal = 40;// Total processes
$edpercent = intval($edi/$edtotal * 100).”%”; // Calculate the percentage
// Education Details bar end //
?>
<div class=”seeker-login”>
<h2>Your Profile bar</h2>

<ul class=”progres-bar”>
<li><span>Personal Details</span><div id=”pdprogress”></div>
<?php

// Javascript for updating the progress bar and information
echo ‘<script language=”javascript”>
document.getElementById(“pdprogress”).innerHTML=”<div style=\”width:’.$pdpercent.’;background-color:#00ff00;\”>&nbsp;</div>”;

</script>’;
echo ‘<td align=”left”>’.$pdpercent.'</td>’;
?></li>
<li><span>Professional Details</span><div id=”weprogress”></div><?php

// Javascript for updating the progress bar and information
echo ‘<script language=”javascript”>
document.getElementById(“weprogress”).innerHTML=”<div style=\”width:’.$wepercent.’;background-color:#00ff00;\”>&nbsp;</div>”;

</script>’;
echo ‘<td align=”left”>’.$wepercent.'</td>’;
?></li>
<li><span>Educational Details</span><div id=”edprogress”></div><?php

// Javascript for updating the progress bar and information
echo ‘<script language=”javascript”>
document.getElementById(“edprogress”).innerHTML=”<div style=\”width:’.$edpercent.’;background-color:#00ff00;\”>&nbsp;</div>”;

</script>’;
echo ‘<td align=”left”>’.$edpercent.'</td>’;
?></li>
</ul>

</div>

DataBase

3 Tables are create into Database in Phpmyadmin

1. education_details Table

CREATE TABLE IF NOT EXISTS `education_details` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`user_id` int(11) NOT NULL,
`high_qual` varchar(255) NOT NULL,
`degree` varchar(255) NOT NULL,
`inst_name` varchar(255) NOT NULL,
`course_type` varchar(255) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ;


— Dumping data for table `education_details`

INSERT INTO `education_details` (`id`, `user_id`, `high_qual`, `degree`, `inst_name`, `course_type`) VALUES
(1, 21, ‘1’, ‘1’, ‘Delhi university’, ‘Full Time’);

2. personal_details Table

CREATE TABLE IF NOT EXISTS `personal_details` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`user_id` int(11) NOT NULL,
`first_name` varchar(255) NOT NULL,
`last_name` varchar(255) NOT NULL,
`state` varchar(255) NOT NULL,
`city` varchar(255) NOT NULL,
`gender` varchar(8) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=3 ;

INSERT INTO `personal_details` (`id`, `user_id`, `first_name`, `last_name`, `state`, `city`, `gender`) VALUES
(1, 31, ‘hjbhj’, ‘bhjbhj’, ‘AS’, ‘SI’, ‘male’);

3. work_exp Table

CREATE TABLE IF NOT EXISTS `work_exp` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`user_id` int(11) NOT NULL,
`total_exp` varchar(255) NOT NULL,
`annual_sal` varchar(255) NOT NULL,
`industry` varchar(255) NOT NULL,
`functional_area` varchar(255) NOT NULL,
`job_designation` varchar(255) NOT NULL,
`job_company_name` varchar(255) NOT NULL,
`job_duration_from` varchar(255) NOT NULL,
`job_duration_to` varchar(255) NOT NULL,
`key_skill` varchar(255) NOT NULL,
`key_skill_exp` varchar(255) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=4 ;

INSERT INTO `work_exp` (`id`, `user_id`, `total_exp`, `annual_sal`, `industry`, `functional_area`, `job_designation`, `job_company_name`, `job_duration_from`, `job_duration_to`, `key_skill`, `key_skill_exp`) VALUES
(1, 31, ‘1year 1months’, ‘1.1lakh’, ‘Information Technology’, ‘Admin & Office Support/Secretary’, ‘1’, ‘1’, ‘1year 2months’, ‘1year 4months’, ”, ”);

images/ (Create a folder of images named)

Copy and Paste these two pictures into images folder

search-job-hed reapeat-back

Leave a comment

October 24, 2013 · 6:43 am

Leave a comment