causeway-standard-theme
Version:
782 lines (772 loc) • 31.6 kB
HTML
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=2, minimum-scale=0.25">
<title>Causeway Theme</title>
<!-- Bootstrap -->
<link href="/css/bootstrap.min.css" rel="stylesheet" media="screen">
<link href="/css/causeway-utils.min.css" rel="stylesheet" media="screen">
<link href="/css/causeway-standard.min.css" rel="stylesheet" media="screen">
<link href="/docs/css/docs.min.css" rel="stylesheet" media="screen">
<link href="/css/causeway-print.min.css" rel="stylesheet" media="print">
<!--[if lt IE 9]>
<link href="/css/causeway-ie8.min.css" rel="stylesheet" media="screen">
<script src="/js/html5shiv.min.js"></script>
<script src="/js/respond.min.js"></script>
<![endif]-->
</head>
<body class="application">
<div class="container site-header">
<div class="site-header-holder">
<nav class="navbar site-menu" role="navigation">
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="/docs/index.html#style" data-hover="dropdown">
Style
<span class="fa fa-chevron-down"></span>
</a>
<ul class="dropdown-menu">
<li>
<a href="#build">
Build Instructions
</a>
</li>
<li>
<a href="/docs/index.html#stylesheets">
Stylesheets
</a>
</li>
<li>
<a href="/docs/index.html#javascript">
Javascript
</a>
</li>
</ul>
</li>
<li class="dropdown">
<a href="/docs/shells.html#shells" data-hover="dropdown">
Shells
<span class="fa fa-chevron-down"></span>
</a>
<ul class="dropdown-menu">
<li>
<a href="/docs/shells.html#header">
Header
</a>
</li>
<li>
<a href="/docs/shells.html#footer">
Footer
</a>
</li>
<li>
<a href="/docs/shells.html#single-pane">
Single Pane
</a>
</li>
<li class="dropdown-submenu">
<a href="/docs/shells/double-pane.html#double-pane">
Double Pane
</a>
<ul class="dropdown-menu">
<li class="dropdown-submenu">
<a href="/docs/shells/double-pane/vertical-split.html#double-pane-vertical-split">
Vertical Split
</a>
<ul class="dropdown-menu">
<li>
<a href="/docs/shells/double-pane/vertical-split.html#double-pane-vertical-split-divider">
Divider
</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="dropdown-submenu">
<a href="/docs/shells/content.html#content">
Content
</a>
<ul class="dropdown-menu">
<li>
<a href="/docs/shells/content.html#content-page-header">
Page Header
</a>
</li>
<li class="dropdown-submenu">
<a href="/docs/shells/content/icons.html#content-icons">
Icons
</a>
<ul class="dropdown-menu">
<li>
<a href="/docs/shells/content/icons.html#content-icons-use">
How to use
</a>
</li>
<li>
<a href="/docs/shells/content/icons.html#content-icons-available">
Available Icons
</a>
</li>
</ul>
</li>
<li>
<a href="/docs/shells/content.html#content-link">
Links
</a>
</li>
<li>
<a href="/docs/shells/content.html#content-email">
Emails
</a>
</li>
</ul>
</li>
<li>
<a href="/docs/shells/left-navigation.html#left-navigation">
Left Navigation
</a>
</li>
</ul>
</li>
<li class="dropdown">
<a href="/docs/components.html#components" data-hover="dropdown">
Components
<span class="fa fa-chevron-down"></span>
</a>
<ul class="dropdown-menu">
<li class="dropdown-submenu">
<a href="/docs/components/buttons.html#buttons">
Buttons
</a>
<ul class="dropdown-menu">
<li>
<a href="/docs/components/buttons.html#buttons-standard">
Standard Buttons
</a>
</li>
<li>
<a href="/docs/components/buttons.html#buttons-icon">
Icon Buttons
</a>
</li>
<li>
<a href="/docs/components/buttons.html#buttons-standard-icons">
Standard Buttons with Icons
</a>
</li>
<li>
<a href="/docs/components/buttons.html#buttons-text">
Text Button
</a>
</li>
<li>
<a href="/docs/components/buttons.html#buttons-arrow">
Arrow Button
</a>
</li>
<li>
<a href="/docs/components/buttons.html#buttons-multi-action">
Multi-action Buttons
</a>
</li>
</ul>
</li>
<li class="dropdown-submenu">
<a href="/docs/components/forms.html#forms">
Forms
</a>
<ul class="dropdown-menu">
<li>
<a href="/docs/components/forms.html#forms-text">
Text
</a>
</li>
<li>
<a href="/docs/components/forms.html#forms-textarea">
Textarea
</a>
</li>
<li>
<a href="/docs/components/forms.html#forms-password">
Password
</a>
</li>
<li class="dropdown-submenu">
<a href="/docs/components/forms/select.html#forms-select">
Select
</a>
<ul class="dropdown-menu">
<li>
<a href="/docs/components/forms/select.html#forms-select-single">
Single Choice
</a>
</li>
<li>
<a href="/docs/components/forms/select.html#forms-select-multiple">
Multiple Choice
</a>
</li>
</ul>
</li>
<li>
<a href="/docs/components/forms.html#forms-file">
File
</a>
</li>
<li class="dropdown-submenu">
<a href="/docs/components/forms/date.html#forms-date">
Date
</a>
<ul class="dropdown-menu">
<li>
<a href="/docs/components/forms/date.html#forms-date-single">
Single Date
</a>
</li>
<li>
<a href="/docs/components/forms/date.html#forms-date-range">
Date Range
</a>
</li>
</ul>
</li>
<li>
<a href="/docs/components/forms.html#forms-email">
Email
</a>
</li>
<li>
<a href="/docs/components/forms.html#forms-hyperlink">
Hyperlink
</a>
</li>
<li>
<a href="/docs/components/forms.html#forms-telephone">
Telephone
</a>
</li>
<li>
<a href="/docs/components/forms.html#forms-checkbox">
Checkbox
</a>
</li>
<li>
<a href="/docs/components/forms.html#forms-tristate">
Tristate
</a>
</li>
<li>
<a href="/docs/components/forms.html#forms-radio">
Radiobutton
</a>
</li>
<li>
<a href="/docs/components/forms.html#forms-time">
Time
</a>
</li>
<li>
<a href="/docs/components/forms.html#forms-image">
Image
</a>
</li>
</ul>
</li>
<li class="dropdown-submenu">
<a href="/docs/components/menus.html#menus">
Menus
</a>
<ul class="dropdown-menu">
<li>
<a href="/docs/components/menus.html#menus-dropdown">
Dropdown Menu
</a>
</li>
<li>
<a href="/docs/components/menus.html#menus-dropdown-site">
Site Menu
</a>
</li>
<li>
<a href="/docs/components/menus.html#menus-dropdown-page">
Page Menu
</a>
</li>
<li>
<a href="/docs/components/menus.html#menus-three-line">
Three Line Menu
</a>
</li>
</ul>
</li>
<li>
<a href="/docs/components.html#tabstrip">
Tabstrip
</a>
</li>
<li>
<a href="/docs/components.html#dialog-box">
Dialog Box
</a>
</li>
<li>
<a href="/docs/components/table.html#table">
Table
</a>
</li>
<li>
<a href="/docs/components/pagination.html#pagination">
Pagination
</a>
</li>
<li>
<a href="/docs/components/wizard.html#wizard">
Wizard
</a>
</li>
<li>
<a href="/docs/components/breadcrumb.html#breadcrumb">
Breadcrumb
</a>
</li>
<li>
<a href="/docs/components/treeview.html#treeview">
Tree View
</a>
</li>
</ul>
</li>
<li class="dropdown">
<a href="/docs/misc.html#misc" data-hover="dropdown">
Misc
<span class="fa fa-chevron-down"></span>
</a>
<ul class="dropdown-menu">
<li>
<a href="/docs/misc.html#tooltip">
Tooltip
</a>
</li>
</ul>
</li>
<li class="dropdown">
<a href="/docs/print.html#print" data-hover="dropdown">
Print Example
<span class="fa fa-chevron-down"></span>
</a>
</li>
</ul>
<div class="additional-nav-info">
<ol class="breadcrumb">
<li><a href="#">Causeway LTD</a></li>
<li class="dropdown">
<a href="#" data-toggle="dropdown">Carillion
<span class="glyhicon caret"></span>
</a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">Sub Company A</a></li>
<li><a href="#">Sub Company B</a></li>
<li><a href="#">Sub Company C</a></li>
<li><a href="#">More</a></li>
</ul>
</li>
</ol>
<span class="additional-menu">
<a href="#" data-toggle="dropdown"><span class="glyphicon glyphicon-threeLine-menu"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">Site Map</a></li>
<li><a href="#">Application Sample</a></li>
</ul>
</span>
</div>
</nav>
</div>
</div>
<div class="container page shell-left-navigation">
<!-- This displays the side menu and the main body of the page -->
<div class="content navigation-pane-left">
<div class="navigation-content-wrapper">
<div class="navigation-header">
<h2>Home</h2>
</div>
<div class="navigation-content">
<div class="tree-view">
<ul>
<li><a href="">Goes somewhere</a>
<ul>
<li>
<a href="">Goes somewhere</a>
<ul>
<li class="active">
<a href="">Goes somewhere</a>
</li>
</ul>
</li>
<li>
<a href="">Goes somewhere</a>
<ul>
<li class="active">
<a href="">Goes somewhere</a>
</li>
<li>
<a href="">Goes somewhere</a>
<ul>
<li>
<a href="">Goes somewhere</a>
<ul>
<li>
<a href="">Goes somewhere</a>
</li>
<li>
<a href="">Goes somewhere</a>
</li>
</ul>
</li>
<li>
<a href="">Goes somewhere</a>
</li>
<li>
<a href="">Goes somewhere</a>
</li>
</ul>
</li>
<li>
<a href="">Goes somewhere</a>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a href="">Goes somewhere</a>
<ul>
<li>
<a href="">Goes somewhere</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="divider divider-navigation"><span class="handle"></span></div>
<div class="content navigation-pane-right">
<div class="pane">
<form action="" class="form-inline has-table">
<div class="table-wrapper">
<div class="table-toolbar">
<button type="button" class="btn btn-filter">
Filter
</button>
<div class="toolbar-filter">
<div class="form-row form-inline">
<div class="form-group checkbox label-first">
<div class="control-input checkbox label-first">
<input type="checkbox" id="listField0value" class="form-control" name="listField[0].value" value="Y" onkeypress="javascript:listCr();">
<label for="listField0value" class="has-tooltip" data-toggle="tooltip" data-title="Select this option to view the disabled partner`s relationship as well." data-original-title="" title=""><span class="checkbox-icon"></span>Include Disabled Partners ?:</label>
</div>
</div>
<div class="form-group">
<label for="listField1value" class="control-label has-tooltip" data-toggle="tooltip" data-title="Enter the partner type to view the relationships." data-original-title="" title="">Partner Type ?:</label>
<div class="control-input">
<select id="listField1value" class="form-control selectpicker" name="listField[1].value" onkeypress="javascript:listCr();" style="display: none;">
<option value=""></option>
<option value="Data Only">Data Only</option>
<option value="Direct">Direct</option>
<option value="Gateway">Gateway</option>
<option value="Hub Alliance">Hub Alliance</option>
<option value="Managed Email">Managed Email</option>
<option value="Scan Link">Scan Link</option>
<option value="Sponsored">Sponsored</option>
<option value="Standard">Standard</option>
<option value="Tradex Active">Tradex Active</option>
<option value="VAN">VAN</option>
<option value="Bank">Bank</option>
<option value="Insurer">Insurer</option>
</select>
</div>
</div>
<div class="form-group checkbox label-first">
<div class="control-input checkbox label-first">
<input type="checkbox" id="listField2value" class="form-control" name="listField[2].value" value="Y" onkeypress="javascript:listCr();">
<label for="listField2value" class="has-tooltip" data-toggle="tooltip" data-title="Select this option to view the disabled relationship as well." data-original-title="" title=""><span class="checkbox-icon"></span>Include Disabled Relationships?:</label>
</div>
</div>
<div class="form-group">
<button type="button" class="btn btn-default btn-with-icon has-tooltip" title="" onclick="javascript:list();" data-original-title="Search this list by typing text to compare against in the fields below then click search">Search
<span class="glyphicon glyphicon-search"></span></button>
</div>
</div>
</div>
</div>
<div class="table-content">
<table class="table table-striped">
<thead class="has-table-group">
<tr>
<th colspan="2"></th>
<th>Title</th>
</tr>
<tr>
<th class="has-tooltip" data-toggle="tooltip" data-title="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc.">
Column 1
</th>
<th>
<span class="has-tooltip" data-toggle="tooltip" data-title="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc.">Column 2</span>
</th>
<th>
Column 3
</th>
</tr>
<tr class="filter">
<td>
<div class="form-group disabled">
<div class="control-input checkbox">
<input type="checkbox" id="filterField0filterToggle" class="form-control filter" name="filterField[0].filterToggle" value="true" onkeypress="javascript:listCr();">
<label for="filterField0filterToggle" class="has-tooltip" data-toggle="tooltip" data-title="Check this box to exclude the filter values entered below" data-original-title="" title=""><span class="checkbox-icon"></span>Exclude</label>
</div>
</div>
</td>
<td>
<div class="form-group">
<div class="control-input checkbox">
<input type="checkbox" id="filterField3filterToggle" class="form-control filter" name="filterField[3].filterToggle" value="true" onkeypress="javascript:listCr();">
<label for="filterField3filterToggle" class="has-tooltip" data-toggle="tooltip" data-title="Check this box to exclude the filter values entered below" data-original-title="" title=""><span class="checkbox-icon"></span>Exclude</label>
</div>
</div>
</td>
<td>
<div class="form-group">
<div class="control-input checkbox">
<input type="checkbox" id="filterField4filterToggle" class="form-control selectpicker filter" name="filterField[4].filterToggle" value="true" onkeypress="javascript:listCr();">
<label for="filterField4filterToggle" class="has-tooltip" data-toggle="tooltip" data-title="Check this box to exclude the filter values entered below" data-original-title="" title=""><span class="checkbox-icon"></span>Exclude</label>
</div>
</div>
</td>
</tr>
<tr class="filter">
<td>
<div class="form-group disabled">
<input type="text" id="filterField0value" class="form-control filter" name="filterField[0].value" value="" maxlength="10" size="10" onkeypress="javascript:listCr();" onkeydown="javascript:numbersOnly(event);">
</div>
</td>
<td>
<div class="form-group">
<select id="filterField4value" class="form-control selectpicker filter" name="filterField[4].value" onkeypress="javascript:listCr();" style="display: none;">
<option value=""></option>
<option value="A">Order Acknowledgement</option>
<option value="BR">Bulk Upload Response</option>
<option value="D">Dispatch Note</option>
<option value="I">Invoice</option>
<option value="LU">Lookup File</option>
<option value="O">Order</option>
<option value="P">PCard</option>
<option value="PR">PCard Response</option>
<option value="PT">Pass Through File</option>
<option value="PI">Payment Instruction</option>
<option value="Q">Query</option>
<option value="R">Requisition</option>
<option value="RM">Remittance</option>
<option value="SM">Status</option>
<option value="S">Statement</option>
</select>
</div>
</td>
<td>
<div class="form-group">
<input type="text" id="filterField5value" class="form-control filter" name="filterField[5].value" value="" maxlength="20" size="20" onkeypress="javascript:listCr();">
</div>
</td>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="form-group disabled">
<div class="control-input checkbox">
<input type="checkbox" id="filterField0filterToggle" class="form-control filter" name="filterField[0].filterToggle" value="true" onkeypress="javascript:listCr();">
<label for="filterField0filterToggle" class="has-tooltip" data-toggle="tooltip" data-title="Check this box to exclude the filter values entered below" data-original-title="" title=""><span class="checkbox-icon"></span>Exclude</label>
</div>
</div>
</td>
<td>
<a href="#" class="has-tooltip" data-toggle="tooltip" data-title="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc.">
This has a tooltip
</a>
</td>
<td>
<a href="#" class="has-tooltip pull-right" data-toggle="tooltip" data-title="This is a tooltip">
This has a tooltip
</a>
</td>
</tr>
<tr>
<td>
<a href="#" class="has-tooltip" data-toggle="tooltip" data-title="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc.">
This has a tooltip
</a>
</td>
<td>
<form class="form-horizontal" action="">
<div class="form-row">
<div class="form-group">
<div class="control-input">
<select id="selectMenu1" class="form-control selectpicker">
<option value="">All</option>
<option value="A">Order Acknowledgement</option>
<option value="BR">Bulk Upload Response</option>
<option value="D">Dispatch Note</option>
<option value="I" selected="selected">Invoice</option>
<option value="LU">Lookup File</option>
<option value="O">Order</option>
<option value="P">PCard</option>
<option value="PR">PCard Response</option>
<option value="PT">Pass Through File</option>
<option value="Q">Query</option>
<option value="R">Requisition</option>
<option value="RM">Remittance</option>
<option value="SM">Status</option>
<option value="S">Statement</option>
</select>
</div>
</div>
</div>
</form>
</td>
<td>
Cell 6
</td>
</tr>
<tr>
<td>
Cell 7
</td>
<td>
Cell 8
</td>
<td>
<form class="form-horizontal" action="">
<div class="form-row">
<div class="form-group">
<div class="control-input">
<select id="selectMenu2" class="form-control selectpicker">
<option value="">All</option>
<option value="A">Order Acknowledgement</option>
<option value="BR">Bulk Upload Response</option>
<option value="D">Dispatch Note</option>
<option value="I" selected="selected">Invoice</option>
<option value="LU">Lookup File</option>
<option value="O">Order</option>
<option value="P">PCard</option>
<option value="PR">PCard Response</option>
<option value="PT">Pass Through File</option>
<option value="Q">Query</option>
<option value="R">Requisition</option>
<option value="RM">Remittance</option>
<option value="SM">Status</option>
<option value="S">Statement</option>
</select>
</div>
</div>
</div>
</form>
</td>
</tr>
</tbody>
</table>
</div>
<div class="table-footer">
</div>
</div>
</form>
<hr/>
<form class="form-horizontal" action="">
<div class="form-row">
<div class="form-group">
<div class="control-input">
<select id="selectMenu" class="form-control selectpicker">
<option value="">All</option>
<option value="A">Order Acknowledgement</option>
<option value="BR">Bulk Upload Response</option>
<option value="D">Dispatch Note</option>
<option value="I" selected="selected">Invoice</option>
<option value="LU">Lookup File</option>
<option value="O">Order</option>
<option value="P">PCard</option>
<option value="PR">PCard Response</option>
<option value="PT">Pass Through File</option>
<option value="Q">Query</option>
<option value="R">Requisition</option>
<option value="RM">Remittance</option>
<option value="SM">Status</option>
<option value="S">Statement</option>
</select>
</div>
</div>
</div>
</form>
<hr/>
<a href="#" class="has-tooltip " data-toggle="tooltip" data-title="This is a tooltipThis is a tooltipThis is a tooltipThis is a tooltipThis is a tooltipThis is a tooltipThis is a tooltipThis is a tooltipThis is a tooltipThis is a tooltipThis is a tooltip">
This has a tooltip
</a>
<a href="#" class="has-tooltip pull-right" data-toggle="tooltip" data-title="This is a tooltipThis is a tooltipThis is a tooltipThis is a tooltipThis is a tooltipThis is a tooltipThis is a tooltipThis is a tooltipThis is a tooltipThis is a tooltipThis is a tooltip">
This has a tooltip
</a>
<a data-toggle="modal" href="remote.html" data-target="#modal">Click me</a>
<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 id="myModalLabel" class="modal-title">Dialogue Title</h4>
</div>
<div class="modal-body">
<div>
<form role="form">
<div class="form-row">
<div class="form-group image-input">
<input type="file" class="form-control file-input-image sr-only" id="image-field1a" name="image_field1a">
<div class="image-display-wrapper">
<img class="image-input-image" alt="" src="/images/image_placeholder.png">
</div>
<button type="button" class="btn btn-icon btn-default btn-file-choose">
<span class="glyphicon glyphicon-search"></span>
</button>
<br style="clear: both">
</div>
</div>
</form>
</div>
</div>
<div class="modal-footer">
<a href="javascript:void(0);" data-dismiss="modal">Cancel</a>
<button type="button" class="btn btn-primary">
Save
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container site-footer">
<div class="status-holder">
<div class="status-message">
</div>
</div>
<a href="#" class="site-footer-toggle">
<span class="fa fa-chevron-down"></span>
</a>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.3/angular.min.js"></script>
<script src="/js/jquery.js"></script>
<script src="/js/bootstrap.min.js"></script>
<script src="/js/causeway-utils.min.js"></script>
<script src="/js/causeway.min.js"></script>
<script src="/docs/js/docs.min.js"></script>
</body>
</html>