Use jQuery and Javascript to alter inputs in dynamically created PHP table - php

I am trying to build a table using PHP and SQL values. One of those table columns is going to have a numerical input that controls other values in that row. This parameter ranges from 0 to 1 and I'm trying to use Javascript to dynamically update the three columns to the right of it depending on the parameter value.
Here is the PHP commands for the html table:
$i = 1;
while($row = mysql_fetch_array($result)){
Print "<tr>";
Print "<td><input id='toChange[$i]' name='toChange[$i]' type='number' step='0.01'
min='0.01' max='0.99' value='.85' </td>";
Print "<td>".$row['dependentOnParameter1'] . "</td>";
Print "<td>".$row['dependentOnParameter2'] . "</td></tr>";
$i++;
}
I have tried many different tags for the input cell, such as toChange[] and toChange$i (this one as if the number grows with the row number). This table prints correctly, and here is the jQuery function I have tried to implement:
$('#prEff[1]').change(function() {
var test = this;
return;
});
I know how to alter the table once I get this function to correctly call, but the use of an input inside an array seems to be causing trouble. Is there a specific jQuery object or tag that must be used for .change for arrays? Or if I can use the table tag, will the this pointer point to the part of the table that has been altered?

You probably need to escape the brackets if they are part of the selector:
$('#prEff\\[1\\]')

Related

How to enable onclick type events with the output of a mysqli_fetch_array($result))

I have been trying to get my head around how to approach this problem. I am writing a web page book library with the categories ('nodes') as MySQL records. I want to print the list of categories at each level, starting at the highest level, and then allow the user to select a category to travel deeper into the library. The PHP codes runs a saved procedure in MySQL:
//loop the result set
while ($row = mysqli_fetch_array($result)) {
if ($row[1] <> 0) {
echo $row[0];
echo "<br />";
} else { // the first row is just the heading
"</strong>Category: ";
echo $row[0];
echo " : <br />";
}}
Because there are only two test categories, this produces output:
Books :
Nature
Children's Books
However, I want to be able to create an onclick event over 'Nature' and 'Children's Books' so the user can select a category and drill down t the next level via a php function. I can convert the php output into html eg:
<?= "<p>{$row[0]}</p>" ?>
but I can't see how I can identify the row in an onclick event to pass a parameter to the function. Perhaps I need to have a completely different approach?
Add an onclick attribute to the element that calls a JavaScript function that does what you want.
<?= "<p onclick='someFunc({$row['id']})'>{$row[0]}</p>" ?>
Replace id with the actual name of the column containing the ID of the row in the table. someFunc() can use that ID to look up information in an array or object, or send an AJAX request.

how can i find the tr with specific id and these ids comming from database dynamically...?

I have data in the form of a table. The data is coming from a database. Each row is assigned a dynamic ID coming from the database.
How can I select that row with specific ID and then be able to style that whole row, using jquery?
This is the data coming from the database:
You can generate table rows dynamically using php
for( $database_rows as $row ){
echo "<tr id=\"{$row->id}\">" . _content_of_row_ ."</tr>";
}
Yes you can use jQuery to do that.
for example if your generated row be like below
<tr id="31"> .... </tr>
you can select the row like this
$("tr#31")
then you can add css class to it:
$("tr#31").addClass("selected")
remove css class from it:
$("tr#31").removeClass("selected")
add attributes to it:
$("tr#31").attr("attribute", "value")
or anything else.
Try this into foreach or similar loop:
<tr id="<?php echo $database_row_id; ?>">...</tr>
Where $database_row_id is the id you get from database

How to use a PHP classes array as a name of a select tag HTML

i want to use what we call a struct in C but using PHP, I know Here they are called classes, but i need to use that array of classes for a select tag name, I am doing this
<?php
class info_subject{
public $code_su;
public $time_su;
public $selecction_su;
}
$subjects= new info_subjects();
$i=0;
//THE DATABASE CONNECTION WORKS FINE, I IGNORED CODING ABOUT DATABASE BECAUSE THAT'S NOT THE
//PROBLEM, JUST FOCUS IN THE STATEMENT OF THE ARRAYS IN THE TAGS NAMES PLEASE
while($line = pg_fetch_array($result, null, PGSQL_NUM))//getting some stuff from postgrest
{
echo "$line[0]";//I am printing this
echo "$line[1]";//I am printing this
//here i am creating selects in every loop with some options, and i want to save the
//result of the selection in the field code_su of the array of classes
echo "<select name=$subjects[$i]->code_su>";
echo "<option value='hola'>hola</option>";
//here i am creating checkbox in every loop, and i want to save the
//result of the checkbox in the field selection_su of the array of classes
echo "<input type='checkbox' name=$subjects[$i]->selection_su>";
$i++;
}
?>
The problem is that it is not working, i think i am making a mistake with the statement in the names of the inputs and the selects, like i said before, i need a classes array.
The problem is that youre not adding the vars properly (nor the quotes). Try with:
echo "<select name=\"".$asignaturas[$i]->codigo_as . "\">";
and
echo "<input type='checkbox' name=\"".$asignaturas[$i]->seleccion_as."\">"
Regards.
1) You are echoing HTML wrong (missing ': echo "<select name='{$asignaturas[$i]->codigo_as}'>";
2) Your $asignaturas is not an array. It's only single class. Use it like this: echo $asignaturas->coding_as;
3) (as side note) By standarts, class names is CamelCases and it's name is same as file name.
It seems like you are trying to use the class itself as an array which can not be done.
Put in an constructor to define some of your variables here:
class info_asignatura{
public $codigo_as;
public $periodo_as;
public $seleccion_as;
function __construct(){
$this->seleccion_as = array();
}
}
The change this statement to:
echo "<input type='checkbox' name=$asignaturas->seleccion_as[$i]>";
Although, I fear this will not do the trick for you. Because every time this page is loaded, seleccion_as will be defined as an array when the class is constructed. This will overwrite anything previously declared.
What you will need to obtain your goal is to implement sessions to your code.

HTML Numerical Input Bug: infinite loop when jquery.change event called

I created an HTML table with PHP as follows:
$i = 1;
while($row = mysql_fetch_array($result)){
Print "<tr>";
Print "<td><input id='prEff[$i]' type='number' step='0.01' min='0.01' max='0.99' value='.85' </td>";
Print "<td>".$row['ErdEfficiency'] . "</td>";
Print "<td>".$row['TheoreticalSEC'] . "</td></tr>";
$i++;
}
The input cell has a jquery.change function that is called when the number is changed within the range. During debugging, clicking the up or down button once (in chrome) causes the input to run through all values until the upper or lower limit is reached. So the function is called, but only after the whole range of values is run through.
If the page is refreshed without debugging, the jquery is called, but the button sticks since it is experiencing the bug as described.
Here is the simple jquery function:
$('[id^="prEff["]').change(function (){
var test = this;
alert("hi");
});
Its been a difficult bug to track, and I'm not sure what is causing it. It has occurred with an onchange attribute in the input, as well as a javascript eventListener, and jquery change. It may be the way the PHP is printing the input but I've tried a couple different ways without success.
It seems like you have an unclosed <input> tag in your code. Make sure you close it and you should be fine:
Print "<td><input id='prEff[$i]' type='number' step='0.01' min='0.01' max='0.99' value='.85' /> </td>";

Dynamic texbox modification with ajax/php/javascript

I have two tables. company_details and company_specials. Each company_details can have multiple specials. I display the company details at http://eurothermwindows.com/ed/admin.php
The first row and fourth row that has the 0 in the active column is from company_details and the rows below are from company_specials.
Currently the code allows for dynamic modification of the company_details rows as denoted by the compid in that table. However i would like to have the rows below it to be dynamically modified as well but it's using the same compid and i'm not sure how to separate them in the code.
Code below is the code being generated for the company_specials. I need a way to uniquely identify each row and be able to modify it.
http://pastebin.com/RAe9iwAP
Could somebody provide some guidance please? I'm thinking that i would probably need to uniquely identify each of the specials within the company_specials or set some sort of pointers?
Q.I need a way to uniquely identify each row
A. you already are doing so;
<tr id="<?php echo $compid; ?>"
Q. and be able to modify it.
A. add a input button before the end of each row, that onclick="edit(<?php echo $compid; ?>)" and launches the editing cycle based on the $compid for that row.
Then using Javascript you can extract the contents of all the <td></td> within the row by the $compid in the tr like this;
var originalString = "<tr>" + document.getElementById(compid).innerHTML + "</tr>";
var targetArray = [];
$(originalString) /*.find("tr")*/ .each(function(index, tr) {
targetArray = $("td", tr).map(function(index, td) {return $(td).text();});
});
all of the <td> contents will be in targetArray variable accessible to be put into a form for editing like so;
document.getElementById("forminputid").value = targetArray[1];

Categories