how can I save the colour into database ? here is my coding.. I can change the table colour, but it doesn't save into database. While I'm open it again, the colour will turn to normal..
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
</head>
<body>
<html>
<title>Test</title>
<head>
<script type="text/javascript">
function colourRow1(rowNumber) {
//some code to change the colour of the row indicated by the number
alert("change row 1 background colour");
var tr = document.getElementById('table1')
.getElementsByTagName('tr')[rowNumber-1];
tr.style.backgroundColor = 'blue';
}
</script>
</head>
<body>
<table name="table1" id="table1" border="1">
<thead>
<th>heading1</th>
<th>heading2</th>
<th>heading3</th>
</thead>
<tbody>
<tr id="row1">
<td>1,1</td>
<td>1,2</td>
<td>1,3</td>
</tr>
<tr id="row2">
<td>2,1</td>
<td>2,2</td>
<td>2,3</td>
</tr>
<tr id="row3">
<td>3,1</td>
<td>3,2</td>
<td>3,3</td>
</tr>
</tbody>
</table>
<button type="button" onClick="colourRow1(1)" action="colourupdate.php">Change Row 1</button>
</body>
</html>
how can I save the colour into database ? here is my coding.. I can change the table colour, but it doesn't save into database. While I'm open it again, the colour will turn to normal..
You need to maintain another table for storing the color history..
Table structure like this
id | rowno | color
you need to store row number and color for each button click using a ajax call.
Other Method is
Store row id and color as a Session for a particular period of time ..
$_SEESION['rowid']=$value;
$_SEESION['rowid']=$color;
Related
I'm trying combine a table where fixtures are under their respective leagues [Headers] but i'm having a problem with the empty rows appearing in my table as its showing the empty rows instead of ignoring them
please check through the three pictures on how i want to shape my table:
SQL Table With Empty Cells In COL 1
HTML Table With Empty Rows Under Every Row
How I want My Table To Look Like after skipping empty Rows
My Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="Style.css">
</head>
<body>
<table class="Fixtures" border="1">
<tr>
<thead>
<th>League / Match</th>
</thead>
</tr>
<br>
<tr>
<th class="League ">Premier League</th>
</tr>
<tr >
<td>Arsenal - Man united</td>
</tr>
<tr>
<td>Chelsea - Newcastle</td>
</tr>
<th class="League">Spain La Liga</th>
<tr>
<td>Barcelona - Real Madrid</td>
</tr>
<tr>
<td>Sevilla - Real Sociedad</td>
</tr>
<tr>
<td>Alaves - Cadiz</td>
</tr>
<th class="League">Allsvenskan</th>
<tr>
<td>Elfsborg - Varberg</td>
</tr>
<tr>
<td>Kalmar - Varnamo</td>
</tr>
<tr>
<td>Malmo FF - Helsingborg</td>
</tr>
</table>
</body>
</html>
Instead of hiding them, you can just skip them:
while($row = $result->fetch_assoc()) {
if(!$row["COL 1"] && !$row["COL 2"]){
continue;
}
// Your other code here
}
I have a table, on the front-end, and its contents change according to the MySQL table, that I have connected using PHP. Now, I have some action buttons in each row, but for now, let's just assume that I have only one action, that is deleting that row. Sort of like below.
table,
th,
td {
border: 1px solid black;
border-collapse: collapse;
padding: 5px;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<table>
<tr>
<th>Categories</th>
<th>Actions</th>
</tr>
<tr>
<td>Category 1</td>
<td><input type="button" value="Delete"></td>
</tr>
<tr>
<td>Category 2</td>
<td><input type="button" value="Delete"></td>
</tr>
</table>
</body>
</html>
Now, in my actual code, these delete buttons will open a confirmation page. The confirmation page is actually the same, but I need to delete different categories with their respective buttons, by deleting the data in the database. How do I make that happen?
You can add the form tag and add name and value to the delete button then retrieve it on the other page and perform respective actions on receipt of said data or value on POST/GET. Or you can use GET to send each delete value to the page without using form attributes.
Please respond with clearer info for better help/answer
I have the following code, and the tutorial I followed says that the table should show up, but it doesn't. All that shows up is the text inside the <h1> and <h4> tags, and the external CSS file is also not taking effect. The code I have is as follows:
<?php
include_once('connection.php');
$query="select * from myanimelist";
$result=mysql_query($query);
?>
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles-2.css">
</head>
<body>
<h1> Callum Stewart's Amazing Website. </h1>
<h4> The Home of Entertainment. </h4>
<table align="center" border="1px" style="width: 300px" color="black">
<tr>
<th>Anime Database</th>
</tr>
<tr>
<th>Title</th>
<th>MediaType</th>
<th>Rating</th>
<th>NumOfEpisodes</th>
<th>NumOfVolumes</th>
</tr>
</table>
</body>
</html>
I am using datatable to display data. I have large database nearly 15k rows and it takes times to load data so I am displaying only 200 rows in datatable. But search filter in the datatable are most important thing needed here. Therefore I need to search data directly from database by php through ajax call on keyup event. So how can i do that ?
This is what I have done till here.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Trail 2</title>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="datatable/css/jquery.dataTables.min.css" rel="stylesheet">
<!--<link href="https://cdn.datatables.net/1.10.15/css/dataTables.bootstrap.min.css" rel="stylesheet">-->
<style>
tfoot input {
width: 100%;
padding: 3px;
box-sizing: border-box;
}
</style>
</head>
<body>
<br><br>
<div class="container">
<div class="row">
<table id="example" class="table table-striped table-bordered" cellspacing="0" width="100%">
<thead>
<tr>
<th>Name</th>
<th>Surname</th>
<th>City</th>
<th>Mobile No</th>
</tr>
</thead>
<tfoot>
<tr>
<th><input type="text" name="name" id="name" placeholder="Search by NAME"></th>
<th>Surname</th>
<th>City</th>
<th>Mobile No</th>
</tr>
</tfoot>
<tbody>
<?php
require('connectivity2.php');
$query1 = "SELECT * FROM member LIMIT 200;";
$result1 = mysqli_query($con, $query1);
while($row = mysqli_fetch_assoc($result1)){
$name = $row['m_name'];
$surname = $row['m_sec_surname'];
$city = $row['m_city'];
$no = $row['m_mobile'];
?>
<tr>
<td><?php echo $name; ?></td>
<td><?php echo $surname; ?></td>
<td><?php echo $city; ?></td>
<td><?php echo $no; ?></td>
</tr>
<?php } //End of while loop
?>
</tbody>
</table>
</div>
</div>
<script src="js/jquery-1.12.4.js"></script>
<script src="datatable/js/jquery.dataTables.min.js"></script>
<!--<script src="https://cdn.datatables.net/1.10.15/js/dataTables.bootstrap.min.js"></script> -->
<script type="text/javascript">
$(document).ready(function() {
// DataTable
var table = $('#example').DataTable();
// Search
$("#name").keyup(function(){
var m_name = $("input[name='name']").val();
//window.alert(m_name);
$.ajax({
type: 'POST',
url: 'trial2php.php',
data: {member name:m_name},
cache: true,
datatype: 'html',
success: function(){
$('#example').DataTable();
}
});
});
} );
</script>
</body>
</html>
Here I have taken just one input text in footer of the table for testing search.
Something is wrong in ajax function. Please help me out here.
Select only needed columns:
SELECT ItemCode, ItemName, RackNo, ItemSrNo
Create indexes for columns:
ItemCode, ItemName, RackNo, ItemSrNo
See:
https://dev.mysql.com/doc/refman/5.7/en/create-index.html
You should use Server Side processing with Pipeline feature of DataTables. This way fetching, rendering and filtering data in DataTables will be smooth.
Follow the link below to know more about the process with example -
DataTables Server Side Processing with Pipeline
I have 5 dropdowns on a tab of a website. I have a database table in MS SQL Server. The table has all the data of 5 dropdowns with one of the fieldNames called Region_Name, say the Region_Names are A, B, C, D, and E. I have written codes to display a table and enabled row editing for one of the RegionNames. Now, I am wondering if I could modify the same codes to display associated table with row editing enabled using different queries when a dropdown is clicked. That could reduce the code repetition and improve the performance. But I do not know how to achieve this. Could anyone please give me some hints? I am using PHP PDO to connect to the database.
My codes to display the table is shown below. I am using Datatables plugin and tableExport Jquery plug in. For simplicity, I have not copied the links and libraries for plugins. I can show my edit.php if that will be helpful.
<?php
require_once('include/database.php');
?>
<!DOCTYPE html>
<html>
<head>
<title>Matrix</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
<meta http-equiv="content-type" content="text/html" charset="UTF-8">
<script src="//code.jquery.com/jquery-1.12.3.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<header>
</header> <br/>
<div id="container">
<table id="myTable" class="display" cellpadding="0px" cellspacing="0px"
width="100%">
<thead>
<tr>
<th style="width: 1px">ID</th>
<th style="width: 1px">Site</th>
<th style="width: 1px">Location</th>
<th style="width: 1px">Remarks</th>
<th width="1px">Action</th>
</tr>
</thead>
<tbody>
<?php
$stmt = $conn->prepare("SELECT * FROM MATRIX WHERE
Region_Name='Charlotte'");
$stmt ->execute();
$result = $stmt->fetchAll();
foreach($result as $row) {
?>
<tr>
<td><?=$row['ID'];?></td>
<td><?= $row['Site']; ?></td>
<td><?= $row['Location']; ?></td>
<td><?= $row['Remarks']; ?></td>
<td> Edit</td>
</tr>
<?php
}
?>
</tbody>
</table>
<br/>
</div>
</body>
</html>
You may use SELECT table_name FROM information_schema.tables WHERE table_schema = '<your database name>' to get all the table in your database.
You can also get all the columns of table with this query
select * from INFORMATION_SCHEMA.COLUMNS where TABLE_NAME='<your table name>'