change the column in csv using php - javascript

in the code i used csv file in which i want to edit the rows of 3rd coulmn as want to make them a http link by using tag but i cant do that. right now the code chowing only the link but i want to make them hyperlink
<html>
<head>
</head><body>
<table width="10%" cellpadding="1" cellspacing="0" border="1" ;">
<thead>
<tr>
<th>A</th>
<th>B</th>
<th>C</th>
<?php
$f = fopen("http://localhost/csv/cr.csv", "r");
while (($line = fgetcsv($f)) !== false) {
echo "<tr>";
$data = count($line);
foreach ($line as $cell) {
echo "<td>" . htmlspecialchars($cell) . "</td>";
}
echo "</tr>\n";
}
fclose($f);
?>
</tr>
</thead>
</table>
</body>
</head>

try:
<?php
$f = fopen("http://localhost/csv/cr.csv", "r");
while (($line = fgetcsv($f)) !== false) {
if (!isset($line[2])) {
continue;
}
echo "<tr><td><a href='url'>" . htmlspecialchars($line[2]) . "</a></td></tr>";
}
fclose($f);
?>

Related

How can i display MYSQL Data using DataTables using While Loop

How can i display Data from MYSQL table using DataTables
I tried but Top part shown me
Bottom Shows Records from MYSQL table.
I want DataTables to read Mysql data display as shown in the picture below
//bottstrap html code
<div class="panel-body">
<div class="dataTable_wrapper">
<table class="table table-striped table-bordered table-hover" id="dataTables-example">
<thead>
<tr>
<th>Brand Name</th>
<th>Size</th>
</tr>
</thead>
// php
$record = mysqli_query($con,"SELECT * FROM ts127 ORDER BY Manufacturer");
while ($row = mysqli_fetch_array($record)) {
if()
{
}
elseif ($row['field1']==$XXX)
{
echo'<table style="table-layout:fixed;" class="table table-striped table-bordered table-hover" id="dataTables-example">';
// When i remove the above table code works fine for the first record or first row but other listed as a normal text
echo "<tr'>";
echo "<td style=' width:150px; text-align:left; padding: 10px;vertical-align: middle;'>";echo $row['Brand_Name'];echo"</td>";
echo "<td style='width:110px; text-align:left; vertical-align: middle;'>";echo $row['Size'];"</td>";
....
echo '<tr/></tbody></table>';
}
//JS Code
<script>
$(document).ready(function() {
$('#dataTables-example').DataTable({
responsive: true
});
});
</script>
You mistake was looping the table and tbody, you should be more careful about opening and closing the HTML tags
<?php
$record = mysqli_query($con,"SELECT * FROM ts127 ORDER BY Manufacturer");
echo'<table style="table-layout:fixed;" class="table table-striped table-bordered table-hover" id="dataTables-example">';
echo '<thead>';
echo '<tr>';
echo '<th>Brand Name</th>';
echo '<th>Size/th>';
echo '</tr>';
echo '</thead>';
echo '<tbody>';
while ($row = mysqli_fetch_array($record)) {
if (($row['field1']==$XXX || $row['field1']==$YYY ) && ($row['field2']>=$field1sw && $row['field1']<=$largesw) && ($txtbrand != "" && $size1=="" && $row['field2'] != "" && $row['Brand_Name']!="") )
{
echo "<tr'>";
echo "<td style=' width:150px; text-align:left; padding: 10px;vertical-align: middle;'>";echo $row['Brand_Name'];echo"</td>";
echo "<td style='width:110px; text-align:left; vertical-align: middle;'>";echo $row['Size'];"</td>";
....
echo '</tr>';
}
}
echo '</tbody>';
echo '</table>';
?>
if NOT, I would recommend you to use server-side DataTable
Update this
echo '<tr/></tbody></table>';
To be
echo '</tr>';
Then close the tbody, and table tag outside while loop

Server Sent Events In Firefox Not Working With AngularJS

Currently I'm learning Server Sent Events. Everything is fine if I make a simple HTML application. But when I turn into AngularJS, the problem appears. Server Sent Events is not continually called in Firefox. It works only once. This problem doesn't happen in Chrome and Opera.
Is this some issues regarding AngularJS performance in Firefox? Or is there anything wrong with my code? Any answer would be very appreciated! Thanks.. :)
Index.php
<body ng-app='' ng-controller="myCtrl">
<table class="table table-bordered table-hover table-responsive table-striped">
<thead>
<tr>
<th>No.</th>
<th>Id</th>
<th>Name</th>
<th>Level</th>
<th>Hapus</th>
</tr>
</thead>
<tr ng-repeat="x in admin">
<td>
{{$index + 1}}.
</td>
<td>
<input type="text" value="{{x.Id}}" class="init" readonly>
</td>
<td>
<textarea ng-keyup="myFunc($event, x.Id, 'Name')" class="init" ng-focus="edit($event)" ng-blur="noedit($event, x.Id, 'Name')">{{x.Name}}</textarea>
</td>
<td>
<textarea ng-keyup="myFunc($event, x.Id, 'Level')" class="init" ng-focus="edit($event)" ng-blur="noedit($event, x.Id, 'Level')">{{x.Level}}</textarea>
</td>
<td>
<button ng-click="sendDelete(x.Id)" class="btn btn-warning">Hapus</button>
</td>
</tr>
</table>
<div id="result"></div>
<script src="js/jquery-1.9.1.js" type="text/javascript"></script>
<script src="js/angular-1.2.25.min.js" type="text/javascript"></script>
<script type="text/javascript">
function myCtrl($scope, $http, $window) {
if (typeof (EventSource) !== "undefined") {
// Yes! Server-sent events support!
var source = new EventSource("sse.php");
source.onmessage = function(event) {
msg = JSON.parse(event.data);
$scope.admin = msg;
$scope.$apply();
document.getElementById("result").innerHTML += msg.Id + ". " + msg.Name + ". " + msg.Level + "<br>";
console.log($scope.admin);
};
} else {
// Sorry! No server-sent events support..
alert('SSE not supported by browser.');
}
};
</script>
</body>
sse.php
<?php
header('Content-Type: text/event-stream');
header('Cache-Control: no-cache');
require_once 'koneksi.php';
if (isset($_GET['id'])) {
$id = $_GET['id'];
$query = "SELECT * FROM `admin` WHERE id='" . $id . "'";
} else {
$query = "SELECT * FROM `admin`";
}
$stmnt = $dbh->prepare($query);
$stmnt->execute();
$output = "[";
while ($row = $stmnt->fetch()) {
if ($output != "[") {
$output .= ",";
}
$output .= '{"Id":"' . $row["id"] . '",';
$output .= '"Name":"' . $row["name"] . '",';
$output .= '"Level":"' . $row["level"] . '"}';
}
$output .= "]";
echo 'data: ' . ($output) . "\n\n";
ob_flush();
flush();
sleep(1);
?>

How can I show a hidden div below each row using bootstrap table?

In my admin panel I've a user page where all users are showing using Bootstrap Table with sorting option, pagination option.
Now I want to show more information about a user below each row when I click on a whole row then a div box will appear with more information.
How can i show this hidden div box below the each row ?
Javascript I'm using in html head section:
<script type="text/javascript" language="javascript" src="media/js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="media/js/jquery.dataTables.js"></script>
<script>
$(document).ready(function() {
$('#example').dataTable();
$('#example tbody').on('click', 'tr', function () {
var name = $('td', this).eq(0).text();
} );
} );
</script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap-theme.min.css">
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
Php & Html code I'm using in the html body section
<?php
$getUser = mysql_query("select * from members ORDER BY user_id DESC");
$num = mysql_num_rows($getUser);
?>
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Company</th>
<th>Position</th>
<th>Status</th>
<th>Kit type</th>
</tr>
</thead>
<tbody>
<?php
$i = 0;
while($search_result = mysql_fetch_array($getUser)){
$i++;
$uid = (int) $search_result['user_id'];
$email = $search_result['email'];
$fname = $search_result['fname'];
$lname = $search_result['lname'];
$company = $search_result['company'];
$position = $search_result['position'];
$status = $search_result['status'];
echo "<tr>";
echo "<td class='row' $class valign='top'>$fname</td>";
echo "<td class='row' $class valign='top'>$lname</td>";
echo "<td class='row' $class valign='top'>$company</td>";
echo "<td class='row' $class valign='top'>$position</td>";
echo "<td class='row' $class valign='top'>$status</td>";
echo "<td class='row' $class valign='top'>$kittype</td>";
echo "</tr>";
}
?>
</tbody>
</table>

How to dynamically populate table based on data

This is my HTML code
<table data-role="table" id="movie-table" data-filter="true" data-input="#filterTable-input" class="ui-responsive">
<thead>
<tr>
<th data-priority="1">Rank</th>
<th data-priority="persist">Player Name</th>
<th data-priority="2">Record</th>
<th data-priority="3"><abbr title="Rotten Tomato Rating">Points</abbr></th>
<th data-priority="4">Highlight</th>
</tr>
</thead>
<tbody >
<div id="table"></table>
</tbody>
</table>
**This is my Javascript/Jquery**
$( document ).ready(function()
{
$.get('./php/rank.php', function(data)
{
$('#table').html(data);
}).error(function() {
$('#table').append('An error has occured');
} ).success (function(){
$('#table').append('');
})
});
**This is my php**
echo "<tr>";
echo "<th>". $row1['points']."<td/>";
echo "<td>". $row1['points']."<td/>";
echo "<td>". $row1['points']."<td/>";
echo "<td>". $row1['points']."<td/>";
echo "<td>". $row1['points']."<td/>";
echo "</tr>";
What I am trying to accomplish is to populate the table based on registered users. I
tried to echo the complete table - no success(I'm using JQuery Mobile) So I thought maybe I can Just Echo the th and td tags that will vary. Any suggestions would be greatly appreciated, maybe I'm just going about this the wrong way. Thanks
You are not closing your tags properly. Moreover, there is no need for a div insde tbody (I don't know if it's even allowed). Try with this corrected code:
<table data-role="table" id="movie-table" data-filter="true" data-input="#filterTable-input" class="ui-responsive">
<thead>
<tr>
<th data-priority="1">Rank</th>
<th data-priority="persist">Player Name</th>
<th data-priority="2">Record</th>
<th data-priority="3"><abbr title="Rotten Tomato Rating">Points</abbr></th>
<th data-priority="4">Highlight</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
**This is my Javascript/Jquery**
$( document ).ready(function()
{
$.get('./php/rank.php', function(data)
{
$('#movie-table tbody').html(data);
}).error(function() {
$('#movie-table tbody').append('An error has occured');
} ).success (function(){
$('#movie-table tbody').append('');
})
});
**This is my php**
echo "<tr>";
echo "<th>". $row1['points']."</th>";
echo "<td>". $row1['points']."</td>";
echo "<td>". $row1['points']."</td>";
echo "<td>". $row1['points']."</td>";
echo "<td>". $row1['points']."</td>";
echo "</tr>";
Edit: and of course you don't want to show the field "points" in all of the five columns.
I solved it. In php you have to echo the complete table.
echo "<table data-role='table' id='movie-table' data-filter='true' data-input='#filterTable-input' class='ui-responsive'>";
echo "<thead>";
echo "<tr>";
echo "<th data-priority='1'>Rank</th>";
echo "<th data-priority='persist'>Player Name</th>";
echo "<th data-priority='2'>Record</th>";
echo "<th data-priority='3'><abbr title='Rotten Tomato Rating'>Points</abbr></th>";
echo "<th data-priority='4'>Highlight</th>";
echo "</tr>";
echo "</thead>";
while($row1 = mysql_fetch_array($result1)){
echo "<tbody>";
echo "<tr>";
echo "<th>1</th>";
echo "<td>Kentwan</td>";
echo "<td>10-0</td>";
echo "<td>1000</td>";
echo "<td>test</td>";
echo "</tr>";
echo "</tbody>";
}
echo "</table>";
Try something like this:
<table data-role="table" id="movie-table" data-filter="true" data-input="#filterTable-input" class="ui-responsive">
<thead>
<tr>
<th data-priority="1">Rank</th>
<th data-priority="persist">Player Name</th>
<th data-priority="2">Record</th>
<th data-priority="3"><abbr title="Rotten Tomato Rating">Points</abbr></th>
<th data-priority="4">Highlight</th>
</tr>
</thead>
<tbody id='tab_body'>
</tbody>
</table>
** your Javascript/Jquery**
$( document ).ready(function()
{
$.get('./php/rank.php', function(data)
{
$('#tab_body').html(data);
})
}

Javascript comparison for a table row to highlight a row in red (CakePHP)

How do I find the right approach to getting this comparison to work? I've tried all kinds of approaches. I even used ids, but they don't respond. If I do this "gumboots" string check though, it does work. "gumboots" was just a value for a product name that existed somewhere on the table. This is how I know I do not need PHP at all for this, despite the tables displayed in PHP in the Index view below. Any idea? I would appreciate it.
Here's the javascript
$('#example tbody tr td').each(function()
{
//var p_no_in_stock = parseInt($('#p_no_in_stock')).val();
//var p_reorder_quantity = parseInt($('#p_reorder_quantity')).val();
var p_no_in_stock = parseInt(document.getElementById('p_no_in_stock')).value;
var p_reorder_quantity = parseInt(document.getElementById('p_reorder_quantity')).value;
//if ($product['Product']['p_no_in_stock'].val() < $product['Product']['p_reorder_quantity'].val())
if ($(this).text() == "gumboots")
//if ($(this).p_no_in_stock < $(this).p_reorder_quantity)
{
//$("#row_" +" td").effect("highlight", {}, 1500);
$(this).closest('tr').attr('style','background-color:red');
$(this).parent().css('background-color','red');
$(this).parent().attr('style','background-color:red');
$(this).parent().addClass('highlight');
$(this).parent().css('font-weight','bold');
}
});
And this is the application in a View called Products.index
<div class="active">
<h2><?php echo __('Products'); ?></h2>
<table cellpadding="0" cellspacing="0" class="table table-striped table-bordered" id ="example">
<tr>
<th><?php echo $this->Paginator->sort('p_name', 'Name'); ?></th>
<th><?php echo $this->Paginator->sort('category_name', 'Category'); ?></th>
<th><?php echo $this->Paginator->sort('p_no_in_stock','No. in Stock'); ?></th>
<th><?php echo $this->Paginator->sort('p_reorder_quantity', 'Re-order Quantity'); ?></th>
<th class="actions"><?php echo __('Actions'); ?></th>
</tr>
<tbody>
<?php foreach ($products as $product): ?>
<tr>
<td><?php echo h($product['Product']['p_name']); ?></td>
<td> <?php echo $this->Html->link($product['Category']['category_name'],
array('controller' => 'categories', 'action' => 'view', $product['Category']['id'])); ?>
</td>
<td id = "p_no_in_stock" type ="number" ><?php echo h($product['Product']['p_no_in_stock']); ?> </td>
<td id ="p_reorder_quantity" type ="number" ><?php echo h($product['Product']['p_reorder_quantity']); ?> </td>
<td class="actions">
<?php echo $this->Html->link(__('View'), array('action' => 'view', $product['Product']['id']), array('class' => 'btn btn-mini')); ?>
<?php echo $this->Html->link(__('Edit'), array('action' => 'edit', $product['Product']['id']), array('class' => 'btn btn-mini')); ?>
<?php echo $this->Form->postLink(__('Delete'), array('action' => 'delete', $product['Product']['id']), array('class' => 'btn btn-mini'), __('Are you sure you want to delete # %s?', $product['Product']['id'])); ?>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
Thanks in advance.
Is this what you're asking?
http://jsfiddle.net/SinisterSystems/z9SE7/1/
HTML:
<table>
<tr>
<td>Test</td>
<td>Test</td>
<td>Test</td>
<td>Test</td>
<td>Test</td>
</tr>
<tr>
<td>Test</td>
<td>Test</td>
<td>Test</td>
<td>Test</td>
<td>Test</td>
</tr>
</table>
CSS:
tr:hover td {
background:#F00;
}
I am sending you mine code, please modify it accordingly....
The PHP Code is as -
<?php
if($num>0)
{
echo '<table width="100%" id="dep_table" style="margin-top:10px;" cellspacing="1" cellpadding="2" border="0">';
echo '<tr bgcolor="#4682B4">';
echo '<th>Editor</th>';
echo '<th>Department Id</th>';
echo '<th>Department Name</th>';
echo '</tr>';
$i=0;
while ($row = $stmt->fetch(PDO::FETCH_ASSOC))
{
$i++;
if($i % 2 == 0)
{
$bgcolor= "#6AA2C3";
}
else
{
$bgcolor= "#A2B5CD";
}
//extract row, this will make $row['firstname'] to just $firstname only
extract($row);
//creating new table row per record
echo "<tr bgcolor='$bgcolor' id='$DeptId' name='edit_tr'>";
echo '<td id="edit"><input id="edit" type="radio" name="deptid" value="DeptId" ?></td>';
echo "<td class='format'>{$row['DeptId']}</td>";
echo "<td class='format'>{$row['DeptName']}</td>";
echo "</tr>";
}
echo "</table>";
}
echo "</div>";
The JS for corresponding code is as -
$(document).ready(function() {
row_color();
$('#dep_table tr').click(function(e) {
$(this).find('td input:radio').prop('checked', true);
/* submit_fxn();
$('#form_ndesg').submit(function(e) {
return false;
});*/
});
});
//******* 1 Div Fade In/Out effect *******
function row_color(){
$('#dep_table tr').not(':first').hover(function(){
$(this).addClass('hover');
},function(){
$(this).removeClass('hover');
});
};
The corresponding CSS code is as -
tr.hover{
background-color:#E7ECB8;
color:#990000;
}
You will move your mouse on the table, it will change the row color as well as rwo text color and when you click on particular row, it will enable the row by selecting radio button..
If this answer is helpful for you then please like it for answer, so that others can use it for reference.... Thanks and best of luck

Categories