Tengo un jtable, el formato se muestra tal cual por default, quisiera cambiar el color de los bordes y celdas de éstos. Así es como se muestra(pretendo lograr cambiar el color rojo):
Les dejo los fragmentos de mi código.
CSS
#tabla {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
border-collapse: collapse;
width: 100%;
}
#tabla td, #tabla th {
border: 1px solid #ddd;
padding: 8px;
}
#tabla tr:nth-child(even) {
background-color: #f2f2f2;
}
#tabla tr:hover {
background-color: #ddd;
}
#tabla th {
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #FF8000; /*#4CAF50;*/
color: white;
}
Funciones
<div class="box-body" id="grid-busca">
</div>
////////////
$(document).ready(function () {
$("#TXTInicioCarga").datepicker({ dateFormat: 'yy-mm-dd' });
$("#TXTFinCarga").datepicker({ dateFormat: 'yy-mm-dd' });
$('#grid-busca').jtable({
paging: true,
pageSize: 10,
tableId: 'ubicTable',
selecting: false, //Enable selecting
multiselect: true, //Allow multiple selecting
selectingCheckboxes: false, //Show checkboxes on first column
selectOnRowClick: true,
saveUserPreferences: false,
fields: {
ubicacion: {
title: '',
width: '5%',
sorting: false,
edit: false,
create: false,
display: function (locData) {
//Create an image that will be used to open child table
var $img = $('<img src="//Images/agregar-editar.png" title="Detalle" />');
}
},
location_id: {
key: true,
title: 'Ubicación',
create: true,
width: '10%',
edit: true,
list: true, input: function (data) {
if (data.record) {
return '<textarea name="ubicacion" readonly style="width:200px; text-transform:uppercase" >' + data.record.ubicacion+ '</textarea>';
} else {
return '<textarea name="ubicacion" style="width:300px;;text-transform:uppercase" placeholder="Ubicacion" />' + "Otro" + '</textarea>';
}
}
},
selectionChanged: function () {
//Get all selected rows
var $selectedRows = $('#grid-busca').jtable('selectedRows');
}
});//end jtable
Éste es el código generado del jtable.
Espero que alguien pueda apoyarme. Muchísimas gracias.
#ubicTable {border:1px solid red}