This may sound confusing, but I am unsure as where to start looking for an answer. This is the scenario: I have a webpage with a table created using PHP and inside each cell is a randomly selected word. What I would like to do is allow a user to click one of the cells and it would return the definition of the word, and refresh the table/page. From what I found so far was to make use of _POST/_REQUEST, however I am unsure how to find out what the user clicked, and pass that into a function to find the definition. Is my logic correct here, how would you go about this? I was thinking of having an onclick function to identify the element clicked, but don't know how to handle it.
<body>
<form method="post" action="
<table border="1">
<?php
$f="/words.txt"; //definitions also included in this file
$o=file($f);
$len=count($o);
$i=0;
while( $i < 18){
$rnum= rand(2,$len);
$rword= $o[$rnum];
$piece= explode(" ",$rword); //get just the word on the line
if($i%3==0){
echo "<tr>";
}
echo "<td id='$i' onclick='about()'>".$piece[2]."</td>";
$i++;
if($i%3==0){
echo "</tr>";
}
}
?>
</table>
</body>
</html>
The simplest thing you may done without need to any javascript is to make number forms equals to the number of cells you have. It is something like the following:
//Remove the form tag
<table border="1">
<?php
$f="/words.txt"; //definitions also included in this file
$o=file($f);
$len=count($o);
$i=0;
while( $i < 18){
$rnum= rand(2,$len);
$rword= $o[$rnum];
$piece= explode(" ",$rword); //get just the word on the line
if($i%3==0){
echo "<tr>";
}
?>
<td id='<?php echo $i; ?>'><form method="post"><input type="hidden" name="word" value="<?php echo $piece[2];?> /><input type="submit" value="<?php echo $piece[2];?> /></form></td>;
<?php
$i++;
if($i%3==0){
echo "</tr>";
}
}
?>
</table>
By this way you have a submit button for each word you have that submit its own form's hidden element with the name word to be precessed on the server side.
I suggest you to create a form that contains your word. Then you can simply specify action=”yourpagewithresponse.php” onclick="submit()" in the attributes of the form. In this way you don't need the submit button, you can simply click on the word. Obviously you can iterates the form creation in php language for having more word containers.
<form method="post" action=”yourpagewithresponse.php” onclick="submit()"><input type="hidden" name="word" value="<?php echo $piece[2];?>" /><?php echo $piece[2];?></form>
Related
I am trying to mark a table that the user selected in a form, but if he changes it while he still in the same form selection, I want the last marking disappear and the new one showing. However, I've tried several approaches and this one is not working, it won't mark anything but if I call only the select(x)function it marks every single one I choose without removing the last one. I'll be glad for some help or ideas for improving my code.
View Code
<select type="number" id="tnum2" name="num" style="display: none;" onchange="table_selection(this.value)">
<?php for ($i = 12; $i <= 23; $i++) : ?>
<option id="out" value="<?php echo $i; ?>"><?php echo $i; ?></option>
<?php endfor; ?></select>
JavaScript Code
function table_selection(x){
remove_selection(),
select(x);
}
function remove_selection(){
for(var i=2;i<34;i++){
document.getElementById(i).style.outline="none";
}
}
function select(x){
document.getElementById(x).style.outline="8px dotted #F2FF21";
}
I started learning webdeveloping and i tried to send "id" of one of the rows generated from database to another page. The rows are clickable thanks to the javascript code, so i can choose whichever row i want. The problem is, that even though the POST method seems right:
<form id="send" method="POST" action=<?php echo "secondpage.php?id=". $row['id']; ?> ></form>
// In inspect of the main page it gets the value.
However
second page always receive id value of 1. Doesn't matter if i click on the row with id=18 or any other. It will always recieve value of 1...
I heard that this could be a problem with javascript code which i put under PHP code.
Here is a code with PHP:
<div id="content">
<table id="usersTable" class="table table-bordered table-hover table-sm ">
<form action=http://localhost/dodawanie.php>
<input class="btn btn-primary" type="submit" value="Dodawanie">
</form>
<?php if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {?>
<tr>
<td><?php echo "id: ". $row['id']; ?> </td>
<td><?php echo "Name: ". $row["first_name"]; ?> </td>
<td><?php echo "Last: ". $row["last_name"];?> </td>
<form id="send" method="POST" action=<?php echo "secondpage.php?id=". $row['id']; ?> >
</form>
</tr>
<?php }
} else {
echo "0 results";
}
$conn->close();
?>
</table>
</div>
Here is javascript:
<script type = "text/javascript">
$(document).ready(function(){
$('#usersTable').find('tr').click( function(){
// alert('You clicked row ' + ($(this).index()+1) );
$('#send').submit();
});
});
</script>
I would gladly accept any help to find an error here.
Change the <form id="send" id value as unique
or use a class some thing like below:
<form class="form_send" then in your javascript search for the form_class inside the clicked tr:
$(document).ready(function(){
$('#usersTable').find('tr').click( function(){
$(this).find('form.form_send').submit();
});
});
Ids have to be unique. $('#send').submit() only finds and submits the first form with that id.
You could add your row id to the form's id attribute to make them unique for example.
I have seen some answers but I have not found anything that I want. I have a table with these rows:
while ($rown = mysql_fetch_assoc($resulti)){
echo "<tr style=text-align:center>";
echo "<td>".$rown['emri']."</td>";
echo "<td>".$rown['mbiemri']."</td>";
echo "<td>".$rown['dega']."</td>";
echo "<td>".$rown['id']."</td>";
echo "<td>".$rown['viti_shkollor']."</td>";
echo "<td><input type=text style= width:30px />"</td>";
echo "</tr>";
}
It works perfectly but I want to get the values of input type that user enters and then to put them in a mySql database. Also the table has a submit button as below so when the user completes all of the table inputs then press the submit and all of values go to the database.
<input type="submit" value="prano" name="prano" style="margin:0 auto;" />
It is difficult for me to get the value of input and to put it in a variable. I hope you understand my question. Please help me.
there are few points which you need to include:
1) add form in to your html
2) add name to all input box with in while
echo '<form action="test.php" method="post">';
while ($rown = mysql_fetch_assoc($resulti)){
echo "<tr style=text-align:center>";
echo "<td>".$rown['emri']."</td>";
echo "<td>".$rown['mbiemri']."</td>";
echo "<td>".$rown['dega']."</td>";
echo "<td>".$rown['id']."</td>";
echo "<td>".$rown['viti_shkollor']."</td>";
echo "<td><input name='custom[".$rown['id']."]' type=text style= width:30px />"</td>";
echo "</tr>";
}
echo "</form>";
So that now in test.php:
in $_POST[custom] you will get array of values of all input field custom.
I've been able to get my arrays working to echo text from a database in HTML. Fine. However, I now want to send this text to another page onClick (JQuery or JavaScript). So here is what I already have (I know it's not sending anything, but this is not the problem right now) :
PHP
$h = "SELECT * FROM table";
$h=$pdo->prepare($h);
$h->execute();
$i=1;
while ($row = $h->fetch()) {
$text[$i] = $row['content'];
$id[$i] = $row['id'];
$i++;
}
HTML
<h1 id="<?php echo $id[0]; ?>" onClick="edit(this)"><?php echo $text[0]; ?>
</h1>
<h2 id="<?php echo $id[1]; ?>" onClick="edit(this)"><?php echo $text[1]; ?></h2>
<p id="<?php echo $id[2]; ?>" onClick="edit(this)"><?php echo $text[2]; ?></p>
JavaScript
function edit(element) {
alert(element.id);
}
So, this gives me the "id" of the content in the database. However, I'd like to know if there is a way to get this information without having the "id" in the HTML tags, a way to click on the text and have the number that is inside the square brackets.
Example : you click on the text inside the "h1" tag and a pop up tells you what is the number in <?php echo $text[2]; ?>. In this case, I would like the number 2 to show up in the alert box, without using id="<?php echo $id[2]; ?>".
Other users have had similar problems about when they're looping rows of buttons but it's always because they accidentally reused the same Id or value. I'm experiencing the same problem, but all of my buttons are unique.
AJAX request
<script>
$(document).ready(function(){
$("#friendadd").submit(function(){
alert("checkpoint");
$.ajax({
type:"POST",
url:"getuser.php"
});
})
});
</script>
PHP and form
<form id="friendadd">
<?php
for($i=0; $i<$ctk->rowCount(); $i++){
echo "<img src='".$ctk_values[$i][6]."' alt='Blank' style='width:64px;height:64px'>";//PP, Later add clickable profile
echo "<th rowspan='3'>Attributes</th>";
echo "<tr> ".$ctk_values[$i][0]."</tr>";//UN
echo "<tr> ".$ctk_values[$i][1]."</tr>";//UL
echo "<tr> ".$ctk_values[$i][5]."</tr>";//UA
?>
<input type="submit" id="friend<?php echo $i;?>"><!--pass in this.value-->
</form>
<?php
}//Ends for loop
}
}
?>
Explanation: When I type in a username into the search box, it returns me three different users named rikesh1, rikesh2, and rikesh3. Each of them have a button next to them, with values friend0, friend1, friend2, respectively. When I click on the friend0 button, it successfully calls and updates the database. When I click the friend1 button, nothing happens. This is different from other users in that my buttons have unique Ids. Thanks for any and all help, I think this is a very fixable problem but after searching Stack, I'm still not sure what's happening.
<form id="friendadd">
<?php
for($i=0; $i<$ctk->rowCount(); $i++){
echo "<img src='".$ctk_values[$i][6]."' alt='Blank' style='width:64px;height:64px'>";//PP, Later add clickable profile
echo "<th rowspan='3'>Attributes</th>";
echo "<tr> ".$ctk_values[$i][0]."</tr>";//UN
echo "<tr> ".$ctk_values[$i][1]."</tr>";//UL
echo "<tr> ".$ctk_values[$i][5]."</tr>";//UA
?>
<input type="submit" id="friend<?php echo $i;?>"><!--pass in this.value-->
<?php
}//Ends for loop
?>
</form>
<?php
}
}
?>
Use this code instead.
The other one ends the form tag at the first loop.