mirror of
https://gitlab.com/CIEFWorldwideSdnBhd/IZYIM-Prototype.git
synced 2026-08-19 04:33:55 +00:00
Jackk Goh
1639 lines
111 KiB
HTML
1639 lines
111 KiB
HTML
<!DOCTYPE html>
|
|
<!--
|
|
Template Name: Metronic - Responsive Admin Dashboard Template build with Twitter Bootstrap 3.3.7
|
|
Version: 4.7.5
|
|
Author: KeenThemes
|
|
Website: http://www.keenthemes.com/
|
|
Contact: support@keenthemes.com
|
|
Follow: www.twitter.com/keenthemes
|
|
Dribbble: www.dribbble.com/keenthemes
|
|
Like: www.facebook.com/keenthemes
|
|
Purchase: http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?ref=keenthemes
|
|
Renew Support: http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?ref=keenthemes
|
|
License: You must have a valid license purchased only from themeforest(the above link) in order to legally use the theme for your project.
|
|
-->
|
|
<!--[if IE 8]>
|
|
<html lang="en" class="ie8 no-js">
|
|
<![endif]-->
|
|
<!--[if IE 9]>
|
|
<html lang="en" class="ie9 no-js">
|
|
<![endif]-->
|
|
<!--[if !IE]><!-->
|
|
<html lang="en">
|
|
<!--<![endif]-->
|
|
<!-- BEGIN HEAD -->
|
|
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>IZYIM | Departure Warehouse Receive Note</title>
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta content="width=device-width, initial-scale=1" name="viewport" />
|
|
<meta content="Preview page of Metronic Admin Theme #1 for statistics, charts, recent events and reports" name="description" />
|
|
<meta content="" name="author" />
|
|
<!-- BEGIN GLOBAL MANDATORY STYLES -->
|
|
<link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700&subset=all" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/bootstrap-switch/css/bootstrap-switch.min.css" rel="stylesheet" type="text/css" />
|
|
<!-- END GLOBAL MANDATORY STYLES -->
|
|
<!-- BEGIN PAGE LEVEL PLUGINS -->
|
|
<link href="../assets/global/plugins/datatables/datatables.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/bootstrap-datepicker/css/bootstrap-datepicker3.min.css" rel="stylesheet" type="text/css" />
|
|
<!-- END PAGE LEVEL PLUGINS -->
|
|
<link href="../assets/global/plugins/bootstrap-wysihtml5/bootstrap-wysihtml5.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/bootstrap-datepicker/css/bootstrap-datepicker3.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/bootstrap-editable/bootstrap-editable/css/bootstrap-editable.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/bootstrap-wysihtml5/bootstrap-wysihtml5.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/bootstrap-editable/inputs-ext/address/address.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/select2/css/select2.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/select2/css/select2-bootstrap.min.css" rel="stylesheet" type="text/css" />
|
|
<!-- BEGIN THEME GLOBAL STYLES -->
|
|
<link href="../assets/global/css/components.min.css" rel="stylesheet" id="style_components" type="text/css" />
|
|
<link href="../assets/global/css/plugins.min.css" rel="stylesheet" type="text/css" />
|
|
<!-- END THEME GLOBAL STYLES -->
|
|
<!-- BEGIN THEME LAYOUT STYLES -->
|
|
<link href="../assets/layouts/layout/css/layout.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/layouts/layout/css/themes/darkblue.min.css" rel="stylesheet" type="text/css" id="style_color" />
|
|
<link href="../assets/layouts/layout/css/custom.min.css" rel="stylesheet" type="text/css" />
|
|
<!-- END THEME LAYOUT STYLES -->
|
|
<style>
|
|
div.dt-button-collection {
|
|
margin-top: 70px;
|
|
}
|
|
.filterIcon {
|
|
height: 10px;
|
|
width: 10px;
|
|
}
|
|
.table td,
|
|
.table th {
|
|
font-size: 14px;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
}
|
|
.dataTables_wrapper .dataTables_filter {
|
|
float: left;
|
|
text-align: right;
|
|
}
|
|
.table thead tr th {
|
|
font-size: 14px;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
}
|
|
.modalFilter {
|
|
display: none;
|
|
height: auto;
|
|
position: absolute;
|
|
z-index: 10000001;
|
|
}
|
|
.modal-footer {
|
|
padding: 15px;
|
|
text-align: left;
|
|
border-top: 1px solid #e5e5e5;
|
|
}
|
|
.dt-buttons {
|
|
margin-top: 0px !important;
|
|
}
|
|
#mask {
|
|
display: none;
|
|
background: transparent;
|
|
position: fixed;
|
|
left: 0;
|
|
top: 0;
|
|
z-index: 1;
|
|
width: 100%;
|
|
height: 100%;
|
|
opacity: 1000;
|
|
}
|
|
@media (min-width: 992px) {
|
|
.page-content-wrapper .page-content {
|
|
margin-left: 200px;
|
|
}
|
|
}
|
|
@media (min-width: 992px) {
|
|
.page-sidebar {
|
|
width: 200px;
|
|
float: left;
|
|
position: relative;
|
|
margin-right: -100%;
|
|
}
|
|
}
|
|
#example2_filter {
|
|
float: right;
|
|
}
|
|
.col_0 {
|
|
width: 50px !important;
|
|
padding-right: 0px !important;
|
|
padding-left: 0px !important;
|
|
}
|
|
.col_1 {
|
|
width: 50px !important;
|
|
padding-right: 0px !important;
|
|
padding-left: 0px !important;
|
|
}
|
|
.col_2 {
|
|
width: 50px !important;
|
|
}
|
|
.col_3 {
|
|
width: 60px !important;
|
|
}
|
|
.col_4 {
|
|
width: 60px !important;
|
|
}
|
|
.col_5 {
|
|
width: 60px !important;
|
|
}
|
|
.blue {
|
|
color: #337ab7;
|
|
line-height: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
font: normal normal normal 14px/1 FontAwesome;
|
|
font-size: 14px;
|
|
text-rendering: auto;
|
|
}
|
|
.media-object-4 {
|
|
width: 35px;
|
|
position: right;
|
|
margin-left: 63%;
|
|
margin-top: 0.7%;
|
|
}
|
|
.modal-content {
|
|
width: 1000px;
|
|
position: center;
|
|
font: 14px;
|
|
}
|
|
.modal-dialog {
|
|
width: 1000px;
|
|
}
|
|
</style>
|
|
}
|
|
</head>
|
|
<!-- END HEAD -->
|
|
|
|
<body class="page-header-fixed page-sidebar-closed-hide-logo page-content-white">
|
|
<div class="page-wrapper">
|
|
<!-- BEGIN HEADER -->
|
|
<div class="page-header navbar navbar-fixed-top">
|
|
<!-- BEGIN HEADER INNER -->
|
|
<div class="page-header-inner ">
|
|
<!-- BEGIN LOGO -->
|
|
<div class="page-logo">
|
|
<div class="menu-toggler sidebar-toggler">
|
|
<span></span>
|
|
</div>
|
|
</div>
|
|
<!-- END LOGO -->
|
|
<!-- BEGIN RESPONSIVE MENU TOGGLER -->
|
|
<a href="javascript:;" class="menu-toggler responsive-toggler" data-toggle="collapse" data-target=".navbar-collapse">
|
|
<span></span>
|
|
</a>
|
|
<!-- END RESPONSIVE MENU TOGGLER -->
|
|
<!-- BEGIN TOP NAVIGATION MENU -->
|
|
<img style="border-radius:100%" class="media-object-4" src="../assets/layouts/layout/img/1.png" alt="...">
|
|
<div class="top-menu">
|
|
<ul class="nav navbar-nav pull-right">
|
|
<!-- BEGIN USER LOGIN DROPDOWN -->
|
|
<!-- DOC: Apply "dropdown-dark" class after below "dropdown-extended" to change the dropdown styte -->
|
|
<li class="dropdown dropdown-user">
|
|
<a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
|
|
<img alt="" class="img-circle" src="../assets/layouts/layout/img/avatar3_small.jpg" />
|
|
<span class="username username-hide-on-mobile"> Syed Amir </span>
|
|
<i class="fa fa-angle-down"></i>
|
|
</a>
|
|
<ul class="dropdown-menu dropdown-menu-default">
|
|
<li>
|
|
<a href="profile.html">
|
|
<i class="icon-user"></i> My Profile </a>
|
|
</li>
|
|
<li>
|
|
<a href="login.html">
|
|
<i class="icon-key"></i> Log Out </a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<!-- END USER LOGIN DROPDOWN -->
|
|
<li class="dropdown dropdown-quick-sidebar-toggler">
|
|
<a href="javascript:;" class="dropdown-toggle">
|
|
<i class="icon-logout"></i>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<!-- END TOP NAVIGATION MENU -->
|
|
</div>
|
|
<!-- END HEADER INNER -->
|
|
</div>
|
|
<!-- END HEADER -->
|
|
<!-- BEGIN HEADER & CONTENT DIVIDER -->
|
|
<div class="clearfix"> </div>
|
|
<!-- END HEADER & CONTENT DIVIDER -->
|
|
<!-- BEGIN CONTAINER -->
|
|
<div class="page-container">
|
|
<!-- BEGIN SIDEBAR -->
|
|
<div class="page-sidebar-wrapper">
|
|
<!-- BEGIN SIDEBAR -->
|
|
<!-- DOC: Set data-auto-scroll="false" to disable the sidebar from auto scrolling/focusing -->
|
|
<!-- DOC: Change data-auto-speed="200" to adjust the sub menu slide up/down speed -->
|
|
<div class="page-sidebar navbar-collapse collapse">
|
|
<ul class="page-sidebar-menu page-header-fixed " data-keep-expanded="false" data-auto-scroll="true" data-slide-speed="200" style="padding-top: 20px">
|
|
<!-- DOC: To remove the sidebar toggler from the sidebar you just need to completely remove the below "sidebar-toggler-wrapper" LI element -->
|
|
<!-- BEGIN SIDEBAR TOGGLER BUTTON -->
|
|
<li class="sidebar-toggler-wrapper hide">
|
|
<div class="sidebar-toggler">
|
|
<span></span>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<center><img src="../assets/global/img/logo.png" style="height:auto ; width:60%" />
|
|
</center>
|
|
</li>
|
|
<hr>
|
|
<li class="nav-item start">
|
|
<a href="index.html" class="nav-link nav-toggle">
|
|
<i class="icon-home"></i>
|
|
<span class="title">Order Status</span>
|
|
<span class="selected"></span>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="notice.html" class="nav-link nav-toggle">
|
|
<i class="fa fa-newspaper-o"></i>
|
|
<span class="title">Notice</span>
|
|
<span class="selected"></span>
|
|
</a>
|
|
</li>
|
|
|
|
<li class="nav-item active open">
|
|
<a href="javascript:;" class="nav-link nav-toggle">
|
|
<i class="icon-briefcase"></i>
|
|
<span class="title">Arrangements</span>
|
|
<span class="arrow"></span>
|
|
</a>
|
|
<ul class="sub-menu">
|
|
<li class="nav-item active open">
|
|
<a href="warehousenote.html" class="nav-link ">
|
|
<i class="fa fa-industry"></i>
|
|
<span class="title">Warehouse Receive Note</span>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="shipmentarrange.html" class="nav-link ">
|
|
<i class="fa fa-ship"></i>
|
|
<span class="title">Shipment Arrangement</span>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item ">
|
|
<a href="deliveryarrange.html" class="nav-link ">
|
|
<i class="fa fa-truck"></i>
|
|
<span class="title">Delivery Arrangement</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="javascript:;" class="nav-link nav-toggle">
|
|
<i class="icon-briefcase"></i>
|
|
<span class="title">Orders</span>
|
|
<span class="arrow"></span>
|
|
</a>
|
|
<ul class="sub-menu">
|
|
<li class="nav-item ">
|
|
<a href="purchaseorder.html" class="nav-link ">
|
|
<i class="icon-clock"></i>
|
|
<span class="title">Purchase Order</span>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="shippingorderstatus.html" class="nav-link ">
|
|
<i class="icon-check"></i>
|
|
<span class="title">Shipping Order</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="custom.html?menu=true" class="nav-link nav-toggle">
|
|
<i class="fa fa-comments-o"></i>
|
|
<span class="title">Custom Declaration</span>
|
|
<span class="selected"></span>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="chat.html?menu=true" class="nav-link nav-toggle">
|
|
<i class="fa fa-comments-o"></i>
|
|
<span class="title">Messenger</span>
|
|
<span class="selected"></span>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="trackorder.html?menu=true" class="nav-link nav-toggle">
|
|
<i class="icon-basket"></i>
|
|
<span class="title">Track Order</span>
|
|
<span class="selected"></span>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="profile.html" class="nav-link nav-toggle">
|
|
<i class="icon-user"></i>
|
|
<span class="title">Profile</span>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="contactlist.html" class="nav-link nav-toggle">
|
|
<i class="icon-notebook"></i>
|
|
<span class="title">Contact List</span>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="javascript:;" class="nav-link nav-toggle">
|
|
<i class="icon-settings"></i>
|
|
<span class="title">Settings</span>
|
|
<span class="arrow"></span>
|
|
</a>
|
|
<ul class="sub-menu">
|
|
|
|
<li class="nav-item">
|
|
<a href="updatecurrency.html" class="nav-link ">
|
|
<i class="fa fa-money"></i>
|
|
<span class="title">Update Currency</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
|
|
</ul>
|
|
<!-- END SIDEBAR MENU -->
|
|
<!-- END SIDEBAR MENU -->
|
|
</div>
|
|
<!-- END SIDEBAR -->
|
|
<!-- BEGIN CONTENT -->
|
|
<div class="page-content-wrapper">
|
|
<!-- BEGIN CONTENT BODY -->
|
|
<div class="page-content">
|
|
<!-- BEGIN PAGE BAR -->
|
|
<div class="page-bar">
|
|
<ul class="page-breadcrumb">
|
|
<li>
|
|
<a href="index.html">Home</a>
|
|
<i class="fa fa-circle"></i>
|
|
</li>
|
|
<li>
|
|
<a href="deliveryarrange.html">Departure Warehouse Receive Note</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<!-- END PAGE BAR -->
|
|
<!-- BEGIN PAGE TITLE-->
|
|
<!-- CONTENT -->
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<!-- Begin: life time stats -->
|
|
<div class="portlet box green">
|
|
<div class="portlet-title">
|
|
<div class="caption">
|
|
<i class="fa fa-cogs"></i><strong>Departure Warehouse Receive Note</strong>
|
|
</div>
|
|
<div class="actions">
|
|
<div class="btn-group" style="display:none">
|
|
<a id="qweqwe" class="btn white btn-outline btn-circle" href="#modal_demo_1" data-toggle="modal"> Departure Warehouse Receive Note </a>
|
|
</div>
|
|
<div class="btn-group">
|
|
<a class="btn white btn-outline btn-circle" href="javascript:;" data-toggle="dropdown">
|
|
<i class="fa fa-share"></i>
|
|
<span class="hidden-xs"> Actions </span>
|
|
<i class="fa fa-angle-down"></i>
|
|
</a>
|
|
<ul class="dropdown-menu pull-right" id="sample_3_tools">
|
|
<li>
|
|
<a href="javascript:;" data-action="0" class="tool-action">
|
|
<i class="icon-printer"></i> Print</a>
|
|
</li>
|
|
<li>
|
|
<a href="javascript:;" data-action="1" class="tool-action">
|
|
<i class="icon-check"></i> Copy</a>
|
|
</li>
|
|
<li>
|
|
<a href="javascript:;" data-action="2" class="tool-action">
|
|
<i class="icon-doc"></i> PDF</a>
|
|
</li>
|
|
<li>
|
|
<a href="javascript:;" data-action="3" class="tool-action">
|
|
<i class="icon-paper-clip"></i> Excel</a>
|
|
</li>
|
|
<li>
|
|
<a href="javascript:;" data-action="4" class="tool-action">
|
|
<i class="icon-cloud-upload"></i> CSV</a>
|
|
</li>
|
|
<li class="divider"> </li>
|
|
<li>
|
|
<a href="javascript:;" data-action="5" class="tool-action">
|
|
<i class="icon-refresh"></i> Reload</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="portlet-body">
|
|
<div class="table-container">
|
|
<div id="mask"></div>
|
|
<!-- <span id="switch" class="pull-right" style="margin-left:5px; margin-right:5px;">Status : <input type='checkbox' class='make-switch pull-right asdasd' checked data-size='small' data-on-color='success' data-on-text='ON' data-off-color='default' data-off-text='OFF'></span> -->
|
|
<table id="example" class="table table-striped table-bordered table-hover order-column"></table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End: life time stats -->
|
|
</div>
|
|
</div>
|
|
|
|
<div id="modal_demo_1" class="modal fade modal-scroll bs-modal-lg in" role="dialog" aria-hidden="true">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header" style="background-color: #3598dc; font-size: 100px">
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
|
|
<div class="caption" style="color: #FFF;padding: 11px 0 9px;float: left;display: inline-block;font-size: 18px;line-height: 18px;font-family:'Open Sans',sans-serif;">
|
|
<i class="fa fa-gift" style=" float: left;margin-top: 4px;display: inline-block;font-size: 13px;margin-right: 5px;"></i>Departure Warehouse Received Note
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="portlet light bordered" id="form_wizard_1">
|
|
<div class="portlet-body form">
|
|
<form class="form-horizontal" action="#" id="submit_form" method="POST">
|
|
<div class="form-wizard">
|
|
<div class="form-body">
|
|
<ul class="nav nav-pills nav-justified steps">
|
|
<li>
|
|
<a href="#tab1" data-toggle="tab" class="step">
|
|
<span class="number"> 1 </span>
|
|
<span class="desc">
|
|
<i class="fa fa-check"></i> WRN Form</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="#tab2" data-toggle="tab" class="step">
|
|
<span class="number"> 2 </span>
|
|
<span class="desc">
|
|
<i class="fa fa-check"></i> WRN Details<br> </span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<div id="bar" class="progress progress-striped" role="progressbar">
|
|
<div class="progress-bar progress-bar-success"> </div>
|
|
</div>
|
|
<div class="progress-bar progress-bar-success"> </div>
|
|
</div>
|
|
<div class="tab-content">
|
|
<div class="alert alert-danger display-none">
|
|
<button class="close" data-dismiss="alert"></button> You have some form errors. Please check below.
|
|
</div>
|
|
<div class="alert alert-success display-none">
|
|
<button class="close" data-dismiss="alert"></button> Your form validation is successful!
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!--tab1-->
|
|
<div class="tab-pane active" id="tab1">
|
|
<h4 class="block"><b>Departure Warehouse Received Note</b></h4>
|
|
<div class="row">
|
|
<div class="col-md-12 col-sm-12">
|
|
<div class="portlet light bordered">
|
|
<div class="portlet-body">
|
|
<div class="row static-info">
|
|
<label class="control-label col-md-3" style="font-size: 100%">Order No</label>
|
|
<div class="col-md-6">
|
|
<select class="form-control select2">
|
|
<optgroup label="Order No">
|
|
<option>Please choose your order</option>
|
|
<option value="000">00012</option>
|
|
<option value="001">00114</option>
|
|
<option value="002">00216</option>
|
|
<option value="004">00418</option>
|
|
<option value="006">00624</option>
|
|
<option value="183">18332</option>
|
|
<option value="187">18742</option>
|
|
<option value="197">19745</option>
|
|
<option value="256">25654</option>
|
|
<option value="287">28782</option>
|
|
<option value="348">34829</option>
|
|
<option value="368">36894</option>
|
|
<option value="380">38090</option>
|
|
<option value="426">42679</option>
|
|
<option value="448">44895</option>
|
|
<option value="468">46894</option>
|
|
<option value="489">48939</option>
|
|
<option value="578">57839</option>
|
|
</optgroup>
|
|
</select>
|
|
</div>
|
|
<br>
|
|
<br>
|
|
<br>
|
|
<br>
|
|
|
|
<div class="row static-info">
|
|
<label class="control-label col-md-3" style="font-size: 100%">Receive Date</label>
|
|
<div class="col-md-6">
|
|
<input placeholder="12/11/2017" type="text" class="form-control">
|
|
</div>
|
|
<br>
|
|
<br>
|
|
<br>
|
|
</div>
|
|
<div class="row static-info">
|
|
<label class="control-label col-md-3" style="font-size: 100%">Marking</label>
|
|
<div class="col-md-6">
|
|
<input placeholder="CIEF/00012/00012" type="text" class="form-control">
|
|
</div>
|
|
<br>
|
|
<br>
|
|
<br>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-md-6 col-sm-11">
|
|
<div class="form-group">
|
|
<div class="portlet light bordered">
|
|
<div class="portlet-body">
|
|
<div class="row static-info">
|
|
<label class="control-label col-md-3" style="font-size: 100%">Transport Company Name</label><br>
|
|
<div class="col-md-9">
|
|
<input placeholder="CIEF Worldwide Sdn Bhd" type="text" class="form-control">
|
|
</div>
|
|
</div>
|
|
<div class="row static-info">
|
|
<label class="control-label col-md-3" style="font-size: 100%">Consignment Note<br>No</label><br>
|
|
<div class="col-md-9">
|
|
<input placeholder="CN345" type="text" class="form-control">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 col-sm-12">
|
|
<div class="form-group">
|
|
<div class="portlet light bordered">
|
|
<div class="portlet-body">
|
|
<div class="row static-info">
|
|
<label class="control-label col-md-3" style="font-size: 100%">Warehouse<br> Receive<br>Note No</label> <br>
|
|
<div class="col-md-9">
|
|
<input placeholder="WRN098" type="text" class="form-control">
|
|
</div>
|
|
<br>
|
|
<br>
|
|
<br>
|
|
<div class="row static-info">
|
|
<label class="control-label col-md-3" style="font-size: 100%">Receiving<br>Person</label><br>
|
|
<div class="col-md-9">
|
|
<input placeholder="LEONG KIM" type="text" class="form-control">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--/span-->
|
|
<div class="row">
|
|
|
|
<!--/span-->
|
|
<div style="margin-right:20px" class="form-group">
|
|
<label class="col-md-3 control-label"><br>Remark</label>
|
|
<div class="col-md-9">
|
|
<div class="mt-repeater">
|
|
<div data-repeater-list="group-b">
|
|
<div data-repeater-item class="row">
|
|
<div class="col-md-3">
|
|
<label class="col-md-3 control-label">.</label>
|
|
<input type="text" placeholder="Name" class="form-control" /> </div>
|
|
<div class="col-md-8">
|
|
<label class="col-md-3 control-label">.</label>
|
|
<input type="text" placeholder="Type your input" class="form-control" /> </div>
|
|
|
|
<div class="col-md-1">
|
|
<label class="control-label"> </label>
|
|
<a href="javascript:;" data-repeater-delete class="btn btn-danger">
|
|
<i class="fa fa-close"></i>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
<a href="javascript:;" data-repeater-create class="btn btn-info mt-repeater-add">
|
|
<i class="fa fa-plus"></i> Add New Field</a>
|
|
<br>
|
|
<br>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
<br>
|
|
<br>
|
|
<div class="form-actions">
|
|
<div class="col-md-20">
|
|
<a href="javascript:;" class="btn btn-outline green button-next" style="margin-left:450px"> Next</a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!--<form method="POST">
|
|
<div id="dynamicInput">
|
|
Entry 1<br><input type="text" name="myInputs[]">
|
|
</div>
|
|
<input type="button" value="Add another text input" onClick="addInput('dynamicInput');">
|
|
</form>-->
|
|
|
|
|
|
<div class="tab-pane" id="tab2">
|
|
<div class="col-md-13">
|
|
<div class="portlet light bordered">
|
|
<div class="portlet-title">
|
|
<div class="caption">
|
|
<i class="icon-social-dribbble font-green hide"></i>
|
|
<span class="caption-subject font-dark bold uppercase">DEPARTURE WAREHOUSE RECEIVE NOTE - 00012</span>
|
|
<br>
|
|
<br>
|
|
<br>
|
|
<div class="table-toolbar">
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="btn-group">
|
|
<a onclick="addNewColumn();" class="btn green"> New Column
|
|
<i class="fa fa-plus"></i>
|
|
</a>
|
|
</div>
|
|
<div class="btn-group">
|
|
<a onclick="addNewRow();" class="btn green"> New Row
|
|
<i class="fa fa-plus"></i>
|
|
</a>
|
|
</div>
|
|
<br>
|
|
<br>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="portlet-body">
|
|
|
|
|
|
<div class="table-scrollable" style="max-width:900px; font-size:100px;">
|
|
<table class="table table-striped table-bordered table-hover" id="sample_editable_1">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">No</th>
|
|
<th scope="col">Total Ctn
|
|
<br>(nominal)</th>
|
|
<th scope="col">Measurement-m
|
|
<br>(nominal)</th>
|
|
<th scope="col">Weight
|
|
<br>(nominal)</th>
|
|
<th scope="col">Total Ctn
|
|
<br>(actual)</th>
|
|
<th scope="col">Measurement-m
|
|
<br>(actual)</th>
|
|
<th scope="col">Weight
|
|
<br>(actual)</th>
|
|
<th scope="col">Status</th>
|
|
<th scope="col">Damage</th>
|
|
<th scope="col">Upload your Photo Here</th>
|
|
|
|
</tr>
|
|
</thead>
|
|
<tfoot>
|
|
<tr>
|
|
<td style="color: black">Total</td>
|
|
<td style="color: black">12 ctn</td>
|
|
<td style="color: black">3.6 CBM</td>
|
|
<td style="color: black">10 kg</td>
|
|
<td style="color: black">11 ctn</td>
|
|
<td style="color: black">3.6 CBM</td>
|
|
<td style="color: black">29.8 kg</td>
|
|
<td>
|
|
<a style="color: black"></a>
|
|
</td>
|
|
<td>
|
|
|
|
</td>
|
|
<td>
|
|
|
|
</td>
|
|
|
|
</tfoot>
|
|
<tbody>
|
|
<tr>
|
|
<td>1</td>
|
|
<td>4</td>
|
|
<td>40x40x40</td>
|
|
<td>10kg</td>
|
|
<td><a href="javascript:;" id="totalctn" name="totalctn1" data-type="text" data-pk="1" data-original-title="Total Ctn"> 4 </a>
|
|
</td>
|
|
<td><a href="javascript:;" id="address" data-type="address" data-pk="1" data-original-title="Measurement"> 40 x 40 x 40</a>
|
|
</td>
|
|
<td><a href="javascript:;" id="weight" data-type="text" data-pk="1" data-original-title="Weight"> 10kg </a>
|
|
</td>
|
|
<td>Matched</td>
|
|
<td>
|
|
<label class="mt-checkbox mt-checkbox-single mt-checkbox-outline">
|
|
<input type="checkbox" class="checkboxes" value="1">
|
|
<span></span>
|
|
</label>
|
|
</td>
|
|
<td>
|
|
<div>
|
|
<span class="fileinput-new"></span>
|
|
<span class="fileinput-exists"></span>
|
|
<input type="file" name="...">
|
|
</div>
|
|
</td>
|
|
|
|
|
|
|
|
|
|
</tr>
|
|
<tr>
|
|
<td>2</td>
|
|
<td style="color: red">4</td>
|
|
<td>0.4x0.4x0.4</td>
|
|
<td>10kg</td>
|
|
<td><a href="javascript:;" id="totalctn2" name="totalctn1" data-type="text" data-pk="1" data-original-title="Total Ctn" style="color: red"> 3 </a>
|
|
</td>
|
|
<td><a href="javascript:;" id="address2" data-type="address" data-pk="1" data-original-title="Measurement"> 0.4 x 0.4 x 0.4</a>
|
|
</td>
|
|
<td><a href="javascript:;" id="weight2" data-type="text" data-pk="1" data-original-title="Weight"> 10kg </a>
|
|
</td>
|
|
<td><a style="color: red">Unmatched</a>
|
|
</td>
|
|
<td>
|
|
<label class="mt-checkbox mt-checkbox-single mt-checkbox-outline">
|
|
<input type="checkbox" class="checkboxes" value="1">
|
|
<span></span>
|
|
</label>
|
|
</td>
|
|
<td>
|
|
<div>
|
|
<span class="fileinput-new"></span>
|
|
<span class="fileinput-exists"></span>
|
|
<input type="file" name="..."> </span>
|
|
</div>
|
|
</td>
|
|
|
|
</tr>
|
|
<tr>
|
|
<td>3</td>
|
|
<td>4</td>
|
|
<td>0.4x0.4x0.4</td>
|
|
<td style="color: red">10kg</td>
|
|
<td><a href="javascript:;" id="totalctn3" name="totalctn1" data-type="text" data-pk="1" data-original-title="Total Ctn"> 4 </a>
|
|
</td>
|
|
<td><a href="javascript:;" id="address3" data-type="address" data-pk="1" data-original-title="Measurement"> 0.4 x 0.4 x 0.4</a>
|
|
</td>
|
|
<td><a href="javascript:;" id="weight3" data-type="text" data-pk="1" data-original-title="Weight" style="color: red"> 9.8kg </a>
|
|
</td>
|
|
<td><a style="color: red">Unmatched <br></td>
|
|
<td>
|
|
<label class="mt-checkbox mt-checkbox-single mt-checkbox-outline">
|
|
<input type="checkbox" class="checkboxes" value="1">
|
|
<span></span>
|
|
</label>
|
|
</td>
|
|
<td>
|
|
<div>
|
|
<span class="fileinput-new"></span>
|
|
<span class="fileinput-exists"></span>
|
|
<input type="file" name="...">
|
|
</div>
|
|
</td>
|
|
|
|
</tr>
|
|
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
<div class="row">
|
|
<div style="margin-top: 50px; margin-left: 5px;" class="col-md-6">
|
|
<div class="form-group">
|
|
<label class="control-label col-md-3" style="margin-bottom:100px; font-size: 80%">Remark</label>
|
|
<div class="col-md-9">
|
|
<textarea class="form-control" id="message" rows="3" placeholder="Enter a remark..."></textarea>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="form-actions">
|
|
<div class="row">
|
|
<div class="col-md-offset-5 col-md-9">
|
|
<a href="javascript:;" class="btn default button-previous">
|
|
<i class="fa fa-angle-left"></i> Back </a>
|
|
<a onclick="confirm('Notification: Your warehouse receive note has been submitted')" data-toggle="modal" href="#marking2" class="btn green button-submit"> Submit
|
|
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
<br>
|
|
<br>
|
|
<p style="color:red; font-size:90%" align="center">Notification: Please keep key in the information if there have any problem with the goods</p>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- /.modal-content -->
|
|
</div>
|
|
</div>
|
|
<!-- /.modal-dialog -->
|
|
</div>
|
|
<!-- END CONTENT -->
|
|
<!-- Modal -->
|
|
|
|
<div class="modal fade in" id="move" tabindex="-1" role="basic" aria-hidden="true" style="z-index:999999;">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
|
|
|
|
<div class="caption">
|
|
<i class="fa fa-gift"></i>Move File
|
|
</div>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="form">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="form-group">
|
|
<label>Folder</label>
|
|
<select id="folder" class="form-control" onchange="show_hide(this);">
|
|
<option>Select / Create New Folder</option>
|
|
<option value="issue1">Documents</option>
|
|
<option value="issue2">Images</option>
|
|
<option value="sound">Sounds</option>
|
|
<option value="oth">Others</option>
|
|
<option value="create">Create New</option>
|
|
</select>
|
|
</div>
|
|
<div class="form-group" id="folder_name" style="display: none">
|
|
<label>Folder Name</label>
|
|
<input type="text" class="form-control">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn dark btn-outline" data-dismiss="modal">Cancel</button>
|
|
<button type="button" class="btn green" data-dismiss="modal">Move</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal fade" id="doc" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content">
|
|
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal">✕</button>
|
|
<h4 class="modal-title" id="myModalLabel">File Manager</h4>
|
|
</div>
|
|
|
|
<div class="modal-body">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="col-md-4">
|
|
<div class="btn-group ">
|
|
<a class="btn dropdown-toggle btn-default" data-toggle="dropdown" href="#">
|
|
<span class="glyphicon glyphicon-plus-sign"></span>File Type
|
|
<span class="caret"></span>
|
|
</a>
|
|
<ul class="dropdown-menu">
|
|
<li><a href="#">Documents</a>
|
|
</li>
|
|
<li><a href="#">Images</a>
|
|
</li>
|
|
<li><a href="#">Sounds</a>
|
|
</li>
|
|
<li><a href="#">Others</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<br/>
|
|
<div class="col-md-4">
|
|
<div class="input-group">
|
|
<input type="text" class="form-control" placeholder="Search" name="q">
|
|
<div class="input-group-btn">
|
|
<button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-4">
|
|
<div class="pull-right">
|
|
<button class="btn btn-default">
|
|
<span class="glyphicon glyphicon-refresh"></span>
|
|
</button>
|
|
<a class="btn btn-default" href='#move' data-toggle='modal'>
|
|
<span class="glyphicon glyphicon-move"></span>
|
|
</a>
|
|
<div class="btn-group">
|
|
<button id="list" type="button" class="btn btn-default"><span class="glyphicon glyphicon-align-justify"></span>
|
|
</button>
|
|
<button id="thumbnail" type="button" class="btn btn-default"> <span class="glyphicon glyphicon-th"></span>
|
|
</button>
|
|
</div>
|
|
<div class="btn-group ">
|
|
<a class="btn dropdown-toggle btn-default" data-toggle="dropdown" href="#">Sort<span class="caret"></span></a>
|
|
<ul class="dropdown-menu">
|
|
<li><a href="#">ID</a>
|
|
</li>
|
|
<li><a href="#">Title</a>
|
|
</li>
|
|
<li><a href="#">Date</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-12">
|
|
<div class="col-md-3">
|
|
<div class="row">
|
|
<div class="col-md-9">
|
|
<form action="#" class="dropzone dropzone-file-area" id="my-dropzone" style="width: 180px;margin-top: 0px;margin-left: 0px;margin-right: 0px;">
|
|
<h4 class="sbold">Drop files here or click to upload</h4>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="thumbnails" class="col-md-9">
|
|
<div data-code="example-2">
|
|
<div class="row">
|
|
<div class="col-md-10" style="float: none; margin: 0 auto;">
|
|
<div class="row" style="margin-left:5px;margin-right:5px;margin-top:15px;margin-bottom:15px;">
|
|
<h5>Please click image to download <i class="fa fa-download" aria-hidden="true"></i></h5>
|
|
<a href="https://unsplash.it/1200/768.jpg?image=251" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">
|
|
<img src="https://unsplash.it/600.jpg?image=251" class="img-fluid">
|
|
</a>
|
|
<a href="https://unsplash.it/1200/768.jpg?image=252" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">
|
|
<img src="https://unsplash.it/600.jpg?image=252" class="img-fluid">
|
|
</a>
|
|
<a href="https://unsplash.it/1200/768.jpg?image=253" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">
|
|
<img src="https://unsplash.it/600.jpg?image=253" class="img-fluid">
|
|
</a>
|
|
</div>
|
|
<div class="row" style="margin-left:5px;margin-right:5px;margin-top:10px;margin-bottom:10px;">
|
|
<a href="https://unsplash.it/1200/768.jpg?image=254" download data-gallery="example-gallery" class="col-sm-4">
|
|
<img src="https://unsplash.it/600.jpg?image=254" class="img-fluid">
|
|
</a>
|
|
<a href="https://unsplash.it/1200/768.jpg?image=255" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">
|
|
<img src="https://unsplash.it/600.jpg?image=255" class="img-fluid">
|
|
</a>
|
|
<a href="https://unsplash.it/1200/768.jpg?image=256" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">
|
|
<img src="https://unsplash.it/600.jpg?image=256" class="img-fluid">
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-9" id="lists" style="display:none;">
|
|
<table class="table table-hover" id="example2" style="height:300px">
|
|
|
|
<thead>
|
|
<tr>
|
|
<th>
|
|
<label class='mt-checkbox mt-checkbox-single mt-checkbox-outline'>
|
|
<input type='checkbox' class='group-checkable' data-set='#example2 .checkboxes' /><span></span>
|
|
</label>
|
|
</th>
|
|
<th>ID</th>
|
|
<th>Date</th>
|
|
<th>Title</th>
|
|
<th class="text-center">Action</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>
|
|
<label class='mt-checkbox mt-checkbox-single mt-checkbox-outline'>
|
|
<input type='checkbox' class='checkboxes' value='1' /><span></span>
|
|
</label>
|
|
</td>
|
|
<td>1</td>
|
|
<td>2017-08-02 13:45:22</td>
|
|
<td><a href="https://unsplash.it/1200/768.jpg?image=251" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">Container</a>
|
|
</td>
|
|
<td class="text-center"><a href="#" onclick="confirm('Are you confirm to delete this file?')" class="btn btn-xs"><span class="glyphicon glyphicon-trash"></span></a><a href="#" class="btn btn-xs"><span class="glyphicon glyphicon-download-alt"></span></a>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<label class='mt-checkbox mt-checkbox-single mt-checkbox-outline'>
|
|
<input type='checkbox' class='checkboxes' value='1' /><span></span>
|
|
</label>
|
|
</td>
|
|
<td>2</td>
|
|
<td>2017-08-02 13:45:22</td>
|
|
<td><a href="https://unsplash.it/1200/768.jpg?image=251" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">Container</a>
|
|
</td>
|
|
<td class="text-center"><a href="#" onclick="confirm('Are you confirm to delete this file?')" class="btn btn-xs"><span class="glyphicon glyphicon-trash"></span></a><a href="#" class="btn btn-xs"><span class="glyphicon glyphicon-download-alt"></span></a>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<label class='mt-checkbox mt-checkbox-single mt-checkbox-outline'>
|
|
<input type='checkbox' class='checkboxes' value='1' /><span></span>
|
|
</label>
|
|
</td>
|
|
<td>3</td>
|
|
<td>2017-08-02 13:45:22</td>
|
|
<td><a href="https://unsplash.it/1200/768.jpg?image=251" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">Container</a>
|
|
</td>
|
|
<td class="text-center"><a href="#" onclick="confirm('Are you confirm to delete this file?')" class="btn btn-xs"><span class="glyphicon glyphicon-trash"></span></a><a href="#" class="btn btn-xs"><span class="glyphicon glyphicon-download-alt"></span></a>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<label class='mt-checkbox mt-checkbox-single mt-checkbox-outline'>
|
|
<input type='checkbox' class='checkboxes' value='1' /><span></span>
|
|
</label</td>
|
|
<td>4</td>
|
|
<td>2017-08-02 13:45:22</td>
|
|
<td><a href="https://unsplash.it/1200/768.jpg?image=251" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">Container</a>
|
|
</td>
|
|
<td class="text-center"><a href="#" onclick="confirm('Are you confirm to delete this file?')" class="btn btn-xs"><span class="glyphicon glyphicon-trash"></span></a><a href="#" class="btn btn-xs"><span class="glyphicon glyphicon-download-alt"></span></a>
|
|
</td>
|
|
</tr>
|
|
|
|
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- END CONTENT -->
|
|
<!-- END CONTAINER -->
|
|
<!-- BEGIN FOOTER -->
|
|
<div class="page-footer">
|
|
<div class="page-footer-inner">
|
|
Copyright © 2017 IZYIM.COM
|
|
<div class="scroll-to-top">
|
|
<i class="icon-arrow-up"></i>
|
|
</div>
|
|
</div>
|
|
<!-- END FOOTER -->
|
|
</div>
|
|
</div>
|
|
<!--[if lt IE 9]>
|
|
<script src="../assets/global/plugins/respond.min.js"></script>
|
|
<script src="../assets/global/plugins/excanvas.min.js"></script>
|
|
<script src="../assets/global/plugins/ie8.fix.min.js"></script>
|
|
<![endif]-->
|
|
<!-- BEGIN CORE PLUGINS -->
|
|
<script src="../assets/global/plugins/jquery.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/js.cookie.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/jquery.blockui.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/bootstrap-switch/js/bootstrap-switch.min.js" type="text/javascript"></script>
|
|
<!-- END CORE PLUGINS -->
|
|
<script src="../assets/global/plugins/jquery-validation/js/jquery.validate.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/jquery-validation/js/additional-methods.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/bootstrap-wizard/jquery.bootstrap.wizard.min.js" type="text/javascript"></script>
|
|
<!-- BEGIN PAGE LEVEL PLUGINS -->
|
|
<script src="../assets/global/scripts/datatable.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/datatables/datatables.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.js" type="text/javascript"></script>
|
|
<!-- END PAGE LEVEL PLUGINS -->
|
|
<!-- BEGIN THEME GLOBAL SCRIPTS -->
|
|
<script src="../assets/global/scripts/app.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/select2/js/select2.full.min.js" type="text/javascript"></script>
|
|
<script src="../assets/pages/scripts/components-select2.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/bootstrap-wysihtml5/wysihtml5-0.3.0.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/bootstrap-wysihtml5/bootstrap-wysihtml5.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/moment.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/jquery.mockjax.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/bootstrap-editable/bootstrap-editable/js/bootstrap-editable.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/bootstrap-editable/inputs-ext/address/address.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/bootstrap-editable/inputs-ext/wysihtml5/wysihtml5.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/bootstrap-typeahead/bootstrap3-typeahead.min.js" type="text/javascript"></script>
|
|
<script src="../assets/pages/scripts/form-editable.js" type="text/javascript"></script>
|
|
|
|
<script src="../assets/pages/scripts/form-repeater.min.js" type="text/javascript"></script>
|
|
<script src="../assets/pages/scripts/components-date-time-pickers.min.js" type="text/javascript"></script>
|
|
<script src="../assets/pages/scripts/table-datatables-managed.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/jquery-repeater/jquery.repeater.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js" type="text/javascript"></script>
|
|
|
|
|
|
|
|
<!-- END THEME GLOBAL SCRIPTS -->
|
|
<!-- END PAGE LEVEL SCRIPTS -->
|
|
<!-- BEGIN THEME LAYOUT SCRIPTS -->
|
|
<script src="../assets/layouts/layout/scripts/layout.min.js" type="text/javascript"></script>
|
|
<script src="../assets/layouts/layout/scripts/demo.min.js" type="text/javascript"></script>
|
|
<script src="../assets/layouts/global/scripts/quick-sidebar.min.js" type="text/javascript"></script>
|
|
<script src="../assets/layouts/global/scripts/quick-nav.min.js" type="text/javascript"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/js/materialize.min.js"></script>
|
|
<!-- END THEME LAYOUT SCRIPTS -->
|
|
<script>
|
|
$(document).ready(function() {
|
|
|
|
|
|
var dataSet = [
|
|
["01-08-2017", "ABC Warehouse", "101", "CIEF/00012/00012", "00012", "CBD SDN BHD", "00012-00012", "4", " Pallet", "12 CBM", "10kg", "", "<td><center><div class='btn-group'><button class='btn green btn-xs btn-circle btn-outline dropdown-toggle btiv' data-toggle='dropdown'>Actions<i class='fa fa-angle-down'></i></button><ul class='dropdown-menu'><li><a href='#'> View </a></li><li><a href='#'> Edit </a></li><li><a href='#'> Delete </a></li></ul></div><br/></center></td>"],
|
|
["04-08-2017", "ABC Warehouse", "102", "CIEF/00022/00022", "00022", "CBD SDN BHD", "00022-00022", "5", " Package", "13 CBM", "17kg", "", "<td><center><div class='btn-group'><button class='btn green btn-xs btn-circle btn-outline dropdown-toggle btiv' data-toggle='dropdown'>Actions<i class='fa fa-angle-down'></i></button><ul class='dropdown-menu'><li><a href='#'> View </a></li><li><a href='#'> Edit </a></li><li><a href='#'> Delete </a></li></ul></div><br/></center></td>"],
|
|
["11-08-2017", "ABC Warehouse", "103", "CIEF/00034/00034", "00034", "CBD SDN BHD", "00034-00034", "8", " Pallet", "23 CBM", "84kg", "", "<td><center><div class='btn-group'><button class='btn green btn-xs btn-circle btn-outline dropdown-toggle btiv' data-toggle='dropdown'>Actions<i class='fa fa-angle-down'></i></button><ul class='dropdown-menu'><li><a href='#'> View </a></li><li><a href='#'> Edit </a></li><li><a href='#'> Delete </a></li></ul></div><br/></center></td>"],
|
|
["31-08-2017", "ABC Warehouse", "104", "CIEF/00089/00089", "00089", "CBD SDN BHD", "00089-00089", "10", " Package", "54 CBM", "100kg", "", "<td><center><div class='btn-group'><button class='btn green btn-xs btn-circle btn-outline dropdown-toggle btiv' data-toggle='dropdown'>Actions<i class='fa fa-angle-down'></i></button><ul class='dropdown-menu'><li><a href='#'> View </a></li><li><a href='#'> Edit </a></li><li><a href='#'> Delete </a></li></ul></div><br/></center></td>"],
|
|
["01-09-2017", "ABC Warehouse", "105", "CIEF/00100/00100", "00100", "CBD SDN BHD", "00100-00100", "3", " Pallet", "10 CBM", "30kg", "", "<td><center><div class='btn-group'><button class='btn green btn-xs btn-circle btn-outline dropdown-toggle btiv' data-toggle='dropdown'>Actions<i class='fa fa-angle-down'></i></button><ul class='dropdown-menu'><li><a href='#'> View </a></li><li><a href='#'> Edit </a></li><li><a href='#'> Delete </a></li></ul></div><br/></center></td>"],
|
|
["17-09-2017", "ABC Warehouse", "106", "CIEF/00156/00156", "00156", "CBD SDN BHD", "00156-00156", "4", " Package", "24 CBM", "20kg", "", "<td><center><div class='btn-group'><button class='btn green btn-xs btn-circle btn-outline dropdown-toggle btiv' data-toggle='dropdown'>Actions<i class='fa fa-angle-down'></i></button><ul class='dropdown-menu'><li><a href='#'> View </a></li><li><a href='#'> Edit </a></li><li><a href='#'> Delete </a></li></ul></div><br/></center></td>"],
|
|
// ["7","<a style='float:center' data-toggle='modal' href='#profile'> CTN133 </a>","789ABC","01-08-2017","<span style='color:red'>02-08-2017 </span>","<span style='color:red'>04-08-2017 </span>","68679","Guangzhou","Customs Examination","03-07-2017","<span style='color:red'><strong>03-07-2017<br/>Delayed</strong></span>","Delivery Request <span style='color:#F1C40F;font-weight: 700;'>Sent</span>", "Not Completed"],
|
|
// ["8","<a style='float:center' data-toggle='modal' href='#profile'> CTN135 </a>","789ABC","01-08-2017","<span style='color:red'>01-08-2017 </span>","<span style='color:red'>05-08-2017 </span>","12345","Dongguan","Customs Examination","03-07-2017","<span style='color:red'><strong>03-07-2017<br/>Delayed</strong></span>","Delivery Request <span style='color:#F1C40F;font-weight: 700;'>Sent</span>", "Not Completed"],
|
|
];
|
|
|
|
|
|
|
|
var table1 = $('#example').DataTable({
|
|
data: dataSet,
|
|
|
|
|
|
//"bFilter" : false,
|
|
"bInfo": false,
|
|
"bLengthChange": false,
|
|
colReorder: {
|
|
reorderCallback: function() {
|
|
console.log('callback');
|
|
}
|
|
},
|
|
// scroller extension: http://datatables.net/extensions/scroller/
|
|
scrollY: 300,
|
|
scrollX: 300,
|
|
|
|
buttons: [{
|
|
extend: 'print',
|
|
className: 'btn dark btn-outline'
|
|
}, {
|
|
extend: 'copy',
|
|
className: 'btn red btn-outline'
|
|
}, {
|
|
extend: 'pdf',
|
|
className: 'btn green btn-outline'
|
|
}, {
|
|
extend: 'excel',
|
|
className: 'btn yellow btn-outline '
|
|
}, {
|
|
extend: 'csv',
|
|
className: 'btn purple btn-outline '
|
|
}, {
|
|
extend: 'colvis',
|
|
className: 'btn dark btn-outline',
|
|
text: 'Columns'
|
|
}],
|
|
"language": {
|
|
"aria": {
|
|
"sortAscending": ": activate to sort column ascending",
|
|
"sortDescending": ": activate to sort column descending"
|
|
},
|
|
"emptyTable": "No data available in table",
|
|
"info": "Showing _START_ to _END_ of _TOTAL_ entries",
|
|
"infoEmpty": "No entries found",
|
|
"infoFiltered": "(filtered1 from _MAX_ total entries)",
|
|
"lengthMenu": "_MENU_ entries",
|
|
"search": "Search:",
|
|
"zeroRecords": "No matching records found"
|
|
},
|
|
"order": [
|
|
[1, "asc"]
|
|
],
|
|
"pageLength": 20,
|
|
"dom": "<'row' <'col-md-12'T>><'row'<'col-md-6'f><'col-md-6'<'toolbar2'B>>r>t<'row'<'col-md-5 col-sm-12'i><'col-md-7 col-sm-12'p>>",
|
|
buttons: [
|
|
|
|
|
|
{
|
|
text: 'Receive Goods',
|
|
className: 'btn red btn-circle btn-outline qweqwe',
|
|
action: function(e, dt, node, config) {
|
|
$("#qweqwe").trigger('click');
|
|
},
|
|
|
|
},
|
|
|
|
],
|
|
fixedHeader: false,
|
|
columns: [{
|
|
title: 'Receive<br>Date <br> <span class="fa fa-filter filterIcon blue" onclick="showFilter(event,\'example_1\')"></span>'
|
|
}, {
|
|
title: 'Warehouse <br>Name<br> <span class="fa fa-filter filterIcon blue" onclick="showFilter(event,\'example_2\')"></span>'
|
|
}, {
|
|
title: 'Warehouse Receive<br>Note No<br> <span class="fa fa-filter filterIcon blue" onclick="showFilter(event,\'example_3\')"></span>'
|
|
}, {
|
|
title: 'Marking<br> <span class="fa fa-filter filterIcon blue" onclick="showFilter(event,\'example_4\')"></span>'
|
|
}, {
|
|
title: 'Order<br>No<br> <span class="fa fa-filter filterIcon blue" onclick="showFilter(event,\'example_5\')"></span>'
|
|
}, {
|
|
title: 'Transporter<br>Company Name<br> <span class="fa fa-filter filterIcon blue" onclick="showFilter(event,\'example_6\')"></span>'
|
|
}, {
|
|
title: 'Consignment<br>Note<br> <span class="fa fa-filter filterIcon blue" onclick="showFilter(event,\'example_7\')"></span>'
|
|
}, {
|
|
title: 'Total<br>CTN<br> <span class="fa fa-filter filterIcon blue" onclick="showFilter(event,\'example_8\')"></span>'
|
|
}, {
|
|
title: 'UOM<br> <span class="fa fa-filter filterIcon blue" onclick="showFilter(event,\'example_9\')"></span>'
|
|
}, {
|
|
title: 'Total<br>CBM<br> <span class="fa fa-filter filterIcon blue" onclick="showFilter(event,\'example_10\')"></span>'
|
|
}, {
|
|
title: 'Total Goods<br>Weight<br> <span class="fa fa-filter filterIcon blue" onclick="showFilter(event,\'example_11\')"></span>'
|
|
}, {
|
|
title: 'Remark<br> <span class="fa fa-filter filterIcon blue" onclick="showFilter(event,\'example_12\')"></span>'
|
|
}, {
|
|
title: 'Actions<br> <span class="fa fa-filter filterIcon blue" onclick="showFilter(event,\'example_12\')"></span>'
|
|
},
|
|
|
|
// { title: 'Stats' },
|
|
],
|
|
|
|
initComplete: function() {
|
|
configFilter(this, [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]);
|
|
}
|
|
});
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
//This function initializes the content inside the filter modal
|
|
function configFilter($this, colArray) {
|
|
setTimeout(function() {
|
|
var tableName = $this[0].id;
|
|
var columns = $this.api().columns();
|
|
// $.each(colArray, function (i, arg) {
|
|
// $('#' + tableName + ' th:eq(' + arg + ')').append('<br><img src="http://www.icone-png.com/png/39/38556.png" class="filterIcon" onclick="showFilter(event,\'' + tableName + '_' + arg + '\')" />');
|
|
//});
|
|
|
|
var template = '<div class="modal modalFilter modal-scroll in">' +
|
|
'<div class="modal-dialog modal-full" style="margin-top: 0px;margin-bottom: 0px;">' +
|
|
'<div class="modal-content">' +
|
|
'<div class="modal-body">' + '{0}</div>' +
|
|
'<div class="modal-footer">' +
|
|
'<a onclick="clearFilter(this, {1}, \'{2}\');" class=" btn left waves-effect waves-light" data-dismiss="modal" >Clear</a>' +
|
|
'<a onclick="performFilter(this, {1}, \'{2}\');" class=" btn right waves-effect waves-light">Ok</a>' +
|
|
'</div>' +
|
|
'</div>' +
|
|
'</div>' +
|
|
'</div>';
|
|
$.each(colArray, function(index, value) {
|
|
columns.every(function(i) {
|
|
if (value === i) {
|
|
var column = this,
|
|
content = '<input type="text" class="filterSearchText form-control" onkeyup="filterValues(this)" /> <br/>';
|
|
var columnName = $(this.header()).text().replace(/\s+/g, "_");
|
|
var distinctArray = [];
|
|
column.data().each(function(d, j) {
|
|
if (distinctArray.indexOf(d) == -1) {
|
|
//alert(jQuery.type( d ));
|
|
d = d.replace("<a class='chat_link' href='chat.html'>", '');
|
|
d = d.replace("<span style='margin-bottom: 20px;' class='bb badge badge-danger'>5</span></a>", '');
|
|
|
|
var id = tableName + "_" + columnName + "_" + j; // onchange="formatValues(this,' + value + ');
|
|
content += '<div><input type="checkbox" value="' + d + '" id="' + id + '"/> <label style="font-size:10px" for="' + id + '"> ' + d + '</label></div>';
|
|
distinctArray.push(d);
|
|
}
|
|
});
|
|
var newTemplate = $(template.replace('{0}', content).replace('{1}', value).replace('{1}', value).replace('{2}', tableName).replace('{2}', tableName));
|
|
$('body').append(newTemplate);
|
|
modalFilterArray[tableName + "_" + value] = newTemplate;
|
|
content = '';
|
|
}
|
|
});
|
|
});
|
|
}, 50);
|
|
}
|
|
var modalFilterArray = {};
|
|
//User to show the filter modal
|
|
function showFilter(e, index) {
|
|
$('.modalFilter').hide();
|
|
$(modalFilterArray[index]).css({
|
|
left: 0,
|
|
top: 0
|
|
});
|
|
var th = $(e.target).parent();
|
|
var pos = th.offset();
|
|
console.log(th);
|
|
$(modalFilterArray[index]).width(th.width() * 3.0);
|
|
$(modalFilterArray[index]).css({
|
|
'left': pos.left,
|
|
'top': pos.top
|
|
});
|
|
$(modalFilterArray[index]).show();
|
|
$('#mask').show();
|
|
e.stopPropagation();
|
|
}
|
|
|
|
//This function is to use the searchbox to filter the checkbox
|
|
function filterValues(node) {
|
|
var searchString = $(node).val();
|
|
var rootNode = $(node).parent();
|
|
if (searchString == '') {
|
|
rootNode.find('div').show();
|
|
} else {
|
|
rootNode.find("div").hide();
|
|
rootNode.find("div:contains('" + searchString + "')").show();
|
|
}
|
|
}
|
|
|
|
//Execute the filter on the table for a given column
|
|
function performFilter(node, i, tableId) {
|
|
var rootNode = $(node).parent().parent();
|
|
var searchString = '',
|
|
counter = 0;
|
|
|
|
rootNode.find('input:checkbox').each(function(index, checkbox) {
|
|
if (checkbox.checked) {
|
|
searchString += (counter == 0) ? checkbox.value : '|' + checkbox.value;
|
|
counter++;
|
|
}
|
|
});
|
|
$('#' + tableId).DataTable().column(i).search(
|
|
searchString,
|
|
true, false
|
|
).draw();
|
|
rootNode.hide();
|
|
$('#mask').hide();
|
|
$('.modalFilter').hide();
|
|
}
|
|
|
|
//Removes the filter from the table for a given column
|
|
function clearFilter(node, i, tableId) {
|
|
var rootNode = $(node).parent().parent();
|
|
rootNode.find(".filterSearchText").val('');
|
|
rootNode.find('input:checkbox').each(function(index, checkbox) {
|
|
checkbox.checked = false;
|
|
$(checkbox).parent().show();
|
|
});
|
|
$('#' + tableId).DataTable().column(i).search(
|
|
'',
|
|
true, false
|
|
).draw();
|
|
rootNode.hide();
|
|
$('#mask').hide();
|
|
$('.modalFilter').hide();
|
|
}
|
|
|
|
|
|
var FormWizard = function() {
|
|
|
|
|
|
return {
|
|
//main function to initiate the module
|
|
init: function() {
|
|
if (!jQuery().bootstrapWizard) {
|
|
return;
|
|
}
|
|
|
|
function format(state) {
|
|
if (!state.id) return state.text; // optgroup
|
|
return "<img class='flag' src='../../assets/global/img/flags/" + state.id.toLowerCase() + ".png'/> " + state.text;
|
|
}
|
|
|
|
$("#country_list").select2({
|
|
placeholder: "Select",
|
|
allowClear: true,
|
|
formatResult: format,
|
|
width: 'auto',
|
|
formatSelection: format,
|
|
escapeMarkup: function(m) {
|
|
return m;
|
|
}
|
|
});
|
|
|
|
var form = $('#submit_form');
|
|
var error = $('.alert-danger', form);
|
|
var success = $('.alert-success', form);
|
|
|
|
var displayConfirm = function() {
|
|
$('#tab4 .form-control-static', form).each(function() {
|
|
var input = $('[name="' + $(this).attr("data-display") + '"]', form);
|
|
if (input.is(":radio")) {
|
|
input = $('[name="' + $(this).attr("data-display") + '"]:checked', form);
|
|
}
|
|
if (input.is(":text") || input.is("textarea")) {
|
|
$(this).html(input.val());
|
|
} else if (input.is("select")) {
|
|
$(this).html(input.find('option:selected').text());
|
|
} else if (input.is(":radio") && input.is(":checked")) {
|
|
$(this).html(input.attr("data-title"));
|
|
} else if ($(this).attr("data-display") == 'payment[]') {
|
|
var payment = [];
|
|
$('[name="payment[]"]:checked', form).each(function() {
|
|
payment.push($(this).attr('data-title'));
|
|
});
|
|
$(this).html(payment.join("<br>"));
|
|
}
|
|
});
|
|
}
|
|
|
|
var handleTitle = function(tab, navigation, index) {
|
|
var total = navigation.find('li').length;
|
|
var current = index + 1;
|
|
// set wizard title
|
|
$('.step-title', $('#form_wizard_1')).text('Step ' + (index + 1) + ' of ' + total);
|
|
// set done steps
|
|
jQuery('li', $('#form_wizard_1')).removeClass("done");
|
|
var li_list = navigation.find('li');
|
|
for (var i = 0; i < index; i++) {
|
|
jQuery(li_list[i]).addClass("done");
|
|
}
|
|
|
|
if (current == 1) {
|
|
$('#form_wizard_1').find('.button-previous').hide();
|
|
} else {
|
|
$('#form_wizard_1').find('.button-previous').show();
|
|
}
|
|
|
|
if (current >= total) {
|
|
$('#form_wizard_1').find('.button-next').hide();
|
|
$('#form_wizard_1').find('.button-submit').show();
|
|
displayConfirm();
|
|
} else {
|
|
$('#form_wizard_1').find('.button-next').show();
|
|
$('#form_wizard_1').find('.button-submit').hide();
|
|
}
|
|
App.scrollTo($('.page-title'));
|
|
}
|
|
|
|
// default form wizard
|
|
$('#form_wizard_1').bootstrapWizard({
|
|
'nextSelector': '.button-next',
|
|
'previousSelector': '.button-previous',
|
|
onTabClick: function(tab, navigation, index, clickedIndex) {
|
|
return false;
|
|
|
|
success.hide();
|
|
error.hide();
|
|
<!-- if (form.valid() == false) { -->
|
|
<!-- return false; -->
|
|
<!-- } -->
|
|
|
|
handleTitle(tab, navigation, clickedIndex);
|
|
},
|
|
onNext: function(tab, navigation, index) {
|
|
success.hide();
|
|
error.hide();
|
|
|
|
<!-- if (form.valid() == false) { -->
|
|
<!-- return false; -->
|
|
<!-- } -->
|
|
|
|
handleTitle(tab, navigation, index);
|
|
},
|
|
onPrevious: function(tab, navigation, index) {
|
|
success.hide();
|
|
error.hide();
|
|
|
|
handleTitle(tab, navigation, index);
|
|
},
|
|
onTabShow: function(tab, navigation, index) {
|
|
var total = navigation.find('li').length;
|
|
var current = index + 1;
|
|
var $percent = (current / total) * 100;
|
|
$('#form_wizard_1').find('.progress-bar').css({
|
|
width: $percent + '%'
|
|
});
|
|
}
|
|
});
|
|
|
|
$('#form_wizard_1').find('.button-previous').hide();
|
|
$('#form_wizard_1 .button-submit').click(function() {
|
|
location.reload();
|
|
}).hide();
|
|
|
|
|
|
}
|
|
|
|
};
|
|
|
|
}();
|
|
|
|
jQuery(document).ready(function() {
|
|
FormWizard.init();
|
|
var rowCount = $('#sample_editable_1 tr').length;
|
|
$('#total').html(rowCount);
|
|
|
|
});
|
|
</script>
|
|
<script>
|
|
var counter = 1;
|
|
var limit = 3;
|
|
|
|
function addInput(divName) {
|
|
if (counter == limit) {
|
|
alert("You have reached the limit of adding " + counter + " inputs");
|
|
} else {
|
|
var newdiv = document.createElement('div');
|
|
newdiv.innerHTML = "Remark " + (counter + 1) + " <br><input type='text' style='height: 100px; width: 340px' name='myInputs[]'>";
|
|
document.getElementById(divName).appendChild(newdiv);
|
|
counter++;
|
|
}
|
|
}
|
|
|
|
function addNewRow() {
|
|
|
|
var last_count = $('#sample_editable_1').find('tbody tr:last td:first').text();
|
|
|
|
var next_count = parseInt(last_count) + 1;
|
|
|
|
var lengths = $("#sample_editable_1 tbody tr:nth-child(2) td").length;
|
|
|
|
$('#sample_editable_1 > tbody:last-child').append('<tr><td>' + next_count + '</td><td></td><td></td><td></td><td><input style="width: 34px;" type="text"/></td><td><input style="width: 75px;" type="text"/></td><td><input style="width: 34px;" type="text"/></td><td></td><td><label class="mt-checkbox mt-checkbox-single mt-checkbox-outline"><input type="checkbox" class="checkboxes" value="1"><span></span></label></td><td><div><span class="fileinput-new"></span><span class="fileinput-exists"></span><input type="file" name="..."></div></td>');
|
|
|
|
var rowCount = $('#sample_editable_1 tbody tr').length;
|
|
$('#total').html(rowCount);
|
|
}
|
|
|
|
function addNewColumn() {
|
|
$('#sample_editable_1 thead').find('tr').each(function() {
|
|
$(this).find('th').eq(7).after('<th>Remark</th>');
|
|
});
|
|
$('#sample_editable_1 tbody').find('tr').each(function() {
|
|
$(this).find('td').eq(7).after('<td><textarea style="width: 34px;"></textarea></td>');
|
|
});
|
|
$('#sample_editable_1 tfoot').find('tr').each(function() {
|
|
$(this).find('td').eq(7).after('<td><textarea style="width: 34px;"></textarea></td>');
|
|
});
|
|
|
|
}
|
|
</script>
|
|
<script type="text/javascript">
|
|
var howmanytoadd = 2;
|
|
var rows;
|
|
|
|
function calc() {
|
|
var tot = 0;
|
|
for (var i = 0; i < rows.length; i++) {
|
|
var linetot = 0;
|
|
rows[i].getElementsByTagName('input')[howmanytoadd].value = linetot;
|
|
tot += linetot;
|
|
}
|
|
document.getElementById('total').value = tot
|
|
}
|
|
</script>
|
|
<script type="text/javascript">
|
|
function findTotal() {
|
|
var arr = document.getElementsByName('qty');
|
|
var tot = 0;
|
|
for (var i = 0; i < arr.length; i++) {
|
|
if (parseInt(arr[i].value))
|
|
tot += parseInt(arr[i].value);
|
|
}
|
|
document.getElementById('total1').value = tot;
|
|
}
|
|
</script>
|
|
|
|
|
|
</body>
|
|
|
|
</html> |