I have a PHP script that generates table rows with hidden input tags that have names like title1, title2 etc and price1, price2 etc. The user has the ability to remove and add rows as they see fit. My question is when I submit the rows how can I read those hidden inputs in order, either through PHP or Javascript?
EDIT: Sorry about the lack of detail. Here's some code:
The PHP that generates the rows
$result = mysql_query("SELECT * FROM `table`");
$i=0;
while ($list = mysql_fetch_array($result))
{
$i++;
$title = $list['title'];
$price = $list['price'];
$plu = $list['plu'];
?>
<tr id="row<?php echo $i; ?>"><td><input type="hidden" name="title<?php echo $i; ?>" value="<?php echo $title; ?>"></td></tr>
<tr><td><input type="hidden" name="price<?php echo $i; ?>" value="<?php echo $price; ?>"></td></tr>
<tr><td><input type="hidden" name="plu<?php echo $i; ?>" value="<?php echo $plu; ?>"> </td></tr>
<?php
}
?>
Now if users can remove rows, I know I can tell exactly how many rows there are, but when it comes time to read them and save them in order I'm lost.
I'm not sure you're guaranteed to get them in order based on location on the page, but since you can name the elements yourself, you could name them title[1], title[2], ...
For example:
<input type="hidden" name="title[1]" value="foo">
...
<input type="hidden" name="title[2]" value="bar">
This will allow you to access the submitted elements in PHP by, for example:
$_POST['title'][1], $_POST['title'][2], etc.
You can use only one or two (for title and price) hidden input rather separate inputs for each values...all you need to do is use some special characters like ';','#' as a delemeter to seperate each values.. and when user delete the row just remove that value from the entire string....you can do it easily using javascript..
so ultimately you will have to submit only one (or two) hidden values...
Related
I'm trying to submit multiple buttons and use them as range selectors.
In page1.php I have $array of years 1980, 1990, 2000, 2010, ... which range is updated by database content:
<form method="post" action="page2.php">
<?php
foreach ($array as $item) {
?>
<input type="submit" name="<?= $item ?> " class="button" value="<?= $item ?> " />
<?php
}
?>
</form>
this way I can't click two buttons one after another to set the range, for example from 2000 to 2010, and submit only after this action.
I've tried JavaScript function with onclick without the post method, which counts clicks and pushes two (first and second) clicks values as range to the resettable $rangeval array before if (count == 2) condition comes true, passing values to second JavaScript function request(input) from page1.php using ajax, requesting page2.php with if (isset($_POST['val1']) && isset($_POST['val2'])) and echo json_encode($array);, which returns an array as the result variable with JSON.parse(res) back to page1.php.
As PHP runs on the server, I can't process the JavaScript Ajax response array as PHP array in page1.php.
So, I'm trying to find some correct method to archive this result.
Any advice, guide, or example would be useful.
Buttons in a form and with type="submit" will immediately submit the form. So buttons are not the correct candidate here.
I would recommend using two <select> elements where in you loop over the $array to create the options.
<form method="post" action="page2.php">
<select name="range_start">
<?php foreach ($array as $item) : ?>
<option value="<?= $item ?>"><?= $item ?></option>
<?php endforeach; ?>
</select>
<select name="range_end">
<?php foreach ($array as $item) : ?>
<option value="<?= $item ?>"><?= $item ?></option>
<?php endforeach; ?>
</select>
<input type="submit" class="button" value="Submit values" />
</form>
When submitting read out the name attributes that the <select> elements have in the $_POST array.
<?php
if (isset($_POST['range_start']) && isset($_POST['range_end'])) {
$range_start = $_POST['range_start'];
$range_end = $_POST['range_end'];
}
let's say I have a code like that:
<div id="stuff<? echo $dynID; ?>" class="bla">
<form id="myform<? echo $dynID; ?> " action="bla.php">
<input name="iname<? echo $dynID; ?>" value="<? echo $row[1]; ?>">
</form>
</div>
<div id="stuff<? echo $dynID; ?>" class="bla">
<form id="myform<? echo $dynID; ?> " action="bla.php">
<input name="iname<? echo $dynID; ?>" value="<? echo $row[1]; ?>">
</form>
</div>
<div id="stuff<? echo $dynID; ?>" class="bla">
<form id="myform<? echo $dynID; ?> " action="bla.php">
<input name="iname<? echo $dynID; ?>" value="<? echo $row[1]; ?>">
</form>
</div>
Many forms. In this example 3. (It could be more or less)
How can I trigger this form (to send ist with AJAX)? This form is live-AJAX generated content and have a dynamic ID. I did not now the specific ID of the form to trigger like:
$("#myform").submit(function(event) {
How, can I handle this?
We could use some more information to help further, for example, is the text in this form (any of it) unique when compared to other forms? You can target it by basically anything and even combine these conditions. For example, if the action attribute is unique you could always do something like this (untested):
//if the form id starts with 'myform', perform a function on submit
$("form[id^='myform']").submit(function(event) {
//if that form's 'action' attribute is 'bla.php', then do something
if($('form').attr('action', 'bla.php')){
//your code here
}
});
EDIT:
Is this unique enough to snag it? I've made it rely on the div above it having an id that starts with 'stuff', that div must also have class 'bla' and the form attribute of 'action' must be 'bla.php'
$("div[id^='stuff'] form[id^='myform']").submit(function(event) {
if($(this).parent().hasClass('bla')) {
if($(this).attr('action', 'bla.php')){
//your code here
}
}
});
I'm working on a project of a website which shows a chart. User should be able to change a displayed chart (without changing the website) by clicking one of 'Available sensors' from dropdown options. Dropdown connects to MySQL database with used sensors. The sensor's id is assigned to HTML-input ID and its name is assigned to input value.
My intension is to use sensor ID in another data.php file which is responsible for connecting to tables (MySQL) with data collected by sensors. This ID would tell to which of the tables this programm should connect.
At the moment JS script's task is to alert an ID of the chosen sensor when it's clicked on the dropdown menu. Instead of a number I get a message saying 'undefined'. Eventually it would transfer the stored id to the mentioned data.php file.
Could you please tell me whether it's necessary to use AJAX in this case or what's a possible reason of this error in my code?
I also tried to use button insted of input. When clicking on sensors names on dropdown I've received only messages with '1'. However assigning sensorName worked out in both cases. Sensors ID is stored as INT, name as VARCHAR in MySQL table.
Thank you in advance for your help :)
<div id="header_btn" class="dropdown">
<input type="submit" id="btn" value="Available sensors" class="btn btn-success" />
<div class="dropdown-content">
<?php
include("config.php");
$sql = "SELECT * FROM sensors";
$result = $db->query($sql);
if($result->num_rows > 0){
while($row = $result->fetch_assoc()){
$sensorID = $row["id"];
$sensorName = $row["WebName"];
?>
<input onclick="changeSensorID(this.value)" onmouseover="this.style.textDecoration='underline'" onmouseout="this.style.textDecoration='none'" class="btn_drop" id="<?php echo $sensorID ?>" value="<?php echo $sensorName ?>" /></a>
<?php
}
}
?>
</div>
<script>
function changeSensorID() {
var sensorID = document.getElementsByClassName("btn_drop").id;
alert(sensorID);
};
</script>
</div>
please check this code, working fine
<input type="submit" id="btn" value="Available sensors" class="btn btn-success" />
<div class="dropdown-content">
<?php
include("config.php");
$sql = "SELECT * FROM sensors";
$result = $db->query($sql);
if($result->num_rows > 0){
while($row = $result->fetch_assoc()){
$sensorID = $row["id"];
$sensorName = $row["WebName"];
?><input onclick="changeSensorID(event)" onmouseover="this.style.textDecoration='underline'"
onmouseout="this.style.textDecoration='none'" class="btn_drop" id="<?php echo $sensorID ?>"
value="<?php echo $sensorName ?>" /></a>
<?php
}
}
?>
</div>
<script >
function changeSensorID(event){
var sensorID = event.target.id;
alert(sensorID);
}
</script>
</div>
getElementsByClassName returns array of at least one item if found any. You have to provide index of element that you want to use.
Example
var sensorID = document.getElementsByClassName("btn_drop")[0].id;
I am attempting to create a way to search for a user by typing their name in a text field, then changing a list below. The easiest way I saw to do this way by using a datalist but it seems that a datalist's search go off the value and not the html of the element.
Is it possible to change the search from looking at the value to the html?
Context:
<input class="mrg-btm" type="text" placeholder="Search..." list="users" />
<datalist id="users" name="formSec" required>
<?php
$get = $users->prepare("SELECT userID,userFirst,userLast FROM users");
$get->execute();
$get->store_result();
$get->bind_result($userID,$userFirst,$userLast);
while($get->fetch()) {
?>
<option value="<?php echo $userID; ?>"><?php echo $userFirst. ' ' .$userLast; ?></option>
<?php
};
$get->close();
?>
</datalist>
As you can see, I am assigning the userID to the value and not the name, I would like to be able to search for the name of the user without having to put it as the value, is this possible?
You can make up attributes in HTML5 by prefixing them with data-. So in your case you need to do it like this:
<option value="<?php echo $userID; ?>" data-userFirst="<?php echo $userFirst ?>" data-userLast="<?php echo $userLast ?>"><?php echo $userFirst. ' ' .$userLast; ?></option>
Now you can use javascript to get the vlues of the attributes.
Im pulling out table information from a mysql db:
I need the buttons to select the information shown into a textfield, the below code works perfectly for the mobile_number but does not work for serial_number. both field types are varchars.
php to pull out info and html button
<?php while ($row = mysql_fetch_array($query)) { ?>
<td><?php echo $row['serial_number']; ?><input type="button" value="select" onclick="button(<?php echo $row['serial_number']; ?>)" /></td>
<td><?php echo $row['mobile_number']; ?><input type="button" value="select" onclick="button1(<?php echo $row['mobile_number']; ?>)" /></td>
text fields
<input type="text" id="textfield"/>
<input type="text" id="textfield2"/>
JS for the buttons
function button(text) {
$("#textfield").val(text);
}
function button1(number) {
$("#textfield2").val(number);
}
Thank you for your help in advance.
You should wrap text inside quotes, e.g.
onclick="button('<?php echo $row['serial_number']; ?>')"
Same for mobile (it works probably only because it's a number)
I would check if the column names being returned are the same as the ones you are referencing. Apart from that, use quotes, like #sebapalus suggested, and use the improved functions sqli