540 comments found.
Hi, I need The HTML Files of the projects, How Can I get it, Also The Documentation file ( I can’t download it ) Thank you
Hello, Please visit the folder /html/ or /bootstrap/template/dist/ there you will find the HTML files.
What is the difference between this and “Elite Able”?
Elite Able has more features than the Able Pro. It has variety of layouts options & pages.
How can I get HTML files , I only Find three folder ( React – bootstrap – Angular )
Why you aren’t replying for me? If I can’t get it, Sorry I will back this Item, Thank you
Sir, the HTML files you will find under bootstrap/dist folder.
Hello, can i integrate this template in ASP.NET & ASP.NET Core projects?
For that you need to add the proper assets path. The template comes with HTML code and you can easily structured it.
Let me know if you have any other query.
- Thank You
Hey man I am a complete beginner, how do I start. I looked at the documentation but I still need some assistance. Thanks.
Yes sure.Please start with the sample-page.html – There you can easily start your project. In Head section we have added the required CSS files and in bottom before body tag over we have added the required JS files. So, you must attach the all required CSS and JS files in your project page. The assets/ folder covers all JS, CSS, and image files. Make sure you must add this folder too.
Hi, I have a issue, DataTable row reorder dosn’t work. http://ableproadmin.com/bootstrap/default/dt_ext_row_reorder.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Ablepro v8.0 bootstrap admin template by Phoenixcoded</title>
<!-- HTML5 Shim and Respond.js IE11 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 11]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<!-- Meta -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="description" content="" />
<meta name="keywords" content="">
<meta name="author" content="Phoenixcoded" />
<!-- Favicon icon -->
<link rel="icon" href="assets/images/favicon.ico" type="image/x-icon">
<!-- data tables css -->
<link rel="stylesheet" href="assets/css/plugins/dataTables.bootstrap4.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/rowreorder/1.2.6/css/rowReorder.dataTables.min.css">
<!-- vendor css -->
<link rel="stylesheet" href="assets/css/style.css">
</head>
<body class="">
<!-- [ Pre-loader ] start -->
<div class="loader-bg">
<div class="loader-track">
<div class="loader-fill" />
</div>
</div>
<!-- [ Pre-loader ] End -->
<!-- [ navigation menu ] start -->
<nav class="pcoded-navbar menu-light ">
<div class="navbar-wrapper ">
<div class="navbar-content scroll-div ">
<div class="">
<div class="main-menu-header">
<img class="img-radius" src="assets/images/user/avatar-2.jpg" alt="User-Profile-Image" />
<div class="user-details">
<div id="more-details">UX Designer <i class="fa fa-caret-down" /></div>
</div>
</div>
<div class="collapse" id="nav-user-link">
<ul class="list-inline">
<li class="list-inline-item"><a href="user-profile.html" data-toggle="tooltip" title="View Profile"><i class="feather icon-user" /></a></li>
<li class="list-inline-item"><a href="email_inbox.html"><i class="feather icon-mail" data-toggle="tooltip" title="Messages" /><small class="badge badge-pill badge-primary">5</small></a></li>
<li class="list-inline-item"><a href="auth-signin.html" data-toggle="tooltip" title="Logout" class="text-danger"><i class="feather icon-power" /></a></li>
</ul>
</div>
</div>
<ul class="nav pcoded-inner-navbar ">
<li class="nav-item pcoded-menu-caption">
<label>Navigation</label>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-home" /></span><span class="pcoded-mtext">Dashboard</span></a>
<ul class="pcoded-submenu">
<li><a href="index.html">Default</a></li>
<li><a href="dashboard-sale.html">Sales</a></li>
<li><a href="dashboard-crm.html">CRM</a></li>
<li><a href="dashboard-analytics.html">Analytics</a></li>
<li><a href="dashboard-project.html">Project</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-layout" /></span><span class="pcoded-mtext">Page layouts</span></a>
<ul class="pcoded-submenu">
<li class="pcoded-hasmenu"><a href="#!">Vertical</a>
<ul class="pcoded-submenu">
<li><a href="layout-static.html" target="_blank">Static</a></li>
<li><a href="layout-fixed.html" target="_blank">Fixed</a></li>
<li><a href="layout-menu-fixed.html" target="_blank">Navbar fixed</a></li>
<li><a href="layout-mini-menu.html" target="_blank">Collapse menu</a></li>
<li><a href="layout-rtl.html" target="_blank">Vertical RTL</a></li>
</ul>
</li>
<li><a href="layout-horizontal.html" target="_blank">Horizontal</a></li>
<li><a href="layout-horizontal-2.html" target="_blank">Horizontal v2</a></li>
<li><a href="layout-horizontal-rtl.html" target="_blank">Horizontal RTL</a></li>
<li><a href="layout-box.html" target="_blank">Box layout</a></li>
<li><a href="layout-light.html" target="_blank">Navbar dark</a></li>
<li><a href="layout-dark.html" target="_blank">Dark layout <span class="pcoded-badge badge badge-danger">Hot</span></a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-layers" /></span><span class="pcoded-mtext">Widget</span><span class="pcoded-badge badge badge-success">100+</span></a>
<ul class="pcoded-submenu">
<li><a href="widget-statistic.html">Statistic</a></li>
<li><a href="widget-data.html">Data</a></li>
<li><a href="widget-chart.html">Chart</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i class="feather icon-users" /></span><span class="pcoded-mtext">User</span></a>
<ul class="pcoded-submenu">
<li><a href="user-profile.html">Profile</a></li>
<li><a href="user-card.html">User Card</a></li>
<li><a href="user-list.html">User List</a></li>
</ul>
</li>
<li class="nav-item pcoded-menu-caption">
<label>Admin Panel <span class="pcoded-badge badge badge-danger">NEW</span><span class="pcoded-badge badge badge-warning">HOT</span></label>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-activity" /></span><span class="pcoded-mtext">Hospital</span></a>
<ul class="pcoded-submenu">
<li><a href="hospital-dashboard.html">Dashboard</a></li>
<li><a href="hospital-department.html">Department</a></li>
<li><a href="hospital-doctor.html">Doctor</a></li>
<li><a href="hospital-patient.html">Patient</a></li>
<li><a href="hospital-nurse.html">Nurse</a></li>
<li><a href="hospital-pharmacist.html">Pharmacist</a></li>
<li><a href="hospital-laboratorie.html">Laboratory</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-package" /></span><span class="pcoded-mtext">Project & CRM</span></a>
<ul class="pcoded-submenu">
<li><a href="project-dashboard.html">Dashboard</a></li>
<li><a href="project-customers.html">Customers</a></li>
<li><a href="project-projects.html">Projects</a></li>
<li><a href="project-task.html">Task</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-user-check" /></span><span class="pcoded-mtext">Membership</span></a>
<ul class="pcoded-submenu">
<li><a href="member-dashboard.html">Dashboard</a></li>
<li><a href="member-mail-template.html">Email templates</a></li>
<li><a href="member-countries.html">Country</a></li>
<li><a href="member-coupons.html">Coupons</a></li>
<li><a href="member-newsletter.html">Newsletter</a></li>
<li><a href="member-user.html">User</a></li>
<li><a href="member-membership.html">Membership</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-life-buoy" /></span><span class="pcoded-mtext">Helpdesk</span></a>
<ul class="pcoded-submenu">
<li><a href="help-dashboard.html">Helpdesk dashboard</a></li>
<li><a href="help-create-ticket.html">Create ticket</a></li>
<li><a href="help-ticket.html">ticket list</a></li>
<li><a href="help-ticket-details.html">ticket Details</a></li>
<li><a href="help-customer.html">Customer</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-book" /></span><span class="pcoded-mtext">School</span></a>
<ul class="pcoded-submenu">
<li><a href="school-dashboard.html">Dashboard</a></li>
<li><a href="school-student.html">Student</a></li>
<li><a href="school-parents.html">Parents</a></li>
<li><a href="school-teacher.html">Teacher</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link" data-toggle="tooltip" title="Student Information System"><span class="pcoded-micon"><i class="feather icon-user" /></span><span class="pcoded-mtext">SIS</span></a>
<ul class="pcoded-submenu">
<li><a href="sis-dashboard.html">Dashboard</a></li>
<li><a href="sis-leave.html">Leave</a></li>
<li><a href="sis-evaluation.html">Evaluation</a></li>
<li><a href="sis-event.html">Event</a></li>
<li><a href="sis-circular.html">Circular</a></li>
<li><a href="sis-course.html">Course</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i class="feather icon-target" /></span><span class="pcoded-mtext">Crypto</span></a>
<ul class="pcoded-submenu">
<li><a href="crypto-dashboard.html">Dashboard</a></li>
<li><a href="crypto-exchange.html">Exchange</a></li>
<li><a href="crypto-wallet.html">Wallet</a></li>
<li><a href="crypto-transactions.html">Transactions</a></li>
<li><a href="crypto-history.html">History</a></li>
<li><a href="crypto-trading.html">Trading</a></li>
<li><a href="crypto-initial-coin.html">Initial coin</a></li>
<li><a href="crypto-ico-listing.html">Ico listing</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link"><span class="pcoded-micon"><i class="feather icon-shopping-cart" /></span><span class="pcoded-mtext">E-Commerce</span></a>
<ul class="pcoded-submenu">
<li><a href="ecom-product.html">Product</a></li>
<li><a href="ecom-product-details.html">Product details</a></li>
<li><a href="ecom-order.html">Order</a></li>
<li><a href="ecom-checkout.html">Checkout</a></li>
<li><a href="ecom-cart.html">Shopping Cart</a></li>
<li><a href="ecom-customers.html">Customers</a></li>
<li><a href="ecom-sellers.html">Sellers</a></li>
</ul>
</li>
<li class="nav-item pcoded-menu-caption">
<label>UI Element</label>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-box" /></span><span class="pcoded-mtext">Basic</span></a>
<ul class="pcoded-submenu">
<li><a href="bc_alert.html">Alert</a></li>
<li><a href="bc_button.html">Button</a></li>
<li><a href="bc_badges.html">Badges</a></li>
<li><a href="bc_breadcrumb-pagination.html">Breadcrumb & paggination</a></li>
<li><a href="bc_card.html">Cards</a></li>
<li><a href="bc_collapse.html">Collapse</a></li>
<li><a href="bc_carousel.html">Carousel</a></li>
<li><a href="bc_grid.html">Grid system</a></li>
<li><a href="bc_progress.html">Progress</a></li>
<li><a href="bc_modal.html">Modal</a></li>
<li><a href="bc_spinner.html">Spinner</a></li>
<li><a href="bc_tabs.html">Tabs & pills</a></li>
<li><a href="bc_typography.html">Typography</a></li>
<li><a href="bc_tooltip-popover.html">Tooltip & popovers</a></li>
<li><a href="bc_toasts.html">Toasts</a></li>
<li><a href="bc_extra.html">Other</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-gitlab" /></span><span class="pcoded-mtext">Advance</span></a>
<ul class="pcoded-submenu">
<li><a href="ac_alert.html">Sweet alert</a></li>
<li><a href="ac-datepicker-componant.html">Datepicker</a></li>
<li><a href="ac_lightbox.html">Lightbox</a></li>
<li><a href="ac_notification.html">Notification</a></li>
<li><a href="ac_pnotify.html">Pnotify</a></li>
<li><a href="ac_rating.html">Rating</a></li>
<li><a href="ac_rangeslider.html">Rangeslider</a></li>
<li><a href="ac_syntax_highlighter.html">Syntax highlighter</a></li>
</ul>
</li>
<li class="nav-item"><a href="animation.html" class="nav-link "><span class="pcoded-micon"><i class="feather icon-aperture" /></span><span class="pcoded-mtext">Animations</span></a></li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-feather" /></span><span class="pcoded-mtext">Icons</span></a>
<ul class="pcoded-submenu">
<li><a href="icon-feather.html">Feather<span class="pcoded-badge badge badge-danger">NEW</span></a></li>
<li><a href="icon-fontawsome.html">Font Awesome 5<span class="pcoded-badge badge badge-primary">1000+</span></a></li>
</ul>
</li>
<li class="nav-item pcoded-menu-caption">
<label>Forms</label>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-file-text" /></span><span class="pcoded-mtext">Forms</span></a>
<ul class="pcoded-submenu">
<li><a href="form_elements.html">Form elements</a></li>
<li><a href="form-elements-advance.html">Form advance</a></li>
<li><a href="form-validation.html">Form validation</a></li>
<li><a href="form-masking.html">Form masking</a></li>
<li><a href="form-wizard.html">Form wizard</a></li>
<li><a href="form-picker.html">Form picker</a></li>
<li><a href="form-select.html">Form select</a></li>
</ul>
</li>
<li class="nav-item pcoded-menu-caption">
<label>table</label>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-align-justify" /></span><span class="pcoded-mtext">Bootstrap table</span></a>
<ul class="pcoded-submenu">
<li><a href="tbl_bootstrap.html">Basic table</a></li>
<li><a href="tbl_sizing.html">Sizing table</a></li>
<li><a href="tbl_border.html">Border table</a></li>
<li><a href="tbl_styling.html">Styling table</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-package" /></span><span class="pcoded-mtext">Data table</span></a>
<ul class="pcoded-submenu">
<li><a href="dt_basic.html">Basic initialization</a></li>
<li><a href="dt_advance.html">Advance initialization</a></li>
<li><a href="dt_styling.html">Styling</a></li>
<li><a href="dt_api.html">API</a></li>
<li><a href="dt_plugin.html">Plug-in</a></li>
<li><a href="dt_sources.html">Data sources</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-server" /></span><span class="pcoded-mtext">DT extensions</span></a>
<ul class="pcoded-submenu">
<li><a href="dt_ext_autofill.html">Autofill</a></li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-mtext">Button</span></a>
<ul class="pcoded-submenu">
<li><a href="dt_ext_basic_buttons.html">Basic button</a></li>
<li><a href="dt_ext_export_buttons.html">Data export</a></li>
</ul>
</li>
<li><a href="dt_ext_col_reorder.html">Col reorder</a></li>
<li><a href="dt_ext_fixed_columns.html">Fixed columns</a></li>
<li><a href="dt_ext_fixed_header.html">Fixed header</a></li>
<li><a href="dt_ext_key_table.html">Key table</a></li>
<li><a href="dt_ext_responsive.html">Responsive</a></li>
<li><a href="dt_ext_row_reorder.html">Row reorder</a></li>
<li><a href="dt_ext_scroller.html">Scroller</a></li>
<li><a href="dt_ext_select.html">Select table</a></li>
</ul>
</li>
<li class="nav-item pcoded-menu-caption">
<label>Chart & Maps</label>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-pie-chart" /></span><span class="pcoded-mtext">Chart</span></a>
<ul class="pcoded-submenu">
<li><a href="chart-apex.html">Apex Chart</a></li>
<li><a href="chart-chartjs.html">Chart js</a></li>
<li><a href="chart-highchart.html">Highchart</a></li>
<li><a href="chart-knob.html">Knob</a></li>
<li><a href="chart-peity.html">Peity</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-map" /></span><span class="pcoded-mtext">Maps</span></a>
<ul class="pcoded-submenu">
<li><a href="map-google.html">Google</a></li>
<li><a href="map-api.html">Gmap search API</a></li>
</ul>
</li>
<li class="nav-item pcoded-menu-caption">
<label>Pages</label>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-lock" /></span><span class="pcoded-mtext">Authentication</span></a>
<ul class="pcoded-submenu">
<li><a href="auth-signup.html" target="_blank">Sign up</a></li>
<li><a href="auth-signup-img-side.html" target="_blank">Sign up v2 <span class="pcoded-badge badge badge-light-danger">NEW</span></a></li>
<li><a href="auth-signin.html" target="_blank">Sign in</a></li>
<li><a href="auth-signin-img-side.html" target="_blank">Sign in v2 <span class="pcoded-badge badge badge-light-danger">NEW</span></a></li>
<li><a href="auth-reset-password.html" target="_blank">Reset password</a></li>
<li><a href="auth-reset-password-img-side.html" target="_blank">Reset password v2 <span class="pcoded-badge badge badge-light-danger">NEW</span></a></li>
<li><a href="auth-change-password.html" target="_blank">Change password</a></li>
<li><a href="auth-change-password-img-side.html" target="_blank">Change password v2 <span class="pcoded-badge badge badge-light-danger">NEW</span></a></li>
<li><a href="auth-profile-settings.html" target="_blank">Profile settings</a></li>
<li><a href="auth-tabs.html" target="_blank">Tabs Authentication</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-sliders" /></span><span class="pcoded-mtext">Maintenance</span></a>
<ul class="pcoded-submenu">
<li><a href="maint-error.html">Error</a></li>
<li><a href="maint-offline-ui.html" target="_blank">Offline UI</a></li>
<li><a href="maint-maintance.html" target="_blank">Maintenance</a></li>
</ul>
</li>
<li class="nav-item pcoded-menu-caption">
<label>App</label>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-mail" /></span><span class="pcoded-mtext">Email</span></a>
<ul class="pcoded-submenu">
<li><a href="email_inbox.html">Inbox</a></li>
<li><a href="email_read.html">Read mail</a></li>
<li><a href="email_compose.html">Compose mail</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-clipboard" /></span><span class="pcoded-mtext">Task</span></a>
<ul class="pcoded-submenu">
<li><a href="task-list.html">List</a></li>
<li><a href="task-board.html">Board</a></li>
<li><a href="task-detail.html">Detail</a></li>
</ul>
</li>
<li class="nav-item">
<a href="todo.html" class="nav-link "><span class="pcoded-micon"><i class="feather icon-check-square" /></span><span class="pcoded-mtext">To-Do</span></a>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-image" /></span><span class="pcoded-mtext">Gallery</span></a>
<ul class="pcoded-submenu">
<li><a href="gallery-grid.html">Grid</a></li>
<li><a href="gallery-masonry.html">Masonry</a></li>
</ul>
</li>
<li class="nav-item pcoded-menu-caption">
<label>Extension</label>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-file-plus" /></span><span class="pcoded-mtext">Editor</span></a>
<ul class="pcoded-submenu">
<li><a href="editor-classic.html">CK editor</a></li>
<li><a href="editor-trumbowyg.html">Trumbowyg editor</a></li>
</ul>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-file-minus" /></span><span class="pcoded-mtext">Invoice</span></a>
<ul class="pcoded-submenu">
<li><a href="invoice.html">Invoice</a></li>
<li><a href="invoice-summary.html">Invoice summary</a></li>
<li><a href="invoice-list.html">Invoice list</a></li>
</ul>
</li>
<li class="nav-item"><a href="full-calendar.html" class="nav-link "><span class="pcoded-micon"><i class="feather icon-calendar" /></span><span class="pcoded-mtext">Full calendar</span></a></li>
<li class="nav-item"><a href="file-upload.html" class="nav-link "><span class="pcoded-micon"><i class="feather icon-upload-cloud" /></span><span class="pcoded-mtext">File upload</span></a></li>
<li class="nav-item"><a href="image_crop.html" class="nav-link "><span class="pcoded-micon"><i class="feather icon-scissors" /></span><span class="pcoded-mtext">Image cropper</span></a></li>
<li class="nav-item pcoded-menu-caption">
<label>Other</label>
</li>
<li class="nav-item pcoded-hasmenu">
<a href="#" class="nav-link "><span class="pcoded-micon"><i class="feather icon-menu" /></span><span class="pcoded-mtext">Menu levels</span></a>
<ul class="pcoded-submenu">
<li><a href="#">Menu Level 2.1</a></li>
<li class="pcoded-hasmenu">
<a href="#">Menu level 2.2</a>
<ul class="pcoded-submenu">
<li><a href="#">Menu level 3.1</a></li>
<li><a href="#">Menu level 3.2</a></li>
</ul>
</li>
</ul>
</li>
<li class="nav-item disabled"><a href="#!" class="nav-link "><span class="pcoded-micon"><i class="feather icon-power" /></span><span class="pcoded-mtext">Disabled menu</span></a></li>
<li class="nav-item"><a href="sample-page.html" class="nav-link "><span class="pcoded-micon"><i class="feather icon-sidebar" /></span><span class="pcoded-mtext">Sample page</span></a></li>
</ul>
<div class="card text-center">
<div class="card-block">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<i class="feather icon-sunset f-40" />
<h6 class="mt-3">Help?</h6>
<p>Please contact us on our email for need any support</p>
<a href="#!" target="_blank" class="btn btn-primary btn-sm text-white m-0">Support</a>
</div>
</div>
</div>
</div>
</nav>
<!-- [ navigation menu ] end -->
<!-- [ Header ] start -->
<header class="navbar pcoded-header navbar-expand-lg navbar-light header-blue">
<div class="m-header">
<a class="mobile-menu" id="mobile-collapse" href="#!"><span /></a>
<a href="#!" class="b-brand">
<!-- ======== change your logo hear ============ -->
<img src="assets/images/logo.png" alt="" class="logo" />
<img src="assets/images/logo-icon.png" alt="" class="logo-thumb" />
</a>
<a href="#!" class="mob-toggler">
<i class="feather icon-more-vertical" />
</a>
</div>
<div class="collapse navbar-collapse">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a href="#!" class="pop-search"><i class="feather icon-search" /></a>
<div class="search-bar">
<input type="text" class="form-control border-0 shadow-none" placeholder="Search hear">
<button type="button" class="close" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
</li>
</ul>
<ul class="navbar-nav ml-auto">
<li>
<div class="dropdown">
<a class="dropdown-toggle" href="#" data-toggle="dropdown"><i class="icon feather icon-bell" /></a>
<div class="dropdown-menu dropdown-menu-right notification">
<div class="noti-head">
<h6 class="d-inline-block m-b-0">Notifications</h6>
<div class="float-right">
<a href="#!" class="m-r-10">mark as read</a>
<a href="#!">clear all</a>
</div>
</div>
<ul class="noti-body">
<li class="n-title">
<p class="m-b-0">NEW</p>
</li>
<li class="notification">
<div class="media">
<img class="img-radius" src="assets/images/user/avatar-1.jpg" alt="Generic placeholder image" />
<div class="media-body">
<p><strong>John Doe</strong><span class="n-time text-muted"><i class="icon feather icon-clock m-r-10" />5 min</span></p>
<p>New ticket Added</p>
</div>
</div>
</li>
<li class="n-title">
<p class="m-b-0">EARLIER</p>
</li>
<li class="notification">
<div class="media">
<img class="img-radius" src="assets/images/user/avatar-2.jpg" alt="Generic placeholder image" />
<div class="media-body">
<p><strong>Joseph William</strong><span class="n-time text-muted"><i class="icon feather icon-clock m-r-10" />10 min</span></p>
<p>Prchace New Theme and make payment</p>
</div>
</div>
</li>
<li class="notification">
<div class="media">
<img class="img-radius" src="assets/images/user/avatar-1.jpg" alt="Generic placeholder image" />
<div class="media-body">
<p><strong>Sara Soudein</strong><span class="n-time text-muted"><i class="icon feather icon-clock m-r-10" />12 min</span></p>
<p>currently login</p>
</div>
</div>
</li>
<li class="notification">
<div class="media">
<img class="img-radius" src="assets/images/user/avatar-2.jpg" alt="Generic placeholder image" />
<div class="media-body">
<p><strong>Joseph William</strong><span class="n-time text-muted"><i class="icon feather icon-clock m-r-10" />30 min</span></p>
<p>Prchace New Theme and make payment</p>
</div>
</div>
</li>
</ul>
<div class="noti-footer">
<a href="#!">show all</a>
</div>
</div>
</div>
</li>
<li>
<div class="dropdown drp-user">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="feather icon-user" />
</a>
<div class="dropdown-menu dropdown-menu-right profile-notification">
<div class="pro-head">
<img src="assets/images/user/avatar-1.jpg" class="img-radius" alt="User-Profile-Image" />
<span>John Doe</span>
<a href="auth-signin.html" class="dud-logout" title="Logout">
<i class="feather icon-log-out" />
</a>
</div>
<ul class="pro-body">
<li><a href="user-profile.html" class="dropdown-item"><i class="feather icon-user" /> Profile</a></li>
<li><a href="email_inbox.html" class="dropdown-item"><i class="feather icon-mail" /> My Messages</a></li>
<li><a href="auth-signin.html" class="dropdown-item"><i class="feather icon-lock" /> Lock Screen</a></li>
</ul>
</div>
</div>
</li>
</ul>
</div>
</header>
<!-- [ Header ] end -->
<!-- [ Main Content ] start -->
<section class="pcoded-main-container">
<div class="pcoded-content">
<!-- [ breadcrumb ] start -->
<div class="page-header">
<div class="page-block">
<div class="row align-items-center">
<div class="col-md-12">
<div class="page-header-title">
<h5 class="m-b-10">Rows Reorder</h5>
</div>
<ul class="breadcrumb">
<li class="breadcrumb-item"><a href="index.html"><i class="feather icon-home" /></a></li>
<li class="breadcrumb-item"><a href="#!">Data Table</a></li>
<li class="breadcrumb-item"><a href="#!">Rows Reorder</a></li>
</ul>
</div>
</div>
</div>
</div>
<!-- [ breadcrumb ] end -->
<!-- [ Main Content ] start -->
<div class="row">
<!-- Basic row reorder table start -->
<div class="col-sm-12">
<div class="card">
<div class="card-header">
<h5>Basic Row Reorder</h5>
</div>
<div class="card-body">
<div class="dt-responsive table-responsive">
<table id="basic-row-reorder" class="table table-striped table-bordered nowrap">
<thead>
<tr>
<th>Seq.</th>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</thead>
<tbody>
<tr>
<td>2</td>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>2011/04/25</td>
<td>$320,800</td>
</tr>
<tr>
<td>22</td>
<td>Garrett Winters</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>2011/07/25</td>
<td>$170,750</td>
</tr>
<tr>
<td>6</td>
<td>Ashton Cox</td>
<td>Junior Technical Author</td>
<td>San Francisco</td>
<td>2009/01/12</td>
<td>$86,000</td>
</tr>
<tr>
<td>41</td>
<td>Cedric Kelly</td>
<td>Senior Javascript Developer</td>
<td>Edinburgh</td>
<td>2012/03/29</td>
<td>$433,060</td>
</tr>
<tr>
<td>55</td>
<td>Airi Satou</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>2008/11/28</td>
<td>$162,700</td>
</tr>
<tr>
<td>21</td>
<td>Brielle Williamson</td>
<td>Integration Specialist</td>
<td>New York</td>
<td>2012/12/02</td>
<td>$372,000</td>
</tr>
<tr>
<td>46</td>
<td>Herrod Chandler</td>
<td>Sales Assistant</td>
<td>San Francisco</td>
<td>2012/08/06</td>
<td>$137,500</td>
</tr>
<tr>
<td>50</td>
<td>Rhona Davidson</td>
<td>Integration Specialist</td>
<td>Tokyo</td>
<td>2010/10/14</td>
<td>$327,900</td>
</tr>
<tr>
<td>26</td>
<td>Colleen Hurst</td>
<td>Javascript Developer</td>
<td>San Francisco</td>
<td>2009/09/15</td>
<td>$205,500</td>
</tr>
<tr>
<td>18</td>
<td>Sonya Frost</td>
<td>Software Engineer</td>
<td>Edinburgh</td>
<td>2008/12/13</td>
<td>$103,600</td>
</tr>
<tr>
<td>13</td>
<td>Jena Gaines</td>
<td>Office Manager</td>
<td>London</td>
<td>2008/12/19</td>
<td>$90,560</td>
</tr>
<tr>
<td>23</td>
<td>Quinn Flynn</td>
<td>Support Lead</td>
<td>Edinburgh</td>
<td>2013/03/03</td>
<td>$342,000</td>
</tr>
<tr>
<td>14</td>
<td>Charde Marshall</td>
<td>Regional Director</td>
<td>San Francisco</td>
<td>2008/10/16</td>
<td>$470,600</td>
</tr>
<tr>
<td>12</td>
<td>Haley Kennedy</td>
<td>Senior Marketing Designer</td>
<td>London</td>
<td>2012/12/18</td>
<td>$313,500</td>
</tr>
<tr>
<td>54</td>
<td>Tatyana Fitzpatrick</td>
<td>Regional Director</td>
<td>London</td>
<td>2010/03/17</td>
<td>$385,750</td>
</tr>
<tr>
<td>37</td>
<td>Michael Silva</td>
<td>Marketing Designer</td>
<td>London</td>
<td>2012/11/27</td>
<td>$198,500</td>
</tr>
<tr>
<td>32</td>
<td>Paul Byrd</td>
<td>Chief Financial Officer (CFO)</td>
<td>New York</td>
<td>2010/06/09</td>
<td>$725,000</td>
</tr>
<tr>
<td>35</td>
<td>Gloria Little</td>
<td>Systems Administrator</td>
<td>New York</td>
<td>2009/04/10</td>
<td>$237,500</td>
</tr>
<tr>
<td>48</td>
<td>Bradley Greer</td>
<td>Software Engineer</td>
<td>London</td>
<td>2012/10/13</td>
<td>$132,000</td>
</tr>
<tr>
<td>45</td>
<td>Dai Rios</td>
<td>Personnel Lead</td>
<td>Edinburgh</td>
<td>2012/09/26</td>
<td>$217,500</td>
</tr>
<tr>
<td>17</td>
<td>Jenette Caldwell</td>
<td>Development Lead</td>
<td>New York</td>
<td>2011/09/03</td>
<td>$345,000</td>
</tr>
<tr>
<td>57</td>
<td>Yuri Berry</td>
<td>Chief Marketing Officer (CMO)</td>
<td>New York</td>
<td>2009/06/25</td>
<td>$675,000</td>
</tr>
<tr>
<td>29</td>
<td>Caesar Vance</td>
<td>Pre-Sales Support</td>
<td>New York</td>
<td>2011/12/12</td>
<td>$106,450</td>
</tr>
<tr>
<td>56</td>
<td>Doris Wilder</td>
<td>Sales Assistant</td>
<td>Sydney</td>
<td>2010/09/20</td>
<td>$85,600</td>
</tr>
<tr>
<td>36</td>
<td>Angelica Ramos</td>
<td>Chief Executive Officer (CEO)</td>
<td>London</td>
<td>2009/10/09</td>
<td>$1,200,000</td>
</tr>
<tr>
<td>5</td>
<td>Gavin Joyce</td>
<td>Developer</td>
<td>Edinburgh</td>
<td>2010/12/22</td>
<td>$92,575</td>
</tr>
<tr>
<td>51</td>
<td>Jennifer Chang</td>
<td>Regional Director</td>
<td>Singapore</td>
<td>2010/11/14</td>
<td>$357,650</td>
</tr>
<tr>
<td>20</td>
<td>Brenden Wagner</td>
<td>Software Engineer</td>
<td>San Francisco</td>
<td>2011/06/07</td>
<td>$206,850</td>
</tr>
<tr>
<td>7</td>
<td>Fiona Green</td>
<td>Chief Operating Officer (COO)</td>
<td>San Francisco</td>
<td>2010/03/11</td>
<td>$850,000</td>
</tr>
<tr>
<td>1</td>
<td>Shou Itou</td>
<td>Regional Marketing</td>
<td>Tokyo</td>
<td>2011/08/14</td>
<td>$163,000</td>
</tr>
<tr>
<td>39</td>
<td>Michelle House</td>
<td>Integration Specialist</td>
<td>Sydney</td>
<td>2011/06/02</td>
<td>$95,400</td>
</tr>
<tr>
<td>40</td>
<td>Suki Burks</td>
<td>Developer</td>
<td>London</td>
<td>2009/10/22</td>
<td>$114,500</td>
</tr>
<tr>
<td>47</td>
<td>Prescott Bartlett</td>
<td>Technical Author</td>
<td>London</td>
<td>2011/05/07</td>
<td>$145,000</td>
</tr>
<tr>
<td>52</td>
<td>Gavin Cortez</td>
<td>Team Leader</td>
<td>San Francisco</td>
<td>2008/10/26</td>
<td>$235,500</td>
</tr>
<tr>
<td>8</td>
<td>Martena Mccray</td>
<td>Post-Sales support</td>
<td>Edinburgh</td>
<td>2011/03/09</td>
<td>$324,050</td>
</tr>
<tr>
<td>24</td>
<td>Unity Butler</td>
<td>Marketing Designer</td>
<td>San Francisco</td>
<td>2009/12/09</td>
<td>$85,675</td>
</tr>
<tr>
<td>38</td>
<td>Howard Hatfield</td>
<td>Office Manager</td>
<td>San Francisco</td>
<td>2008/12/16</td>
<td>$164,500</td>
</tr>
<tr>
<td>53</td>
<td>Hope Fuentes</td>
<td>Secretary</td>
<td>San Francisco</td>
<td>2010/02/12</td>
<td>$109,850</td>
</tr>
<tr>
<td>30</td>
<td>Vivian Harrell</td>
<td>Financial Controller</td>
<td>San Francisco</td>
<td>2009/02/14</td>
<td>$452,500</td>
</tr>
<tr>
<td>28</td>
<td>Timothy Mooney</td>
<td>Office Manager</td>
<td>London</td>
<td>2008/12/11</td>
<td>$136,200</td>
</tr>
<tr>
<td>34</td>
<td>Jackson Bradshaw</td>
<td>Director</td>
<td>New York</td>
<td>2008/09/26</td>
<td>$645,750</td>
</tr>
<tr>
<td>4</td>
<td>Olivia Liang</td>
<td>Support Engineer</td>
<td>Singapore</td>
<td>2011/02/03</td>
<td>$234,500</td>
</tr>
<tr>
<td>3</td>
<td>Bruno Nash</td>
<td>Software Engineer</td>
<td>London</td>
<td>2011/05/03</td>
<td>$163,500</td>
</tr>
<tr>
<td>31</td>
<td>Sakura Yamamoto</td>
<td>Support Engineer</td>
<td>Tokyo</td>
<td>2009/08/19</td>
<td>$139,575</td>
</tr>
<tr>
<td>11</td>
<td>Thor Walton</td>
<td>Developer</td>
<td>New York</td>
<td>2013/08/11</td>
<td>$98,540</td>
</tr>
<tr>
<td>10</td>
<td>Finn Camacho</td>
<td>Support Engineer</td>
<td>San Francisco</td>
<td>2009/07/07</td>
<td>$87,500</td>
</tr>
<tr>
<td>44</td>
<td>Serge Baldwin</td>
<td>Data Coordinator</td>
<td>Singapore</td>
<td>2012/04/09</td>
<td>$138,575</td>
</tr>
<tr>
<td>42</td>
<td>Zenaida Frank</td>
<td>Software Engineer</td>
<td>New York</td>
<td>2010/01/04</td>
<td>$125,250</td>
</tr>
<tr>
<td>27</td>
<td>Zorita Serrano</td>
<td>Software Engineer</td>
<td>San Francisco</td>
<td>2012/06/01</td>
<td>$115,000</td>
</tr>
<tr>
<td>49</td>
<td>Jennifer Acosta</td>
<td>Junior Javascript Developer</td>
<td>Edinburgh</td>
<td>2013/02/01</td>
<td>$75,650</td>
</tr>
<tr>
<td>15</td>
<td>Cara Stevens</td>
<td>Sales Assistant</td>
<td>New York</td>
<td>2011/12/06</td>
<td>$145,600</td>
</tr>
<tr>
<td>9</td>
<td>Hermione Butler</td>
<td>Regional Director</td>
<td>London</td>
<td>2011/03/21</td>
<td>$356,250</td>
</tr>
<tr>
<td>25</td>
<td>Lael Greer</td>
<td>Systems Administrator</td>
<td>London</td>
<td>2009/02/27</td>
<td>$103,500</td>
</tr>
<tr>
<td>33</td>
<td>Jonas Alexander</td>
<td>Developer</td>
<td>San Francisco</td>
<td>2010/07/14</td>
<td>$86,500</td>
</tr>
<tr>
<td>43</td>
<td>Shad Decker</td>
<td>Regional Director</td>
<td>Edinburgh</td>
<td>2008/11/13</td>
<td>$183,000</td>
</tr>
<tr>
<td>16</td>
<td>Michael Bruce</td>
<td>Javascript Developer</td>
<td>Singapore</td>
<td>2011/06/27</td>
<td>$183,000</td>
</tr>
<tr>
<td>19</td>
<td>Donna Snider</td>
<td>Customer Support</td>
<td>New York</td>
<td>2011/01/25</td>
<td>$112,000</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>Seq.</th>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
</div>
<!-- Basic row reorder table end -->
<!-- Full row selection table start -->
<div class="col-sm-12">
<div class="card">
<div class="card-header">
<h5>Full Row Selection</h5>
</div>
<div class="card-body">
<div class="dt-responsive table-responsive">
<table id="full-row-reorder" class="table table-striped table-bordered nowrap">
<thead>
<tr>
<th>Seq.</th>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</thead>
<tbody>
<tr>
<td>2</td>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>2011/04/25</td>
<td>$320,800</td>
</tr>
<tr>
<td>22</td>
<td>Garrett Winters</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>2011/07/25</td>
<td>$170,750</td>
</tr>
<tr>
<td>6</td>
<td>Ashton Cox</td>
<td>Junior Technical Author</td>
<td>San Francisco</td>
<td>2009/01/12</td>
<td>$86,000</td>
</tr>
<tr>
<td>41</td>
<td>Cedric Kelly</td>
<td>Senior Javascript Developer</td>
<td>Edinburgh</td>
<td>2012/03/29</td>
<td>$433,060</td>
</tr>
<tr>
<td>55</td>
<td>Airi Satou</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>2008/11/28</td>
<td>$162,700</td>
</tr>
<tr>
<td>21</td>
<td>Brielle Williamson</td>
<td>Integration Specialist</td>
<td>New York</td>
<td>2012/12/02</td>
<td>$372,000</td>
</tr>
<tr>
<td>46</td>
<td>Herrod Chandler</td>
<td>Sales Assistant</td>
<td>San Francisco</td>
<td>2012/08/06</td>
<td>$137,500</td>
</tr>
<tr>
<td>50</td>
<td>Rhona Davidson</td>
<td>Integration Specialist</td>
<td>Tokyo</td>
<td>2010/10/14</td>
<td>$327,900</td>
</tr>
<tr>
<td>26</td>
<td>Colleen Hurst</td>
<td>Javascript Developer</td>
<td>San Francisco</td>
<td>2009/09/15</td>
<td>$205,500</td>
</tr>
<tr>
<td>18</td>
<td>Sonya Frost</td>
<td>Software Engineer</td>
<td>Edinburgh</td>
<td>2008/12/13</td>
<td>$103,600</td>
</tr>
<tr>
<td>13</td>
<td>Jena Gaines</td>
<td>Office Manager</td>
<td>London</td>
<td>2008/12/19</td>
<td>$90,560</td>
</tr>
<tr>
<td>23</td>
<td>Quinn Flynn</td>
<td>Support Lead</td>
<td>Edinburgh</td>
<td>2013/03/03</td>
<td>$342,000</td>
</tr>
<tr>
<td>14</td>
<td>Charde Marshall</td>
<td>Regional Director</td>
<td>San Francisco</td>
<td>2008/10/16</td>
<td>$470,600</td>
</tr>
<tr>
<td>12</td>
<td>Haley Kennedy</td>
<td>Senior Marketing Designer</td>
<td>London</td>
<td>2012/12/18</td>
<td>$313,500</td>
</tr>
<tr>
<td>54</td>
<td>Tatyana Fitzpatrick</td>
<td>Regional Director</td>
<td>London</td>
<td>2010/03/17</td>
<td>$385,750</td>
</tr>
<tr>
<td>37</td>
<td>Michael Silva</td>
<td>Marketing Designer</td>
<td>London</td>
<td>2012/11/27</td>
<td>$198,500</td>
</tr>
<tr>
<td>32</td>
<td>Paul Byrd</td>
<td>Chief Financial Officer (CFO)</td>
<td>New York</td>
<td>2010/06/09</td>
<td>$725,000</td>
</tr>
<tr>
<td>35</td>
<td>Gloria Little</td>
<td>Systems Administrator</td>
<td>New York</td>
<td>2009/04/10</td>
<td>$237,500</td>
</tr>
<tr>
<td>48</td>
<td>Bradley Greer</td>
<td>Software Engineer</td>
<td>London</td>
<td>2012/10/13</td>
<td>$132,000</td>
</tr>
<tr>
<td>45</td>
<td>Dai Rios</td>
<td>Personnel Lead</td>
<td>Edinburgh</td>
<td>2012/09/26</td>
<td>$217,500</td>
</tr>
<tr>
<td>17</td>
<td>Jenette Caldwell</td>
<td>Development Lead</td>
<td>New York</td>
<td>2011/09/03</td>
<td>$345,000</td>
</tr>
<tr>
<td>57</td>
<td>Yuri Berry</td>
<td>Chief Marketing Officer (CMO)</td>
<td>New York</td>
<td>2009/06/25</td>
<td>$675,000</td>
</tr>
<tr>
<td>29</td>
<td>Caesar Vance</td>
<td>Pre-Sales Support</td>
<td>New York</td>
<td>2011/12/12</td>
<td>$106,450</td>
</tr>
<tr>
<td>56</td>
<td>Doris Wilder</td>
<td>Sales Assistant</td>
<td>Sydney</td>
<td>2010/09/20</td>
<td>$85,600</td>
</tr>
<tr>
<td>36</td>
<td>Angelica Ramos</td>
<td>Chief Executive Officer (CEO)</td>
<td>London</td>
<td>2009/10/09</td>
<td>$1,200,000</td>
</tr>
<tr>
<td>5</td>
<td>Gavin Joyce</td>
<td>Developer</td>
<td>Edinburgh</td>
<td>2010/12/22</td>
<td>$92,575</td>
</tr>
<tr>
<td>51</td>
<td>Jennifer Chang</td>
<td>Regional Director</td>
<td>Singapore</td>
<td>2010/11/14</td>
<td>$357,650</td>
</tr>
<tr>
<td>20</td>
<td>Brenden Wagner</td>
<td>Software Engineer</td>
<td>San Francisco</td>
<td>2011/06/07</td>
<td>$206,850</td>
</tr>
<tr>
<td>7</td>
<td>Fiona Green</td>
<td>Chief Operating Officer (COO)</td>
<td>San Francisco</td>
<td>2010/03/11</td>
<td>$850,000</td>
</tr>
<tr>
<td>1</td>
<td>Shou Itou</td>
<td>Regional Marketing</td>
<td>Tokyo</td>
<td>2011/08/14</td>
<td>$163,000</td>
</tr>
<tr>
<td>39</td>
<td>Michelle House</td>
<td>Integration Specialist</td>
<td>Sydney</td>
<td>2011/06/02</td>
<td>$95,400</td>
</tr>
<tr>
<td>40</td>
<td>Suki Burks</td>
<td>Developer</td>
<td>London</td>
<td>2009/10/22</td>
<td>$114,500</td>
</tr>
<tr>
<td>47</td>
<td>Prescott Bartlett</td>
<td>Technical Author</td>
<td>London</td>
<td>2011/05/07</td>
<td>$145,000</td>
</tr>
<tr>
<td>52</td>
<td>Gavin Cortez</td>
<td>Team Leader</td>
<td>San Francisco</td>
<td>2008/10/26</td>
<td>$235,500</td>
</tr>
<tr>
<td>8</td>
<td>Martena Mccray</td>
<td>Post-Sales support</td>
<td>Edinburgh</td>
<td>2011/03/09</td>
<td>$324,050</td>
</tr>
<tr>
<td>24</td>
<td>Unity Butler</td>
<td>Marketing Designer</td>
<td>San Francisco</td>
<td>2009/12/09</td>
<td>$85,675</td>
</tr>
<tr>
<td>38</td>
<td>Howard Hatfield</td>
<td>Office Manager</td>
<td>San Francisco</td>
<td>2008/12/16</td>
<td>$164,500</td>
</tr>
<tr>
<td>53</td>
<td>Hope Fuentes</td>
<td>Secretary</td>
<td>San Francisco</td>
<td>2010/02/12</td>
<td>$109,850</td>
</tr>
<tr>
<td>30</td>
<td>Vivian Harrell</td>
<td>Financial Controller</td>
<td>San Francisco</td>
<td>2009/02/14</td>
<td>$452,500</td>
</tr>
<tr>
<td>28</td>
<td>Timothy Mooney</td>
<td>Office Manager</td>
<td>London</td>
<td>2008/12/11</td>
<td>$136,200</td>
</tr>
<tr>
<td>34</td>
<td>Jackson Bradshaw</td>
<td>Director</td>
<td>New York</td>
<td>2008/09/26</td>
<td>$645,750</td>
</tr>
<tr>
<td>4</td>
<td>Olivia Liang</td>
<td>Support Engineer</td>
<td>Singapore</td>
<td>2011/02/03</td>
<td>$234,500</td>
</tr>
<tr>
<td>3</td>
<td>Bruno Nash</td>
<td>Software Engineer</td>
<td>London</td>
<td>2011/05/03</td>
<td>$163,500</td>
</tr>
<tr>
<td>31</td>
<td>Sakura Yamamoto</td>
<td>Support Engineer</td>
<td>Tokyo</td>
<td>2009/08/19</td>
<td>$139,575</td>
</tr>
<tr>
<td>11</td>
<td>Thor Walton</td>
<td>Developer</td>
<td>New York</td>
<td>2013/08/11</td>
<td>$98,540</td>
</tr>
<tr>
<td>10</td>
<td>Finn Camacho</td>
<td>Support Engineer</td>
<td>San Francisco</td>
<td>2009/07/07</td>
<td>$87,500</td>
</tr>
<tr>
<td>44</td>
<td>Serge Baldwin</td>
<td>Data Coordinator</td>
<td>Singapore</td>
<td>2012/04/09</td>
<td>$138,575</td>
</tr>
<tr>
<td>42</td>
<td>Zenaida Frank</td>
<td>Software Engineer</td>
<td>New York</td>
<td>2010/01/04</td>
<td>$125,250</td>
</tr>
<tr>
<td>27</td>
<td>Zorita Serrano</td>
<td>Software Engineer</td>
<td>San Francisco</td>
<td>2012/06/01</td>
<td>$115,000</td>
</tr>
<tr>
<td>49</td>
<td>Jennifer Acosta</td>
<td>Junior Javascript Developer</td>
<td>Edinburgh</td>
<td>2013/02/01</td>
<td>$75,650</td>
</tr>
<tr>
<td>15</td>
<td>Cara Stevens</td>
<td>Sales Assistant</td>
<td>New York</td>
<td>2011/12/06</td>
<td>$145,600</td>
</tr>
<tr>
<td>9</td>
<td>Hermione Butler</td>
<td>Regional Director</td>
<td>London</td>
<td>2011/03/21</td>
<td>$356,250</td>
</tr>
<tr>
<td>25</td>
<td>Lael Greer</td>
<td>Systems Administrator</td>
<td>London</td>
<td>2009/02/27</td>
<td>$103,500</td>
</tr>
<tr>
<td>33</td>
<td>Jonas Alexander</td>
<td>Developer</td>
<td>San Francisco</td>
<td>2010/07/14</td>
<td>$86,500</td>
</tr>
<tr>
<td>43</td>
<td>Shad Decker</td>
<td>Regional Director</td>
<td>Edinburgh</td>
<td>2008/11/13</td>
<td>$183,000</td>
</tr>
<tr>
<td>16</td>
<td>Michael Bruce</td>
<td>Javascript Developer</td>
<td>Singapore</td>
<td>2011/06/27</td>
<td>$183,000</td>
</tr>
<tr>
<td>19</td>
<td>Donna Snider</td>
<td>Customer Support</td>
<td>New York</td>
<td>2011/01/25</td>
<td>$112,000</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>Seq.</th>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
</div>
<!-- Full row selection table end -->
<!-- Responsive integration table start -->
<div class="col-sm-12">
<div class="card">
<div class="card-header">
<h5>Responsive Integration</h5>
</div>
<div class="card-body">
<div class="dt-responsive table-responsive">
<table id="responsive-reorder" class="table table-striped table-bordered nowrap">
<thead>
<tr>
<th>Seq.</th>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</thead>
<tbody>
<tr>
<td>2</td>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>2011/04/25</td>
<td>$320,800</td>
</tr>
<tr>
<td>22</td>
<td>Garrett Winters</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>2011/07/25</td>
<td>$170,750</td>
</tr>
<tr>
<td>6</td>
<td>Ashton Cox</td>
<td>Junior Technical Author</td>
<td>San Francisco</td>
<td>2009/01/12</td>
<td>$86,000</td>
</tr>
<tr>
<td>41</td>
<td>Cedric Kelly</td>
<td>Senior Javascript Developer</td>
<td>Edinburgh</td>
<td>2012/03/29</td>
<td>$433,060</td>
</tr>
<tr>
<td>55</td>
<td>Airi Satou</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>2008/11/28</td>
<td>$162,700</td>
</tr>
<tr>
<td>21</td>
<td>Brielle Williamson</td>
<td>Integration Specialist</td>
<td>New York</td>
<td>2012/12/02</td>
<td>$372,000</td>
</tr>
<tr>
<td>46</td>
<td>Herrod Chandler</td>
<td>Sales Assistant</td>
<td>San Francisco</td>
<td>2012/08/06</td>
<td>$137,500</td>
</tr>
<tr>
<td>50</td>
<td>Rhona Davidson</td>
<td>Integration Specialist</td>
<td>Tokyo</td>
<td>2010/10/14</td>
<td>$327,900</td>
</tr>
<tr>
<td>26</td>
<td>Colleen Hurst</td>
<td>Javascript Developer</td>
<td>San Francisco</td>
<td>2009/09/15</td>
<td>$205,500</td>
</tr>
<tr>
<td>18</td>
<td>Sonya Frost</td>
<td>Software Engineer</td>
<td>Edinburgh</td>
<td>2008/12/13</td>
<td>$103,600</td>
</tr>
<tr>
<td>13</td>
<td>Jena Gaines</td>
<td>Office Manager</td>
<td>London</td>
<td>2008/12/19</td>
<td>$90,560</td>
</tr>
<tr>
<td>23</td>
<td>Quinn Flynn</td>
<td>Support Lead</td>
<td>Edinburgh</td>
<td>2013/03/03</td>
<td>$342,000</td>
</tr>
<tr>
<td>14</td>
<td>Charde Marshall</td>
<td>Regional Director</td>
<td>San Francisco</td>
<td>2008/10/16</td>
<td>$470,600</td>
</tr>
<tr>
<td>12</td>
<td>Haley Kennedy</td>
<td>Senior Marketing Designer</td>
<td>London</td>
<td>2012/12/18</td>
<td>$313,500</td>
</tr>
<tr>
<td>54</td>
<td>Tatyana Fitzpatrick</td>
<td>Regional Director</td>
<td>London</td>
<td>2010/03/17</td>
<td>$385,750</td>
</tr>
<tr>
<td>37</td>
<td>Michael Silva</td>
<td>Marketing Designer</td>
<td>London</td>
<td>2012/11/27</td>
<td>$198,500</td>
</tr>
<tr>
<td>32</td>
<td>Paul Byrd</td>
<td>Chief Financial Officer (CFO)</td>
<td>New York</td>
<td>2010/06/09</td>
<td>$725,000</td>
</tr>
<tr>
<td>35</td>
<td>Gloria Little</td>
<td>Systems Administrator</td>
<td>New York</td>
<td>2009/04/10</td>
<td>$237,500</td>
</tr>
<tr>
<td>48</td>
<td>Bradley Greer</td>
<td>Software Engineer</td>
<td>London</td>
<td>2012/10/13</td>
<td>$132,000</td>
</tr>
<tr>
<td>45</td>
<td>Dai Rios</td>
<td>Personnel Lead</td>
<td>Edinburgh</td>
<td>2012/09/26</td>
<td>$217,500</td>
</tr>
<tr>
<td>17</td>
<td>Jenette Caldwell</td>
<td>Development Lead</td>
<td>New York</td>
<td>2011/09/03</td>
<td>$345,000</td>
</tr>
<tr>
<td>57</td>
<td>Yuri Berry</td>
<td>Chief Marketing Officer (CMO)</td>
<td>New York</td>
<td>2009/06/25</td>
<td>$675,000</td>
</tr>
<tr>
<td>29</td>
<td>Caesar Vance</td>
<td>Pre-Sales Support</td>
<td>New York</td>
<td>2011/12/12</td>
<td>$106,450</td>
</tr>
<tr>
<td>56</td>
<td>Doris Wilder</td>
<td>Sales Assistant</td>
<td>Sydney</td>
<td>2010/09/20</td>
<td>$85,600</td>
</tr>
<tr>
<td>36</td>
<td>Angelica Ramos</td>
<td>Chief Executive Officer (CEO)</td>
<td>London</td>
<td>2009/10/09</td>
<td>$1,200,000</td>
</tr>
<tr>
<td>5</td>
<td>Gavin Joyce</td>
<td>Developer</td>
<td>Edinburgh</td>
<td>2010/12/22</td>
<td>$92,575</td>
</tr>
<tr>
<td>51</td>
<td>Jennifer Chang</td>
<td>Regional Director</td>
<td>Singapore</td>
<td>2010/11/14</td>
<td>$357,650</td>
</tr>
<tr>
<td>20</td>
<td>Brenden Wagner</td>
<td>Software Engineer</td>
<td>San Francisco</td>
<td>2011/06/07</td>
<td>$206,850</td>
</tr>
<tr>
<td>7</td>
<td>Fiona Green</td>
<td>Chief Operating Officer (COO)</td>
<td>San Francisco</td>
<td>2010/03/11</td>
<td>$850,000</td>
</tr>
<tr>
<td>1</td>
<td>Shou Itou</td>
<td>Regional Marketing</td>
<td>Tokyo</td>
<td>2011/08/14</td>
<td>$163,000</td>
</tr>
<tr>
<td>39</td>
<td>Michelle House</td>
<td>Integration Specialist</td>
<td>Sydney</td>
<td>2011/06/02</td>
<td>$95,400</td>
</tr>
<tr>
<td>40</td>
<td>Suki Burks</td>
<td>Developer</td>
<td>London</td>
<td>2009/10/22</td>
<td>$114,500</td>
</tr>
<tr>
<td>47</td>
<td>Prescott Bartlett</td>
<td>Technical Author</td>
<td>London</td>
<td>2011/05/07</td>
<td>$145,000</td>
</tr>
<tr>
<td>52</td>
<td>Gavin Cortez</td>
<td>Team Leader</td>
<td>San Francisco</td>
<td>2008/10/26</td>
<td>$235,500</td>
</tr>
<tr>
<td>8</td>
<td>Martena Mccray</td>
<td>Post-Sales support</td>
<td>Edinburgh</td>
<td>2011/03/09</td>
<td>$324,050</td>
</tr>
<tr>
<td>24</td>
<td>Unity Butler</td>
<td>Marketing Designer</td>
<td>San Francisco</td>
<td>2009/12/09</td>
<td>$85,675</td>
</tr>
<tr>
<td>38</td>
<td>Howard Hatfield</td>
<td>Office Manager</td>
<td>San Francisco</td>
<td>2008/12/16</td>
<td>$164,500</td>
</tr>
<tr>
<td>53</td>
<td>Hope Fuentes</td>
<td>Secretary</td>
<td>San Francisco</td>
<td>2010/02/12</td>
<td>$109,850</td>
</tr>
<tr>
<td>30</td>
<td>Vivian Harrell</td>
<td>Financial Controller</td>
<td>San Francisco</td>
<td>2009/02/14</td>
<td>$452,500</td>
</tr>
<tr>
<td>28</td>
<td>Timothy Mooney</td>
<td>Office Manager</td>
<td>London</td>
<td>2008/12/11</td>
<td>$136,200</td>
</tr>
<tr>
<td>34</td>
<td>Jackson Bradshaw</td>
<td>Director</td>
<td>New York</td>
<td>2008/09/26</td>
<td>$645,750</td>
</tr>
<tr>
<td>4</td>
<td>Olivia Liang</td>
<td>Support Engineer</td>
<td>Singapore</td>
<td>2011/02/03</td>
<td>$234,500</td>
</tr>
<tr>
<td>3</td>
<td>Bruno Nash</td>
<td>Software Engineer</td>
<td>London</td>
<td>2011/05/03</td>
<td>$163,500</td>
</tr>
<tr>
<td>31</td>
<td>Sakura Yamamoto</td>
<td>Support Engineer</td>
<td>Tokyo</td>
<td>2009/08/19</td>
<td>$139,575</td>
</tr>
<tr>
<td>11</td>
<td>Thor Walton</td>
<td>Developer</td>
<td>New York</td>
<td>2013/08/11</td>
<td>$98,540</td>
</tr>
<tr>
<td>10</td>
<td>Finn Camacho</td>
<td>Support Engineer</td>
<td>San Francisco</td>
<td>2009/07/07</td>
<td>$87,500</td>
</tr>
<tr>
<td>44</td>
<td>Serge Baldwin</td>
<td>Data Coordinator</td>
<td>Singapore</td>
<td>2012/04/09</td>
<td>$138,575</td>
</tr>
<tr>
<td>42</td>
<td>Zenaida Frank</td>
<td>Software Engineer</td>
<td>New York</td>
<td>2010/01/04</td>
<td>$125,250</td>
</tr>
<tr>
<td>27</td>
<td>Zorita Serrano</td>
<td>Software Engineer</td>
<td>San Francisco</td>
<td>2012/06/01</td>
<td>$115,000</td>
</tr>
<tr>
<td>49</td>
<td>Jennifer Acosta</td>
<td>Junior Javascript Developer</td>
<td>Edinburgh</td>
<td>2013/02/01</td>
<td>$75,650</td>
</tr>
<tr>
<td>15</td>
<td>Cara Stevens</td>
<td>Sales Assistant</td>
<td>New York</td>
<td>2011/12/06</td>
<td>$145,600</td>
</tr>
<tr>
<td>9</td>
<td>Hermione Butler</td>
<td>Regional Director</td>
<td>London</td>
<td>2011/03/21</td>
<td>$356,250</td>
</tr>
<tr>
<td>25</td>
<td>Lael Greer</td>
<td>Systems Administrator</td>
<td>London</td>
<td>2009/02/27</td>
<td>$103,500</td>
</tr>
<tr>
<td>33</td>
<td>Jonas Alexander</td>
<td>Developer</td>
<td>San Francisco</td>
<td>2010/07/14</td>
<td>$86,500</td>
</tr>
<tr>
<td>43</td>
<td>Shad Decker</td>
<td>Regional Director</td>
<td>Edinburgh</td>
<td>2008/11/13</td>
<td>$183,000</td>
</tr>
<tr>
<td>16</td>
<td>Michael Bruce</td>
<td>Javascript Developer</td>
<td>Singapore</td>
<td>2011/06/27</td>
<td>$183,000</td>
</tr>
<tr>
<td>19</td>
<td>Donna Snider</td>
<td>Customer Support</td>
<td>New York</td>
<td>2011/01/25</td>
<td>$112,000</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>Seq.</th>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
</div>
<!-- Responsive integration table end -->
<!-- Reorder events table start -->
<div class="col-sm-12">
<div class="card">
<div class="card-header">
<h5>Reorder Events</h5>
</div>
<div class="card-body">
<div class="dt-responsive table-responsive">
<table id="reorder-events" class="table table-striped table-bordered nowrap">
<thead>
<tr>
<th>Seq.</th>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</thead>
<tbody>
<tr>
<td>2</td>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>2011/04/25</td>
<td>$320,800</td>
</tr>
<tr>
<td>22</td>
<td>Garrett Winters</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>2011/07/25</td>
<td>$170,750</td>
</tr>
<tr>
<td>6</td>
<td>Ashton Cox</td>
<td>Junior Technical Author</td>
<td>San Francisco</td>
<td>2009/01/12</td>
<td>$86,000</td>
</tr>
<tr>
<td>41</td>
<td>Cedric Kelly</td>
<td>Senior Javascript Developer</td>
<td>Edinburgh</td>
<td>2012/03/29</td>
<td>$433,060</td>
</tr>
<tr>
<td>55</td>
<td>Airi Satou</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>2008/11/28</td>
<td>$162,700</td>
</tr>
<tr>
<td>21</td>
<td>Brielle Williamson</td>
<td>Integration Specialist</td>
<td>New York</td>
<td>2012/12/02</td>
<td>$372,000</td>
</tr>
<tr>
<td>46</td>
<td>Herrod Chandler</td>
<td>Sales Assistant</td>
<td>San Francisco</td>
<td>2012/08/06</td>
<td>$137,500</td>
</tr>
<tr>
<td>50</td>
<td>Rhona Davidson</td>
<td>Integration Specialist</td>
<td>Tokyo</td>
<td>2010/10/14</td>
<td>$327,900</td>
</tr>
<tr>
<td>26</td>
<td>Colleen Hurst</td>
<td>Javascript Developer</td>
<td>San Francisco</td>
<td>2009/09/15</td>
<td>$205,500</td>
</tr>
<tr>
<td>18</td>
<td>Sonya Frost</td>
<td>Software Engineer</td>
<td>Edinburgh</td>
<td>2008/12/13</td>
<td>$103,600</td>
</tr>
<tr>
<td>13</td>
<td>Jena Gaines</td>
<td>Office Manager</td>
<td>London</td>
<td>2008/12/19</td>
<td>$90,560</td>
</tr>
<tr>
<td>23</td>
<td>Quinn Flynn</td>
<td>Support Lead</td>
<td>Edinburgh</td>
<td>2013/03/03</td>
<td>$342,000</td>
</tr>
<tr>
<td>14</td>
<td>Charde Marshall</td>
<td>Regional Director</td>
<td>San Francisco</td>
<td>2008/10/16</td>
<td>$470,600</td>
</tr>
<tr>
<td>12</td>
<td>Haley Kennedy</td>
<td>Senior Marketing Designer</td>
<td>London</td>
<td>2012/12/18</td>
<td>$313,500</td>
</tr>
<tr>
<td>54</td>
<td>Tatyana Fitzpatrick</td>
<td>Regional Director</td>
<td>London</td>
<td>2010/03/17</td>
<td>$385,750</td>
</tr>
<tr>
<td>37</td>
<td>Michael Silva</td>
<td>Marketing Designer</td>
<td>London</td>
<td>2012/11/27</td>
<td>$198,500</td>
</tr>
<tr>
<td>32</td>
<td>Paul Byrd</td>
<td>Chief Financial Officer (CFO)</td>
<td>New York</td>
<td>2010/06/09</td>
<td>$725,000</td>
</tr>
<tr>
<td>35</td>
<td>Gloria Little</td>
<td>Systems Administrator</td>
<td>New York</td>
<td>2009/04/10</td>
<td>$237,500</td>
</tr>
<tr>
<td>48</td>
<td>Bradley Greer</td>
<td>Software Engineer</td>
<td>London</td>
<td>2012/10/13</td>
<td>$132,000</td>
</tr>
<tr>
<td>45</td>
<td>Dai Rios</td>
<td>Personnel Lead</td>
<td>Edinburgh</td>
<td>2012/09/26</td>
<td>$217,500</td>
</tr>
<tr>
<td>17</td>
<td>Jenette Caldwell</td>
<td>Development Lead</td>
<td>New York</td>
<td>2011/09/03</td>
<td>$345,000</td>
</tr>
<tr>
<td>57</td>
<td>Yuri Berry</td>
<td>Chief Marketing Officer (CMO)</td>
<td>New York</td>
<td>2009/06/25</td>
<td>$675,000</td>
</tr>
<tr>
<td>29</td>
<td>Caesar Vance</td>
<td>Pre-Sales Support</td>
<td>New York</td>
<td>2011/12/12</td>
<td>$106,450</td>
</tr>
<tr>
<td>56</td>
<td>Doris Wilder</td>
<td>Sales Assistant</td>
<td>Sydney</td>
<td>2010/09/20</td>
<td>$85,600</td>
</tr>
<tr>
<td>36</td>
<td>Angelica Ramos</td>
<td>Chief Executive Officer (CEO)</td>
<td>London</td>
<td>2009/10/09</td>
<td>$1,200,000</td>
</tr>
<tr>
<td>5</td>
<td>Gavin Joyce</td>
<td>Developer</td>
<td>Edinburgh</td>
<td>2010/12/22</td>
<td>$92,575</td>
</tr>
<tr>
<td>51</td>
<td>Jennifer Chang</td>
<td>Regional Director</td>
<td>Singapore</td>
<td>2010/11/14</td>
<td>$357,650</td>
</tr>
<tr>
<td>20</td>
<td>Brenden Wagner</td>
<td>Software Engineer</td>
<td>San Francisco</td>
<td>2011/06/07</td>
<td>$206,850</td>
</tr>
<tr>
<td>7</td>
<td>Fiona Green</td>
<td>Chief Operating Officer (COO)</td>
<td>San Francisco</td>
<td>2010/03/11</td>
<td>$850,000</td>
</tr>
<tr>
<td>1</td>
<td>Shou Itou</td>
<td>Regional Marketing</td>
<td>Tokyo</td>
<td>2011/08/14</td>
<td>$163,000</td>
</tr>
<tr>
<td>39</td>
<td>Michelle House</td>
<td>Integration Specialist</td>
<td>Sydney</td>
<td>2011/06/02</td>
<td>$95,400</td>
</tr>
<tr>
<td>40</td>
<td>Suki Burks</td>
<td>Developer</td>
<td>London</td>
<td>2009/10/22</td>
<td>$114,500</td>
</tr>
<tr>
<td>47</td>
<td>Prescott Bartlett</td>
<td>Technical Author</td>
<td>London</td>
<td>2011/05/07</td>
<td>$145,000</td>
</tr>
<tr>
<td>52</td>
<td>Gavin Cortez</td>
<td>Team Leader</td>
<td>San Francisco</td>
<td>2008/10/26</td>
<td>$235,500</td>
</tr>
<tr>
<td>8</td>
<td>Martena Mccray</td>
<td>Post-Sales support</td>
<td>Edinburgh</td>
<td>2011/03/09</td>
<td>$324,050</td>
</tr>
<tr>
<td>24</td>
<td>Unity Butler</td>
<td>Marketing Designer</td>
<td>San Francisco</td>
<td>2009/12/09</td>
<td>$85,675</td>
</tr>
<tr>
<td>38</td>
<td>Howard Hatfield</td>
<td>Office Manager</td>
<td>San Francisco</td>
<td>2008/12/16</td>
<td>$164,500</td>
</tr>
<tr>
<td>53</td>
<td>Hope Fuentes</td>
<td>Secretary</td>
<td>San Francisco</td>
<td>2010/02/12</td>
<td>$109,850</td>
</tr>
<tr>
<td>30</td>
<td>Vivian Harrell</td>
<td>Financial Controller</td>
<td>San Francisco</td>
<td>2009/02/14</td>
<td>$452,500</td>
</tr>
<tr>
<td>28</td>
<td>Timothy Mooney</td>
<td>Office Manager</td>
<td>London</td>
<td>2008/12/11</td>
<td>$136,200</td>
</tr>
<tr>
<td>34</td>
<td>Jackson Bradshaw</td>
<td>Director</td>
<td>New York</td>
<td>2008/09/26</td>
<td>$645,750</td>
</tr>
<tr>
<td>4</td>
<td>Olivia Liang</td>
<td>Support Engineer</td>
<td>Singapore</td>
<td>2011/02/03</td>
<td>$234,500</td>
</tr>
<tr>
<td>3</td>
<td>Bruno Nash</td>
<td>Software Engineer</td>
<td>London</td>
<td>2011/05/03</td>
<td>$163,500</td>
</tr>
<tr>
<td>31</td>
<td>Sakura Yamamoto</td>
<td>Support Engineer</td>
<td>Tokyo</td>
<td>2009/08/19</td>
<td>$139,575</td>
</tr>
<tr>
<td>11</td>
<td>Thor Walton</td>
<td>Developer</td>
<td>New York</td>
<td>2013/08/11</td>
<td>$98,540</td>
</tr>
<tr>
<td>10</td>
<td>Finn Camacho</td>
<td>Support Engineer</td>
<td>San Francisco</td>
<td>2009/07/07</td>
<td>$87,500</td>
</tr>
<tr>
<td>44</td>
<td>Serge Baldwin</td>
<td>Data Coordinator</td>
<td>Singapore</td>
<td>2012/04/09</td>
<td>$138,575</td>
</tr>
<tr>
<td>42</td>
<td>Zenaida Frank</td>
<td>Software Engineer</td>
<td>New York</td>
<td>2010/01/04</td>
<td>$125,250</td>
</tr>
<tr>
<td>27</td>
<td>Zorita Serrano</td>
<td>Software Engineer</td>
<td>San Francisco</td>
<td>2012/06/01</td>
<td>$115,000</td>
</tr>
<tr>
<td>49</td>
<td>Jennifer Acosta</td>
<td>Junior Javascript Developer</td>
<td>Edinburgh</td>
<td>2013/02/01</td>
<td>$75,650</td>
</tr>
<tr>
<td>15</td>
<td>Cara Stevens</td>
<td>Sales Assistant</td>
<td>New York</td>
<td>2011/12/06</td>
<td>$145,600</td>
</tr>
<tr>
<td>9</td>
<td>Hermione Butler</td>
<td>Regional Director</td>
<td>London</td>
<td>2011/03/21</td>
<td>$356,250</td>
</tr>
<tr>
<td>25</td>
<td>Lael Greer</td>
<td>Systems Administrator</td>
<td>London</td>
<td>2009/02/27</td>
<td>$103,500</td>
</tr>
<tr>
<td>33</td>
<td>Jonas Alexander</td>
<td>Developer</td>
<td>San Francisco</td>
<td>2010/07/14</td>
<td>$86,500</td>
</tr>
<tr>
<td>43</td>
<td>Shad Decker</td>
<td>Regional Director</td>
<td>Edinburgh</td>
<td>2008/11/13</td>
<td>$183,000</td>
</tr>
<tr>
<td>16</td>
<td>Michael Bruce</td>
<td>Javascript Developer</td>
<td>Singapore</td>
<td>2011/06/27</td>
<td>$183,000</td>
</tr>
<tr>
<td>19</td>
<td>Donna Snider</td>
<td>Customer Support</td>
<td>New York</td>
<td>2011/01/25</td>
<td>$112,000</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>Seq.</th>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
</div>
<!-- Reorder events table end -->
</div>
<!-- [ Main Content ] end -->
</div>
</section>
<!-- [ Main Content ] end -->
<!-- Warning Section start -->
<!-- Older IE warning message -->
<!--[if lt IE 11]>
<div class="ie-warning">
<h1>Warning!!</h1>
<p>You are using an outdated version of Internet Explorer, please upgrade
<br />to any of the following web browsers to access this website.
</p>
<div class="iew-container">
<ul class="iew-download">
<li>
<a href="http://www.google.com/chrome/">
<img src="assets/images/browser/chrome.png" alt="Chrome" />
<div>Chrome</div>
</a>
</li>
<li>
<a href="https://www.mozilla.org/en-US/firefox/new/">
<img src="assets/images/browser/firefox.png" alt="Firefox" />
<div>Firefox</div>
</a>
</li>
<li>
<a href="http://www.opera.com">
<img src="assets/images/browser/opera.png" alt="Opera" />
<div>Opera</div>
</a>
</li>
<li>
<a href="https://www.apple.com/safari/">
<img src="assets/images/browser/safari.png" alt="Safari" />
<div>Safari</div>
</a>
</li>
<li>
<a href="http://windows.microsoft.com/en-us/internet-explorer/download-ie">
<img src="assets/images/browser/ie.png" alt="" />
<div>IE (11 & above)</div>
</a>
</li>
</ul>
</div>
<p>Sorry for the inconvenience!</p>
</div>
<![endif]-->
<!-- Warning Section Ends -->
<!-- Required Js -->
<script src="assets/js/vendor-all.min.js"></script>
<script src="assets/js/plugins/bootstrap.min.js"></script>
<script src="assets/js/ripple.js"></script>
<script src="assets/js/pcoded.min.js"></script>
<script src="assets/js/menu-setting.min.js"></script>
<!-- datatable Js -->
<script src="assets/js/plugins/jquery.dataTables.min.js"></script>
<script src="assets/js/plugins/dataTables.bootstrap4.min.js"></script>
<script src="https://cdn.datatables.net/rowreorder/1.2.6/js/dataTables.rowReorder.min.js"></script>
<script src="assets/js/pages/data-row-custom.js"></script>
In react this theme not working properly. We are installed required js files using npm. we got this error
”
./src/assets/scss/style.scss (./node_modules/css-loader/dist/cjs.js??ref-6-oneOf-5-1-6-oneOf-5-3./node_modules/resolve-url-loader??ref
./src/assets/scss/style.scss)
@import “~bootstrap/scss/functions”;
^
File to import not found or unreadable: ~bootstrap/scss/functions.
in C:\React\React\Template\full-version\src\assets\scss\style.scss (line 32, column 1)
“
So give me proper steps to run this project in vs code. I am gone through document also.Link : https://phoenixcoded-2.gitbook.io/able-pro-react-documentation/ bit nothing happened by following the steps.
we will check it from our technical team and get back to you
Thank you very much, approx how many hours you take?
npm install bootstrap --save
I did that, after that i am getting below error on npm start.
+ bootstrap@4.4.1 added 1 package from 2 contributors and audited 904823 packages in 17.8s Failed to compile.
./src/assets/scss/style.scss (./node_modules/css-loader/dist/cjs.js??ref-6-oneOf-5-1-6-oneOf-5-3./node_modules/resolve-url-loader??ref
./src/assets/scss/style.scss)
To import Sass files, you first need to install node-sass.
Run `npm install node-sass` or `yarn add node-sass` inside your workspace.
Require stack:
- D:\rohan\React\Template\full-version\node_modules\sass-loader\lib\loader.js
- D:\rohan\React\Template\full-version\node_modules\loader-runner\lib\loadLoader.js
- D:\rohan\React\Template\full-version\node_modules\loader-runner\lib\LoaderRunner.js
- D:\rohan\React\Template\full-version\node_modules\webpack\lib\NormalModule.js
- D:\rohan\React\Template\full-version\node_modules\webpack\lib\NormalModuleFactory.js
- D:\rohan\React\Template\full-version\node_modules\webpack\lib\Compiler.js
- D:\rohan\React\Template\full-version\node_modules\webpack\lib\webpack.js
- D:\rohan\React\Template\full-version\node_modules\react-scripts\scripts\start.js
From above error i have run npm install node-sass and after i am getting below error
Failed to compile.
./src/assets/scss/style.scss (./node_modules/css-loader/dist/cjs.js??ref-6-oneOf-5-1-6-oneOf-5-3./node_modules/resolve-url-loader??ref
./src/assets/scss/style.scss)
@import “~sweetalert2/dist/sweetalert2”;
^
File to import not found or unreadable: ~sweetalert2/dist/sweetalert2.
When i have tried to run npm install
npm WARN deprecated react-dom@16.4.1: This version of react-dom/server contains a minor vulnerability. Please update react-dom to 16.4.2+. Learn more: https://fb.me/cve-2018-6341
npm WARN deprecated core-js@2.6.10: core-js@<3.0 is no longer maintained and not recommended for usage due to the number of issues. Please, upgrade your dependencies to the actual version of core-js@3.
npm WARN deprecated core-js@1.2.7: core-js@<3.0 is no longer maintained and not recommended for usage due to the number of issues. Please, upgrade your dependencies to the actual version of core-js@3.
npm ERR! code ENOENT
npm ERR! syscall spawn git
npm ERR! path git
npm ERR! errno -4058
npm ERR! enoent Error while executing:
npm ERR! enoent undefined ls-remote -h -t https://github.com/rcdexta/smooth-dnd.git
npm ERR! enoent
npm ERR! enoent
npm ERR! enoent spawn git ENOENT
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent
Can you please send us the package.json file to our email – phoenixcoded@gmail.com
We have purchased able pro 8 themes for react and implemented in asp.net Core web app + react template in visual studio 2019
After we have replaced app.js to able pro theme’s app/index so admin layout display and kept api-authorization folder as it comes in asp.net core template now for redirecting to the authentication page like login we have put autorizationroute attribute to admin layout route though we have issue of redirecting to login page which is working without theme. Can you please help in this case
Sir, for quick to know – we’re unfamiliar with ASP technology. So not able to give you the exact process on your issue. If you have any other issues related to template itself, then let us know.
Have purchased but concerned about the support. Raised support ticket 2229271 on ticksy . No reply. Please assist. Thanks
can you please share your concern here?
The issue is that for the react version npm install or even yarn install does not work – installing in local. However npm and node is installed properly and was able to run a basic hello world app. However it is difficult to share details in comments. I believe you have a ticksy support where i have shared with proper log file, screenshot. I suggest you please provide a support email or ticksy etc. based support as that is more appropriate
please share us on phoenixcoded@gmail.com
Ok,have just emailed you. thanks
hello, I just purchased the theme but unable to find v7.3
Hi, We launch the complete new version called v8.0. If you still need the older version. Please drop your email address. I’ll send you the direct download link there.
Thank You
Phoenixcoded
here is mviper28@gmail.com can you send v7.3 and v6.1
Please check your email.
thanks
hello, i want use pagination from rest data, possible use data table able react? i want using pagination from server side for much data. do you have reference or documentation for this problem
input select2 is not working (a mess display) if i use in modal window, can you help me thanks
Is there in Bootstrap or in Angular or in React one?
in Bootstrap
.modal {
z-index: 1052;
}.select2-container{
z-index: 1053;
}
documentation link doesn’t open up when in React folder: https://app.gitbook.com/@able-pro-angular/s/able-pro-react-documentation/
Hi there!
Last week I purchased this template. however I noticed that I’m getting a few warnings about packages being out of date; and upgrading these packages yield no desirable result. Are these going to get changed in the future? (e.g…) “react-dom.development.js:12449 Warning: componentWillReceiveProps has been renamed, and is not recommended for use”“
Otherwise it’s a clean template! Thank you sincerely.
Hello Sir, Thank you for choosing our product. Open command prompt and set project directory, run below command, npx react-codemod rename-unsafe-lifecycles
Any chance to update the form input to match new material guidelines (add a slightly darker background and an option with an outline)?
https://material-components.github.io/material-components-web-catalog/#/component/text-field?type=filledHere’s a text explaining the reason to update the design: https://medium.com/google-design/the-evolution-of-material-designs-text-fields-603688b3fe03
Thanks for sharing us the new suggestion about the Text Fields. Its really worth to implement in our theme. We will discuss on it & try to start implementation in our product.
- Phoenixcoded
Hi, I can to change navigation feather icon to font awesome icon?
Sir, we already implemented the font awesome icon in our base structure. You just need to add the font awesome icon class there.
i.e. like –<i class="feather icon-home" />
replace to font awesome icons
<i class="fas fa-ad" />
visit this page to directly copy the code of any icon –
http://ableproadmin.com/bootstrap/default/icon-fontawsome.html
Thank You
Phoenixcoded
Where is landing page component for ver. 8?
can you share your purchase detail first? Please let us know first on our email – phoenixcoded@gmail.com
Able pro 8.0 is Responsive or not. I am not able to check into all responsive devices. In a responsive device menu not opening properly.
can you share us the screenshots on our email – phoenixcoded@gmail.com
Hi Author,
I have two questions,
1. I have a requirement like, change widget/component background color based on user selection. I have seen “Setting Panel” option in version 6.1 that works as expected. For version 8.0, Don’t we have that option? If I want to implement “Setting Panel”, what should I do? Can you share the code base of version 6.1?
2. In Horizontal layout view, the “Menu” scroll(Right & Left Arrow icon) is not working but its working fine in Chrome. Can you please check and suggest me the fix? I have checked the latest version of firefox(70.0.1)
Thanks.
Ohk we will work on fix.
Can you please share us your email address. So I’ll share the version 6 code there.
About the version 8 – It is completely different from version 6 & 7. You can not migrate to version 8.
- Thank You
Hi, You can share the version 6 on this email id, sankar@techmango.net
Please check your email. We’ve sent you link there.
why is so much padding bottom (ex: sample-page.html) even though there is no content, how to get rid of it, thanks
can you please share your code on phoenixcoded@gmail.com
Hello
Thank you for the wonderful work done with the template. I want to use it as frontend with server side rendering done from golang.
I any suggestion on how to go about it.
Hi, thanks for your comment. About the golang framework. We can’t help you through it because we are unaware about it.