"list with advance search feature"
Bootstrap 3.0.3 Snippet by sushan

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container">
<div class="row">
<div class="span12">
<div class="widget stacked widget-table action-table">
<div class="page-header">
<h1>
List Exam
</h1>
</div>
<div class="row">
<div class="span2 side-by-side clearfix">
<select tabindex="-1" id="Show" class="chosen-select" data-placeholder="Show" style="display: none;">
<option value=""></option>
<option>5</option>
<option>10</option>
<option>20</option>
<option>50</option>
<option>All</option>
</select><div class="chosen-container chosen-container-single" style="width: 150px;" title="" id="Show_chosen"><a tabindex="-1" class="chosen-single chosen-default"><span>Show</span><div><b></b></div></a><div class="chosen-drop"><div class="chosen-search"><input type="text" autocomplete="off" tabindex="2"></div><ul class="chosen-results"><li data-option-array-index="1" style="" class="active-result">5</li><li data-option-array-index="2" style="" class="active-result">10</li><li data-option-array-index="3" style="" class="active-result">20</li><li data-option-array-index="4" style="" class="active-result">50</li><li data-option-array-index="5" style="" class="active-result">All</li></ul></div></div>
</div>
<div class="span2 side-by-side clearfix">
<select tabindex="-1" id="Sort" class="chosen-select" data-placeholder="Sort by" style="display: none;">
<option value=""></option>
<option>Exam ID</option>
<option>Exam Name</option>
<option>Department</option>
<option>Program/Level</option>
<option>Course</option>
<option>Date Created</option>
<option>Exam Date</option>
<option>Status</option>
</select><div class="chosen-container chosen-container-single" style="width: 150px;" title="" id="Sort_chosen"><a tabindex="-1" class="chosen-single chosen-default"><span>Sort by</span><div><b></b></div></a><div class="chosen-drop"><div class="chosen-search"><input type="text" autocomplete="off" tabindex="2"></div><ul class="chosen-results"><li data-option-array-index="1" style="" class="active-result">Exam ID</li><li data-option-array-index="2" style="" class="active-result">Exam Name</li><li data-option-array-index="3" style="" class="active-result">Department</li><li data-option-array-index="4" style="" class="active-result">Program/Level</li><li data-option-array-index="5" style="" class="active-result">Course</li><li data-option-array-index="6" style="" class="active-result">Date Created</li><li data-option-array-index="7" style="" class="active-result">Exam Date</li><li data-option-array-index="8" style="" class="active-result">Status</li></ul></div></div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
.clearfix:before, .clearfix:after {
content: "";
display: table;
line-height: 0;
}
.clearfix:after {
clear: both;
}
.hide-text {
background-color: rgba(0, 0, 0, 0);
border: 0 none;
color: rgba(0, 0, 0, 0);
font: 0px/0 a;
text-shadow: none;
}
.input-block-level {
-moz-box-sizing: border-box;
display: block;
min-height: 30px;
width: 100%;
}
.hidden {
display: none;
visibility: hidden;
}
.visible-phone {
display: none !important;
}
.visible-tablet {
display: none !important;
}
.hidden-desktop {
display: none !important;
}
.visible-desktop {
display: inherit !important;
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
// Chosen, a Select Box Enhancer for jQuery and Prototype
// by Patrick Filler for Harvest, http://getharvest.com
//
// Version 1.0.0
// Full source at https://github.com/harvesthq/chosen
// Copyright (c) 2011 Harvest http://getharvest.com
// MIT License, https://github.com/harvesthq/chosen/blob/master/LICENSE.md
// This file is generated by `grunt build`, do not edit it by hand.
(function() {
var $, AbstractChosen, Chosen, SelectParser, _ref,
__hasProp = {}.hasOwnProperty,
__extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
SelectParser = (function() {
function SelectParser() {
this.options_index = 0;
this.parsed = [];
}
SelectParser.prototype.add_node = function(child) {
if (child.nodeName.toUpperCase() === "OPTGROUP") {
return this.add_group(child);
} else {
return this.add_option(child);
}
};
SelectParser.prototype.add_group = function(group) {
var group_position, option, _i, _len, _ref, _results;
group_position = this.parsed.length;
this.parsed.push({
array_index: group_position,
group: true,
label: this.escapeExpression(group.label),
children: 0,
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: