Tabdesign

@model EmployeeRegistrationViewModel
<div class="col-md-12">
<div class="nav-tabs-custom">
<ul class="nav nav-tabs pull-right">
<li><a href="#tab_8" data-toggle="tab">Document</a></li>
<li><a href="#tab_7" data-toggle="tab">Emergency Contact</a></li>
<li><a href="#tab_6" data-toggle="tab">Language Skill</a></li>
<li><a href="#tab_5" data-toggle="tab">References</a></li>
<li><a href="#tab_4" data-toggle="tab">Experience</a></li>
<li><a href="#tab_3" data-toggle="tab">Education</a></li>
<li class=""><a href="#tab_2" data-toggle="tab" aria-
expanded="false">Address</a></li>
<li class="active"><a href="#tab_1" data-toggle="tab" aria-
expanded="true">Basic Information</a></li>
<li class="pull-left header">SMS Setting</li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="tab_1">
<form role="form" asp-area="Employee" asp-
controller="EmployeeRegistration" asp-action="Index" class="form-horizontal
frm_employeedetail" method="post">


<div class="row">
<div class="form-group">
<label class="control-label mb-
10">Name</label>
<input type="text" class="form-control"
asp-for="inputEmployeeModel.Name">
<span asp-validation-
for="inputEmployeeModel.Name" class="text-danger"></span>
</div>
</div>
<label class="control-label mb-10">Dari
Name</label>
asp-for="inputEmployeeModel.NameDari">
for="inputEmployeeModel.NameDari" class="text-danger"></span>
</div>
</div>
</div>
</div>


<div class="row">
10">Surname</label>
asp-for="inputEmployeeModel.SurName">
for="inputEmployeeModel.SurName" class="text-danger"></span>
</div>
</div>
Surname</label>
asp-for="inputEmployeeModel.SurNameDari">
for="inputEmployeeModel.SurNameDari" class="text-danger"></span>
</div>
</div>
</div>
</div>


<div class="row">
10">F/Name</label>
asp-for="inputEmployeeModel.FatherName">
for="inputEmployeeModel.FatherName" class="text-danger"></span>
</div>
</div>
F/Name</label>
asp-for="inputEmployeeModel.FatherNameDari">
for="inputEmployeeModel.FatherNameDari" class="text-danger"></span>
</div>
</div>
</div>
</div>


<div class="row">
<label class="control-label mb-10">Date of
Birth</label>
id="emp_birthdate" asp-for="inputEmployeeModel.DateofBirth">
for="inputEmployeeModel.DateofBirth" class="text-danger"></span>
</div>
</div>
<label class="control-label mb-10">Place of
Birth</label>
asp-for="inputEmployeeModel.PlaceofBirth">
</div>
</div>
</div>
</div>


<div class="row">
10">picture</label>
<input type="file" id="input-file-now"
class="dropify" asp-for="inputEmployeeModel.Picture" />
</div>
</div>
10">NIC</label>
<input type="number" class="form-control"
asp-for="inputEmployeeModel.NICNumber">
</div>
</div>
</div>
</div>


<div class="row">
<label class="control-label mb-10">Contact
Number</label>
asp-for="inputEmployeeModel.ContactNumber">
</div>
</div>
<label class="control-label mb-10">Email
Address</label>
<input type="email" class="form-control"
asp-for="inputEmployeeModel.EmailAddress">
</div>
</div>
</div>
</div>


<div class="row">
10">Gender</label>
<div>
<input id="check_box_switch" asp-
for="inputEmployeeModel.GenderId" type="checkbox" data-off-text="Female" data-on-
text="Male" class="bs-switch" data-size="small">
</div>
</div>
</div>
<div class="col-md-3 pull-left">

<label class="control-label mb-10">Marital
Status</label>
<div>
<input id="check_box_switch" asp-
for="inputEmployeeModel.MaritualStatus" type="checkbox" data-off-text="Single"
data-on-text="Married" class="bs-switch" data-size="small">
</div>
</div>
</div>
</div>
</div>

</div>

<div class="box-footer">
<button type="submit" class="btn btn-warning pull-right
btn-sm" data-loading-text="<i class='fa fa-spinner fa-spin '></i> Please
wait">Save</button>
</div>
</form>
</div>

<div class="tab-pane wizard-content" id="tab_2">
<form role="form" class="form-horizontal" method="post">

<div class="box-body">

<div class="main_address">

<div class="row">
<label class="control-label mb-10">Full
Address</label>
<input type="text" class="form-
control">
</div>
</div>
</div>
</div>


<div class="row">
10">District</label>
control">
</div>
</div>
10">Street</label>
control">
</div>
</div>
</div>
</div>


<div class="row">
<label class="control-label mb-2">Is
Current</label>
<input type="checkbox" checked data-

size="small" class="js-switch js-switch-1" data-color="#e69a2a" />
</div>
</div>
</div>
</div>

</div>

</div>

btn-sm" autocomplete="off">Save</button>  <span
class="clickatell_loader"></span>
</div>
</form>
</div>

<div class="tab-pane" id="tab_3">



<div class="row">
10">University</label>
<input type="text" class="form-control">
</div>
</div>
10">Major</label>
</div>
</div>
</div>
</div>


<div class="row">
<label class="control-label mb-10">From
Date</label>
id="edu_fromdate">
</div>
</div>
<label class="control-label mb-10">To
Date</label>
id="edu_todate">
</div>
</div>
</div>
</div>


<div class="row">
Highest</label>

</div>
</div>
</div>
</div>

</div>

</div>
</form>
</div>




<div class="row">
10">Organization</label>
</div>
</div>
10">Position</label>
</div>
</div>
</div>
</div>


<div class="row">
<label class="control-label mb-10">Place of
Work</label>
</div>
</div>
<label class="control-label mb-10">Annual
Salary</label>
<div class="input-group">
<div class="input-group-addon"><i
class="ti-money"></i></div>
id="exampleInputuname" placeholder="153">
</div>
</div>
</div>
</div>
</div>


<div class="row">
<label class="control-label mb-10">From
Date</label>
id="exp_fromdate">
</div>
</div>
<label class="control-label mb-10">To
Date</label>
id="exp_todate">
</div>
</div>
</div>
</div>


<div class="row">
<label class="control-label mb-10">Direct
Manager Email</label>
</div>
</div>
<label class="control-label mb-10">Remark
on Position</label>
</div>
</div>
</div>
</div>


<div class="row">
Previouse</label>

</div>
</div>
</div>
</div>

</div>

</div>
</form>
</div>




<div class="row">
10">Name</label>
</div>
</div>
10">Position</label>
</div>
</div>
</div>
</div>


<div class="row">
10">Organization</label>
</div>
</div>
10">Email</label>
<input type="email" class="form-control">
</div>
</div>
</div>
</div>


<div class="row">
Number</label>
<input type="text" placeholder=""
class="form-control">
</div>
</div>
</div>
</div>


<div class="row">
<label class="control-label mb-2">Is Current
Supervisor</label>
<input type="checkbox" data-size="small"

class="js-switch js-switch-1" data-color="#e69a2a" />
</div>
</div>
</div>
</div>

</div>

</div>
</form>
</div>




<div class="row">
10">Language</label>
<select class="selectpicker" data-
style="form-control btn-default btn-outline">
<option>Mustard</option>
<option>Ketchup</option>
<option>Relish</option>
</select>
</div>
</div>
</div>
</div>


<div class="row">
10">Reading</label>
</select>
</div>
</div>
10">Writing</label>
</select>
</div>
</div>
10">Speaking</label>
</select>
</div>
</div>
</div>
</div>


<div class="row">
Native</label>
<input type="checkbox" data-size="small"

class="js-switch js-switch-1" data-color="#e69a2a" />
</div>
</div>
</div>
</div>

</div>

</div>
</form>
</div>




<div class="row">
10">Name</label>
</div>
</div>
10">Relation</label>
</div>
</div>
</div>
</div>


<div class="row">
10">Address</label>
</div>
</div>
Number</label>
<input type="number" class="form-control">
</div>
</div>
</div>
</div>


<div class="row">
<label class="control-label mb-10">Email
Address</label>
<input type="email" placeholder=""
class="form-control">
</div>
</div>
</div>
</div>

</div>

</div>
</form>
</div>




<div class="row">
10">Document</label>
<input type="file" class="form-control
dropify">
</div>
</div>
</div>
</div>


<div class="row">
10">SequenceNumber</label>
<input type="number" class="form-control">
</div>
</div>
</div>
</div>

</div>

</div>
</form>
</div>
</div>

</div>
</div>
@section Scripts{
<script type="text/javascript">
$(document).ready(function () {
/* Bootstrap switch Init*/

$('.bs-switch').bootstrapSwitch('state', true);
/* change file upload design to dropify*/

$('.dropify').dropify();
/* Switchery Init*/
var elems = Array.prototype.slice.call(document.querySelectorAll('.js-
switch'));
$('.js-switch-1').each(function () {
new Switchery($(this)[0], $(this).data());
});
// apply persian date to form date fields

var data_textbox = ["emp_birthdate", "edu_fromdate", "edu_todate",
"exp_fromdate", "exp_todate"];
persian_date_picker(data_textbox);
$(document).on('submit', '.frm_employeedetail', function (e) {

AjaxSubmitForm(e, $(this), setTimeout(function ()
{ location.reload()}, 1000));
});
var div_for_copy = $("#main_address");

var NewRow = div_for_copy.clone(true); // copy previous row for add new
row
NewRow.find("input").val(""); // clear previous input value before add
new row
div_for_copy.after(NewRow); // add new row
});
</script>

Tabdesign

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Tabdesign

Uploaded by

Copyright:

Available Formats

@model EmployeeRegistrationViewModel

<div class="col-md-3 pull-left">

<form role="form" class="form-horizontal" method="post">

<input type="checkbox" checked data-

<form role="form" class="form-horizontal" method="post">

<input type="checkbox" checked data-

<input type="checkbox" checked data-

<form role="form" class="form-horizontal" method="post">

<input type="checkbox" data-size="small"

<form role="form" class="form-horizontal" method="post">

<input type="checkbox" data-size="small"

/* Bootstrap switch Init*/

/* change file upload design to dropify*/

// apply persian date to form date fields

$(document).on('submit', '.frm_employeedetail', function (e) {

var div_for_copy = $("#main_address");

You might also like