I want to do something like this..
I have a update form in PHP, which contains around 15 fields,
I want to show some data in tabular manner while you open the page for update..
Senario:
If you want to update a record of a person on day to day basis, I have the feature with me to search out that person form database, and when you click on update data..
it should show in a manner that,
field1.....----------
field2.....----------
field3.....----------
and now,
for field4,5,6,7
if these fields contain the data then show in a table manner with fields 4,5,6,7 as coloums and no of rows depending upon the number of entries (should be non editable)(assume the case of multiple input)
then form will continue.
field4.....--------
field5.....--------
field6.....--------
field7.....--------
typically these field(4,5,6,7) gets their value update frequently and I have to maintain the previous inputs also.
help me out with some solution, as I am unable to figure out how to do this?
before that i was using this.. here i was having a form field which can generate 5 options, and will populate the fields with data if u have entered before, now i want to change the display as I don't want user to play with the old data, so I want to show old data into a table and enter new data via a simple text field,
as their is no point to keep these multiple input form field as user is updating only one value at a time.
<script>
function Submitted_Date(value,object)
{
value = document.getElementById("subdate_num").value;
if (value > -1) {
var input= new Array(value);
var p;
//alert("Enter The fields You Know ");
var ele = document.getElementById("subdate");
if(ele.hasChildNodes())
{
var len = ele.childNodes.length;
while(ele.childNodes.length - value > 1)
{
ele.removeChild(ele.lastChild);
}
}
for (var i=len-1;i<value;i++)
{
p= i+1;
input[i] = document.createElement('div');
input[i].innerHTML = 'Submitted_Date' + p + ': <input type="text" value="" name="subdate' + p + '" id="subdate' + p +'" size = 25 onclick="javascript: showCalendar("Submitted_Date'+ p +'")"/>';
document.getElementById("subdate").appendChild(input[i]);
var subdate = 'subdate' + p;
}
}
document.getElementById("subdate1").focus();
}
</script>
<tr>
<td> Submitted Date :
<select name="subdate_num" id="subdate_num" onChange="return Submitted_Date(this.value,this.form)">
<?php
for ($i=0;$i<=5;$i++)
{
if ($i==0) { $temp = "<option value=$i> - </option>"; echo $temp; }
else { $temp = "<option value=$i>$i</option>";
echo $temp; }
}
?>
</select></td>
</tr>
</table>
<table>
I think this is what you want, this will show the information in a table with as many (or few) columns as you want
$query = "SELECT * FROM announcements ORDER BY announceid";
$result = mysql_query($query);
echo "<table border='1'>
<tr>
<th>Announcement ID</th>
<th>Announcement Name</th>
<th>Announcement Category</th>
<th>Approved?</th>
<th></th>
</tr>";
if ($result && mysql_num_rows($result) > 0) {
$x = 0;
while ($row = mysql_fetch_array($result)) {
echo "<tr>";
echo "<td>" . $row['announceid'] . "</td>";
echo "<td>" . $row['title'] . "</td>";
echo "<td>" . $row['category_name'] . "</td>";
echo "<td>" . $row['status'] . "</td>";
echo '<td>Edit</td>';
echo "</tr>";
$x ++;
};
echo "</table>";
Let me know if that is what you are looking for, or if there is any other way I can help. Thanks!
Related
I'm trying to learn php with html and I decided to create a project.
Right now, I'm stuck at this point where I want to display data on a textarea.
I created a database named 'company' with the table 'login' and the columns 'id','password' and 'username'.
When I select an option in the select option menu, the data from the column 'id','password' and 'username' is displayed in a table. What I want to achieve is when I click on a row, that the data from the column "problem" is displayed on the textarea which describes the situation with explanation.
I don't know how to write this but the syntax should be something like: Select 'problem' from login WHERE id='selected row id' I created on my php a select case witch works fine. The only problem that I have is I don't know how to select the id when I click on a specific row to display the data on the textarea.
Here's my code so far:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Formulaire</title>
<link rel="stylesheet" type="text/css" href="formulaire.css"/>
<!--<script type="text/javascript" src="select1.js"></script>-->
<!--<script src="http://code.jquery.com/jquery-latest.js"></script>-->
<style>
table tr:not(:first-child){
cursor: pointer;transition: all .25s ease-in-out;
}
table tr:not(:first-child):hover{background-color: #ddd;}
</style>
</head>
<body>
<div id="form">
<form action="#" method="post">
<label>Veuillez choisir une option :</label>
<select id="choix" name="choixtest">
<option value="tous">tous</option>
<option value="id">id</option>
<option value="username">username</option>
<option value="password">password</option>
</select>
<input type="submit" name="submit" value="Get Selected Values" />
<table id="table">
<?php
/* Attempt MySQL server connection. Assuming you are running MySQL
server with default setting (user 'root' with no password) */
$link = mysqli_connect("localhost", "root", "", "company");
// Check connection
if($link === false){
die("ERROR: Could not connect. " . mysqli_connect_error());
}
// Attempt select query execution
$sql = "SELECT * FROM login";
if($result = mysqli_query($link, $sql)){
if(mysqli_num_rows($result) > 0){
echo "<table>";
echo "<tr>";
echo "<th>id</th>";
echo "<th>username</th>";
echo "<th>password</th>";
echo "</tr>";
if(isset($_POST['submit'])){
$selected_val = $_POST['choixtest']; // Storing Selected Value In Variable
while($row = mysqli_fetch_array($result)){
switch($_POST['choixtest']){
case 'tous':
echo "<tr>";
echo "<td>" . $row['id'] . "</td>";
echo "<td>" . $row['username'] . "</td>";
echo "<td>" . $row['password'] . "</td>";
echo "</tr>";
break;
case 'id':
echo "<tr>";
echo "<td>" . $row[$selected_val] . "</td>";
echo "<td>" . "</td>";
echo "<td>" . "</td>";
echo "</tr>";
break;
case 'username':
echo "<tr>";
echo "<td>" . "</td>";
echo "<td>" . $row[$selected_val] . "</td>";
echo "<td>" . "</td>";
echo "</tr>";
break;
case 'password':
echo "<tr>";
echo "<td>" . "</td>";
echo "<td>" . "</td>";
echo "<td>" . $row[$selected_val] . "</td>";
echo "</tr>";
break;
default:
// Something went wrong or form has been tampered.
}
}
}
echo "</table>";
// Free result set
mysqli_free_result($result);
} else{
echo "No records matching your query were found.";
}
} else{
echo "ERROR: Could not able to execute $sql. " . mysqli_error($link);
}
// Close connection
mysqli_close($link);
?>
</table>
<textarea id="erreur" rows="20" cols="100"></textarea>
</form>
</div>
</body>
</html>
For a table with <table id="myTable">to get the first column value into a textbox which is defined as
<input type="text" placeholder="Customer Name" id="cus_name">
You can add the following js code.
<script>
var table = document.getElementById('myTable');
for(var i = 1; i < table.rows.length; i++)
{
table.rows[i].onclick = function()
{
document.getElementById("cus_name").value = this.cells[0].innerHTML;
};
}
</script>
Here the cus_name is the id of the text field while in the this.cells[0], the value 0 represents the first column. You can change it accordingly and also can add more columns with the code document.getElementById("cus_name").value = this.cells[0].innerHTML; by only changing the cell value and the textbox id.
Every row in your html table must correspond to an id in the login table.
you have to place somewhere in the row the id corresponding to that row. You can achieve this in many ways.
one way to do it is using a data-something attribute to put the id, for instance
<tr data-id="<?php echo $current_row['id']; ?>">
<td>column1</td>
<td>column2</td>
<td>etcetera</td>
</tr>
Once you have the data-id atttribute set you can access it via Javascript everytime a user clicks on the row. For this you need to capture the click event on the row. I'll show you an example using jQuery:
$('.myTable tr').click(function(){
let id = $('this').data('id');
console.log('id of selected row: ' + id);
});
Now the 'id' variable contains the id of the row the user selected (check console output to make sure the id is the one you expect). The next step would be to use that id to make a request to the server, via Ajax or via regular http request. If this works successfully i suggest you to research, or make another post to find out how to reload the page with the content with the data you want. Since the more specific a question is the higher is the chance that it will be answered
I want the second and third columns of my php table to be a hyperlink to a different page for each row. I need to pass 3 parameters to the hyperlink
1) The value from the first column - empID listed in the table below
2) The value from $weekStart - selected from a input type="date" at top of page
3) The value from $weekEnd - selected from a input type="date" at top of page
I am trying this syntax, but it is not passing in the parameters and I am getting a page not found error. How should this syntax be altered so that it passes all 3 params and navigates to the appropriate page?
Week Start:<input type="date" name="weekStart">
Week End:<input type="date" name="weekEnd">
<input type="submit" name="submit" value="View Employee Data">
<?php
if (isset($_POST['submit']))
{
$weekStart = $_POST['weekStart'];
$weekEnd = $_POST['weekEnd'];
//Generate Table Here
}
?>
foreach ($tsql as $res)
{
print "<tr>";
print "<td>" . $res->EmpID . "</td>";
print "<td>'.$Row['DailySales'].''" . $res->DailySales . "</td>";
print "<td>'.$Row['SalesForWeek'].''" . $res->SalesForWeek . "</td>";
print "</tr>";
}
You didn't append the string well. Please try the below code
foreach ($tsql as $res)
{
print "<tr>";
print "<td>" . $res->EmpID . "</td>";
print "<td><a href='DailySales.php?param1=".$weekStart."¶m2=".$weekEnd."¶m3=".$Row['EmpID']."'>".$Row['DailySales']."</a>" . $res->DailySales . "</td>";
print "<td><a href='WeeklySales.php?param1=".$weekStart."¶m2=".$weekEnd."¶m3=".$Row['EmpID']."'>".$Row['SalesForWeek']."</a>" . $res->SalesForWeek . "</td>";
print "</tr>";
}
If it still shows not found page, then please check the file names.
Update: I hope you need to replace some variables in your loop as updated in the below code
foreach ($tsql as $res)
{
print "<tr>";
print "<td>" . $res->EmpID . "</td>";
print "<td><a href='DailySales.php?param1=".$weekStart."¶m2=".$weekEnd."¶m3=".$res->EmpID."'>".$res->DailySales."</a></td>";
print "<td><a href='WeeklySales.php?param1=".$weekStart."¶m2=".$weekEnd."¶m3=".$res->EmpID."'>".$res->SalesForWeek."</a></td>";
print "</tr>";
}
Completely untested and I'm not 100% sure what the data in those links were supposed to be doing, but I think this should give you a solid starting point and you can tweak the HTML generation to get what you want.
I wouldn't bother trying to do it in PHP at all, pass the entire data set to JS and do it there.
Week Start:<input type="date" name="weekStart" id="weekStart">
Week End:<input type="date" name="weekEnd" id="weekEnd">
<input type="submit" name="submit" value="View Employee Data">
<?php
if (isset($_POST['submit']))
{
$weekStart = $_POST['weekStart'];
$weekEnd = $_POST['weekEnd'];
//Generate Table Here
}
// Create a JSON version of your data to pass to the script
$data = json_encode( $tsql );
?>
<!-- Create an empty table for your data-->
<table id="employee-table"></table>
<script>
$("#submitForm").on("click", function(e) {
// Stop the form from reloading the page
e.preventDefault();
// Set up your variables, you'll need to add ID's to the form inputs
var employees = <?php echo $data; ?>;
// See the employees data in your inspector console
console.log(employees);
var weekStart = $("#weekStart").val();
var weekEnd = $("#weekEnd").val();
// Generate the HTML for all the employees
var html = "";
for( var1=0; i<employees.length; i++ ) {
html += "<tr>";
html += "<td>" . employees[i].EmpID . "</td>";
html += "<td>" + employees[i].DailySales + "</td>";
html += "<td><a href='WeeklySales.php?param1='" + weekStart + "'¶m2='" + weekEnd + "'¶m3='" + employees[i].id +"'>" + employees[i].SalesForWeek + "</a></td>";
html += "</tr>";
}
// Insert the HTML that you generated into the table.
$("#employee-table").html(html);
});
</script>
The goal is to clear a field using a ON CLICK event which calls the java script function clear field(this.id)The clear field can then receive a new value. When the UPDATE button is pressed the database is updated with the new value. The clear field function succeeds in clearing the field, how can a new value be entered ?
<html>
<head>
<script src="JavaScript/getVal.js" type="text/javascript"></script>
</head>
<body>
Poll
<?php
$connection = mysqli_connect("localhost", "root", "");
mysqli_select_db($connection, "ukelection2015");
$rs = mysqli_query($connection, "select * from poll");
?>
<hr>
<table border=1 id="myTable">
<tr>
<th>Name</th>
<th>Value</th>
<th>Color</th>
<th></th>
<th> </th>
</tr>
<?php
$id = 0;
while ($row = mysqli_fetch_array($rs)) {
print("<form method= 'post' action= 'updatePoll.php'>");
for ($x = 0; $x <= 2; $x++) {
if ($x == 0) {
print("<tr>");
} else {
print("<td>" . $row['name'] . "</td>" . "<td id= '".$id."' value = '" . $row['value'] . "' onclick = 'clearField(this.id)'>" . $row['value'] . "</td>" . "<td>" . $row['color'] . "</td>" . "<td><a href = ''>Update</a></td>");
$x++;
if ($x == 1) {
print "</tr>";
}
$id++;
}
}
// this hidden field is used in updatePoll.php to get the party name to update (i.e. $name=$_POST['name'];)
/* print("<input type='hidden' name ='name' value={$row['name']}>"); */
print("<tr>");
// name
// value
// color
/* print("<td><input type='submit' value='Update' onclick='alertMsg()'/></td>"); */
print("</tr>");
print("</form>");
}
mysqli_close($connection);
?>
</table>
</body>
</html>
This is the javascript function
/*
* To change this license header, choose License Headers in Project Properties.
* To change this template file, choose Tools | Templates
* and open the template in the editor.
*/
function clearField(anId) {
document.getElementById(anId).innerHTML = 0;
}
You can pass the new value as a parameter while calling the clearField function. Then rather than setting the innerHTML to 0 in the function definition, you can set the innerHTML to the new value as document.getElementById(anId).innerHTML = newValue
This may be helpful
<script type="text/javascript>
function clearField(anId) {
document.getElementById(anId).innerHTML = 0;
}
</script>
Given that you create a for four each row, you can add the ID of the element that you want to modify as an hidden input and make the field that you want to change an textbox number. When you click update, just submit the form and update In the database.
I have a table that third column of it is checkboxe, and first two columns of it come from database
I want to send the wordID of words that checked:
$result = mysql_query("SELECT * FROM words");
echo "<table border='1'>
<tr>
<th>word</th>
<th>meaning</th>
<th>checking</th>
</tr>";
while($row = mysql_fetch_array($result))
{
echo "<tr>";
echo "<td>" . $row['word'] . "</td>";
$idd= $row['id'] ;
echo "<td>". "<div class='hiding' style='display:none'>".$row['meaning']."</div>"."</td>";
echo "<td>";
echo "<input class=\"box\" name=\"$idd\" type=\"checkbox\" value=\"\"> ";
echo "</td>";
echo "</tr>";
}
echo "</table>";
and in my function I have this:
function feedback(){
var boxes = document.getElementsByClassName('box');
for(var j = 0; j < boxes.length; j++){
if(boxes[j].checked) {
assign=1;
}
else{
assign=0;
}
$.ajax({
url: "assigner.php",
type: "POST",
data: { wordid: wordid, assign: assign}
}).done(function( e ) {
/*alert( "word was saved" + e );*/
});
}
}
I dont know how can I get WordId from the first part and use it in second part that I said
Just put another form element outside of the table, like:
<input type="hidden" value="[id]" name="wordid_name" id="worid_id" class="wordid_class">
You only have to replace [id] with the id of the row, then on Javascript you can call the attribute you prefer:
var wordid= document.getElementsByClassName('worid_class').value;
var wordid= document.getElementsById('worid_id').value;
var wordid= document.getElementsByName('worid_name').value;
Can make it outside for structure, just below var boxex.
I recommend you to create an Javascript object with the values of the checkboxes and then call just 1 time to Ajax.
Hope it helps you.
I've got a webpage that returns a dynamic number of rows from a mysql db, which is output to the webpage via table, of which the first column is a checkbox via the following code:
while($row = mysql_fetch_array($result))
{
$id = $row['circuit_id'];
echo "<tr>";
echo "<td align=\"center\"><input name=\"checkbox[]\" type=\"checkbox\" id=\"checkbox[]\" value=" . $row['circuit_id'] . "></td>";
if ($row['status_name'] == 'Disconnected') {
echo "<td><font color=\"red\">" . $row['status_name'] . "</font></td>";
} else {
echo "<td>" . $row['status_name'] . "</td>";
};
echo "<td>" . $row['circuit_name'] . "</td>";
echo "<td>" . $row['circuit_appID'] . "</td>";
echo "<td>" . $row['circuit_appID'] . "</td>";
echo "<td><img src=\"images/icons/application_edit.png \"></td>";
echo "<td><img src=\"images/icons/note_add.png \"></td>";
echo "</tr>";
}
echo "</table>";
below this data presentation, I've added a few HTML buttons (one of which is shown below) that will allow the user to do 'mass' updates on the shown data, in this particular case to change the status from one state to another via the checkbox selection.
echo "<table align=\"center\">";
echo "<tr>";
echo "<td>Set status to Migrated for selected records</td><td><img src=\"images/icons/application_edit.png \"></td>";
echo "</tr>";
echo "</table>";
Is there a way to get the list of checkboxes that have been selected without changing everything to forms, and using a simple html based button to submit the request to the server?
I've been looking for an online solution for something like this via javascript but haven't managed to find anything that matches what I need.
Thanks
I've tried to piece together a few bits and pieces to get where I need to be, but am not making much progress at all, here's the current code:
var obj = {}
$('#click').on('click', function() {
$('input[type="checkbox"]').each(function() {
var name = $(this).attr('id');
obj[name] = $(this).is(':checked') ? 1 : 0;
});
$.each(obj, function(key, value) {
alert(key + ' : ' + value);
});
console.log(obj);
});
how do I get the list of 'true' ie. ticked boxes into a string and update the button with a 'new' url?
Any help is appreciated...
jQuery has the option to select all checkboxes and submit them in the background via AJAX..
jQuery Selectors: http://api.jquery.com/category/selectors/
jQuery AJAX: http://api.jquery.com/jQuery.ajax/
Good luck and hope this helps you!