Bootstrap 3 Template (with stuff in it)
This is a simple Twitter Bootstrap 3 template. You can fork it to get a ready to use Bootstrap 3 fiddle.
by BenjaminRay
HTML
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<table id="userDataTables" class="display table-responsive" cellspacing="0" width="100%" style="font-size: 95%;">
<thead>
<tr>
<th>Username</th>
<th>id</th>
<th>Email</th>
<th>phone</th>
<th>Registered at</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tr>
<td>User 1</td>
<td>uid1</td>
<td>[email protected]</td>
<td>555-5555</td>
<td>2015/12/30</td>
<td>
<select class="redirectSelect form-control">
<option value="" disabled selected style="font-weight: bold; font-style: italic; text-transform: lowercase; color: grey;">choisir une action</option>
<option value="{{ path('consumer_profile_edit', {'slug': user.slug }) }}">Edit Profile</option>
<option value="{{ path('index_admin_consumer_comment_pannel', {'slug': user.slug }) }}">Show comment(s)</option>
<option class="deleteInscription" value="#" data-href="www.example.com/delete/uid1" data-toggle="modal" data-target="#consumerDeleteModal" style="font-weight: bold; color: #CF000F;">Delete user</option>
</select>
</td>
</tr>
<tr>
<td>User 2</td>
<td>uid2</td>
<td>[email protected]</td>
<td>555-5556</td>
<td>2015/12/31</td>
<td>
<select class="redirectSelect form-control">
<option value="" disabled selected style="font-weight: bold; font-style: italic; text-transform: lowercase; color: grey;">choisir une action</option>
<option value="{{ path('consumer_profile_edit', {'slug': user.slug }) }}">Edit Profile</option>
<option value="{{ path('index_admin_consumer_comment_pannel', {'slug': user.slug }) }}">Show comment(s)</option>
<option...
CSS
/* Latest compiled and minified CSS included as External Resource*/
/* Optional theme */
@import url('//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css');
body {
margin: 10px;
}
JavaScript
/* Latest compiled and minified JavaScript included as External Resource */
// manage modal on google chrome
var deleteTarget = '';
$('.redirectSelect').on('change', function () {
var url = $(this).val();
if (url === "#") { // require a URL
console.log(url);
$('#consumerDeleteModal').modal();
deleteTarget = $(this).children('.deleteInscription').attr('data-href');
} else if (url !== "#") {
console.log(url);
window.location = url;
} else {
return false;
}
});
// deleted function
$('#confirmDeletion').bind('click', function() {
if (deleteTarget == null){
console.log("failed !!!");
} else {
console.log("prepare to delete the user !!!");
$(this).attr('href', deleteTarget);
//window.location.href = deleteTarget;
alert('Sending you to ' + deleteTarget);
}
});