"Course List Create"
Bootstrap 3.0.0 Snippet by HakerTag

Post to Facebook Tweet this

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.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<form class="container">
<div class="row setup-content" id="step">
<div class="col-xs-12">
<div class="col-md-12 well text-center">
<h1> Course List</h1>
<!-- <form> -->
<div class="container col-xs-12">
<div class="row clearfix">
<div class="col-md-12 column">
<table class="table table-bordered table-hover" id="tab_logic">
<thead>
<tr style="width:100%">
<th class="text-center" style="width:10%">
#
</th>
<th class="text-center" style="width:30%">
Course Code
</th>
<th class="text-center" style="width:70%">
Course Name
</th>
</tr>
</thead>
<tbody>
<tr id='course0'>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
body{ margin-top:20px; }
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
$(document).ready(function(){
var i=1;
$("#add_row").click(function(){
$('#course'+i).html("<td>"+ (i+1) +"</td><td><input name='courseCode"+i+"' type='text' placeholder='Course Code' class='form-control input-md' /> </td><td><input name='CourseName"+i+"' type='text' placeholder='Course Name' class='form-control input-md'></td>");
$('#tab_logic').append('<tr id="course'+(i+1)+'"></tr>');
i++;
});
$("#delete_row").click(function(){
if(i>1){
$("#course"+(i-1)).html('');
i--;
}
});
});
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More

Material Dashboard Pro
Video list thumbnails
Accordion Multi Level List Group Menu
Watch card / Artist Profile / Youtube list

Questions / Comments: