How do I call and execute an HTML select from within my PHP code?

jxfish2 · September 16, 2013

I am calling hundreds of records from a MySQL database.

Each record has been formatted to fit on a single line, formatted using HTML, so that the output appears neat and clean.

For each record that is displayed, I want to include a drop-down box, at the beginning of the line, that will allow a user to update the current status for that particular record.

Essentially, there will be a drop-down box for each and every row.

The data is retrieved from the database, and stored in an array.

For each line or record read in, the HTML select statement needs to be called, and the resulting values need to be displayed in the drop-down box, in column 1 of the output. (I may need a submit button to be included for each line, but I'm not sure at this point.)

To be honest, I'm new to PHP and HTML, but I've been shell scripting for years.

Once the values in the Select box have been changed, a SQL UPDATE command needs to be run against the MySQL database, for each record that's been changed.

All of the code, to include SQL queries, loops, arrays, and HTML page formatting, are already in place, and working as intended.

The only piece remaining, is the dropdown box, for each record, and the SQL UPDATE calls. (I know how to write the SQL UPDATE commands, I just don't know how to call them from this dropdown box.)

I found numerous examples of how to call PHP from within HTML, but have not found any examples of how to call a from within my PHP code.

I'm not very good with java script, but I do know how to call an external java script. The issue is that I need the dropdown box to appear in the array, as if it were just another data field in my output display.

I've searched numerous boards, but nobody has posted anything close to what I need at this point.

Note, that of the hundreds of records that are displayed, the user / viewer may only update 2 or 3 rows on the entire display.

The purpose of this webpage, is to give our 3rd party vendor a place where they can provide a very very simple way to update the status of assets that we're tracking!

It's either this, or we sit for hours on phone calls, manually transcribing the status changes on hundreds of assets.

I tried using 2 different PHP function calls, but I really don't know if my syntax is correct:

//function dropdown() //{ //<html> //<body> //echo "<td>" . <select> //<option value='2'>Abandoned</option> //<option value='3'>On Hold</option> //<option value='4'>Provider Input Requested</option> //<option value='5'>Working</option> //<option value='6'>Complete - Not Yet Delivered</option> //<option value='7'>Complete - Delivered</option> //</select> . "</td>"; //</body> //</html> //}

And, a second function call:

//function dropdown() //{ //<form method="post" action"update_status.php"> //<select name="update_status"> //<option value="2"> Abandoned </option> //<option value="3"> On Hold </option> //<option value="4"> Provider Input Requested </option> //<option value="5"> Working </option> //<option value="6"> Complete - Not Yet Delivered </option> //<option value="7"> Complete - Delivered </option> //</select> //<INPUT type="submit" name="submit" /> //</form> //}

Note: Neither of the above function calls produced any output. The page would not display in either case.

Here's the array initialization, and where I build my HTML input. I'm reading in the data, one line at a time:

while($row = mysqli_fetch_array($result)){ echo "<tr>"; //dropdown //NOTE: This is the point in the HTML row, where I want to insert the drop-down box. echo "<td>" . " " . $row['field_1'] . " " . "</td>"; echo "<td>" . " " . $row['field_2'] . " " . "</td>"; //NOTE: The current status is displayed in the 3rd column, and will need to change, if a new selection is made, within the drop-down box. if ($row['status_id'] == "1") { echo "<td>" . " " . "No Update Available" . " " . "</td>"; } elseif ($row['status_id'] == 2) { echo "<td>" . " " . "Abandoned" . " " . "</td>"; } elseif ($row['status_id'] == 3) { echo "<td>" . " " . "On Hold" . " " . "</td>"; } ... Continued

IS IT EVEN POSSIBLE TO CALL AN HTML SELECT OPTION FROM WITHIN PHP?

Any help, suggestions, examples, would be greatly appreciated.

Thanks in advance, and have a great week.

jxfish2

justsomeguy · September 16, 2013

The functions aren't formatted correctly, you have HTML markup sitting where it expects PHP code. If you want to output HTML then you can either echo a string of HTML markup from PHP, or end the PHP block, add the HTML block, and start the PHP block again. HTML markup is not valid PHP code, just writing HTML markup in the middle of a PHP section is going to be a syntax error because it is expecting PHP code, not HTML markup.

You have a couple options. One option is to use a traditional form, where you either make each row its own form or make the entire page a single form, with a traditional submit button. They change the values, press the submit button, and it sends the data to the server and reloads the page.

Your other option is to use ajax. Ajax uses Javascript to send a request to the server in the background, so the page doesn't have to refresh. You can either trigger the ajax request as soon as they change the dropdown if you put an event handler on each select element, or you can have a button that triggers the ajax request if you put a click handler on the button element.

Either way, you'll be submitting form data to a PHP script. Each select element would need a database ID or some other reference so that the PHP script knows which row to update. You'll want to look into handling form submissions with PHP, regardless of which option you choose the PHP script will basically be the same thing, it will just see a request with form data that it will need to process (e.g., get the request data and process it to update the database).

jxfish2 · September 17, 2013

Thanks JustSomeGuy.

I'm going to try inserting the echo statements first, as that's how I'm currently inserting my "other" html formatted output.

Here's what I tried to insert:

while($row = mysqli_fetch_array($result)) { echo "<tr>";

echo "<td>"; echo "<select name="update_status">"; echo "<option value="2">" . "Abandoned" . "</option>"; echo "<option value="3">" . "On Hold" . "</option>"; echo "<option value="4">" . "Provider Input Requested" . "</option>"; echo "<option value="5">" . "Working" . "</option>"; echo "<option value="6">" . "Complete - Not Yet Delivered" . "</option>"; echo "<option value="7">" . "Complete - Delivered" . "</option>"; echo "</select>"; echo "</td>"; echo "<td>" . " " . $row['alt_code'] . " " . "</td>"; ### Next output field, which is working correctly.When I insert the above code, nothing is displayed on the screen. It's just blank.

If I take it out, the page is generated as intended, formatted beautifully, to fit the screen.

I also tried inserting the same code as follows, with the same results:

echo "<td>" . "<select name="update_status">" . "<option value="2">" . "Abandoned" . "</option>" . "<option value="3">" . "On Hold" . "</option>" . "<option value="4">" . "Provider Input Requested" . "</option>" . "<option value="5">" . "Working" . "</option>" . "<option value="6">" . "Complete - Not Yet Delivered" . "</option>" . "<option value="7">" . "Complete - Delivered" . "</option>" . "</select>" . "</td>";

echo "<td><select name="update_status"><option value="2">Abandoned</option><option value="3">On Hold</option><option value="4">Provider Input Requested</option><option value="5">Working</option><option value="6">Complete - Not Yet Delivered</option><option value="7">Complete - Delivered</option></select></td>";

-------------------

You noted above that I could break out of the php code, long enough to insert the html select code.

I'm in the middle of a PHP loop, where all environment variables have been initialized for this particular record.

If I exit from the PHP code at this point, won't I lose the variables that were initialized inside of the loop?

jxfish2 · September 17, 2013

I would assume that I can not break out of the PHP code, without losing both the initialized variables, and without exiting from the loop.

Instead of displaying the data direct to the monitor, I could build an external flat file, with HTML markup in it, then display the HTML page in the DIV.

Unless you have some additional suggestions, I'll try that next... Build a flat file with the HTML markup in it, then call PHP to submit the database updates for those rows where the select box was called and changed.

justsomeguy · September 17, 2013

If the page is blank then it sounds like the server is set up to not display errors, it's probably putting them in an error log somewhere. Your web directory might have an error log file in it that you can check for PHP error messages. The problem with your code above is that you have double quotes inside double quotes that are not escaped. Instead of this:

echo "<select name="update_status">";

it would need to be this:

echo "<select name="update_status">";

You can also use single quotes instead:

echo '<form method="post" action"update_status.php"><select name="update_status"><option value="2"> Abandoned </option><option value="3"> On Hold </option><option value="4"> Provider Input Requested </option><option value="5"> Working </option><option value="6"> Complete - Not Yet Delivered </option><option value="7"> Complete - Delivered </option></select><INPUT type="submit" name="submit" /></form>';

or a heredoc:

echo <<<HTML<form method="post" action"update_status.php"><select name="update_status"><option value="2"> Abandoned </option><option value="3"> On Hold </option><option value="4"> Provider Input Requested </option><option value="5"> Working </option><option value="6"> Complete - Not Yet Delivered </option><option value="7"> Complete - Delivered </option></select><INPUT type="submit" name="submit" /></form>HTML;

or just break out of PHP, anything outside of a PHP block is output that gets sent straight to the browser:

?><form method="post" action"update_status.php"><select name="update_status"><option value="2"> Abandoned </option><option value="3"> On Hold </option><option value="4"> Provider Input Requested </option><option value="5"> Working </option><option value="6"> Complete - Not Yet Delivered </option><option value="7"> Complete - Delivered </option></select><INPUT type="submit" name="submit" /></form><?php

You could use a PHP block to just output a variable also:

http://www.php.net/manual/en/language.types.string.php

If I exit from the PHP code at this point, won't I lose the variables that were initialized inside of the loop?

No, the next PHP block will still have everything defined like it was. Stepping out of a PHP block doesn't affect PHP, it just sends output to the browser. It's the same as echoing a block of text. e.g.:

for ($i = 0; $i < 10; $i++) {?><div>The value of $i is <?php echo $i; ?>.</div><?php}

jxfish2 · September 17, 2013

Thank you very very much...

The primary webpage is EXACTLY what I was looking for...

Now, having said that, when I click on the "Update" button, my page goes blank...

Here's the code that I just inserted in the basic webpage:

echo "<td>"; echo '<form method="post" action="/update_status.php"> <select name="update_status"> <option value="2"> Abandon </option> <option value="3"> On Hold </option> <option value="4"> Provider Input Requested </option> <option value="5"> Working </option> <option value="6"> Complete - Not Yet Delivered </option> <option value="7"> Complete - Delivered </option> </select> <INPUT type="submit" value="Update" /> </form>'; echo "</td>";

Here's the code I put inside of the "update_status.php" script:

<?php

$con=mysqli_connect("x.x.x.x","user","passwd","DB_Instance");

// Check connection if (mysqli_connect_error()) { echo "Failed to connect to MySQL: " . mysqli_connect_error(); }

$date = date("Ymd");

$status = $_POST["update_status"]; $alt = $_POST["alt"];

mysqli_query($con, "UPDATE ...tablename... SET status_id='$status', mod-date='$date' WHERE alt_code='$alt'");

mysqli_close($con);

?>

Again, when I click on the "Update" button, the screen goes blank, as if it's redirecting me to a new page.

How can I execute the above UPDATE command, without leaving the current webpage?

Is this possible?

JCF

Edited September 17, 2013 by jxfish2

justsomeguy · September 17, 2013

You'll need to use ajax for that. You use Javascript to send a request to the server in the background. Ajax is a big topic, if you look it up there will be plenty of information. The basic steps are to create a new request object, set a callback function for it that will get executed each time the request status changes (including when it's finished, for post-processing), format the post or get data to send to the server, and send the request. The callback function will be executed and you'll have access to the response from the server, so you can have PHP output messages that would indicate success or failure, check for those messages in the callback function, and do whatever else you want to do if the request failed or succeeded.

jxfish2 · September 17, 2013

I really appreciate your help...

I created some java script code, and I'm attempting to feed values to the java script file, from my php / html document.

I'm getting an error, and as this is very very new to me, I'm not sure of what to do.

I've been searching w3Schools, stack overflow and google, but have not come across the answers that I need yet.

So, I'm coming back to ask for your assistance one more time.

Here's my current select statement:

echo "<td>"; echo '<form method="post"> <select name="update_status"> <option value="2"> Abandon </option> <option value="3"> On Hold </option> <option value="4"> Provider Input Requested </option> <option value="5"> Working </option> <option value="6"> Complete - Not Yet Delivered </option> <option value="7"> Complete - Delivered </option> </select> <INPUT type="button" value="Update" onclick="func_UpdateOldAssets(update_status)"></INPUT> </form>'; echo "</td>";

I have no real idea of how to reference the java script from within the html body, but here's what I've tried so far:

<HEAD><TITLE>Old Asset Tracking</TITLE> <script type="text/javascript" src="functions.js"></script></HEAD>

NOTE: I only tried the above, as I need to pass two distinctly different variables to the functions.js parser.

And finally, here's the first few lines of code from the functions.js parser:

function func_UpdateOldAssets(update_status){ var formdata=document.getElementById(update_status).value; alert(formdata);

I'm getting the following error message:

var formdata=document.getElementById(update_status).value;

SCRIPT5007: Unable to get property 'value' of undefined or null reference

I've never tried to pass data to the java script parser from a drop-down box before, and don't know why I'm getting the undefined value error.

It appears as if the "update_status" variable isn't being initialized, or not being sent to the java script parser.

Another issue is that I also need to send 2 variables to the java script parser, but I don't know how to do that, and none of the references that I've checked so far, give any examples of how to do this.

Your help is greatly appreciated.

Thanks in advance, and have a great day.

JCF

Edited September 17, 2013 by jxfish2

justsomeguy · September 17, 2013

First, this line:

onclick="func_UpdateOldAssets(update_status)"

is going to try and pass a variable called update_status. If you want to pass the string "update_status" then you need to put it in quotes:

onclick="func_UpdateOldAssets('update_status')"

Second, you're trying to use document.getElementById but update_status is not an ID, it's a name. You'll need to give each select element a unique ID and pass the ID to the function.

You'll also need to make that onclick handler return false to cancel the default action (the click event, which would submit the form normally):

onclick="func_UpdateOldAssets('update_status'); return false;"

Another issue is that I need to send 2 variables to the java script parser, but I don't know how to do that, and none of the references that I've checked so far, give any examples of how to do this.

I'm not sure what you're referring to by "parser". The browser's Javascript engine does all of the parsing of Javascript code. If you're referring to the function, you just separate the variables with commas.

thescientist · September 17, 2013

I see a lot of them here

https://www.google.com/search?q=call+function+on+dropdown+change+javascript&oq=call+function+on+dropdown+change+javascript&aqs=chrome..69i57j0l2.7716j0&sourceid=chrome&ie=UTF-8#q=call+function+on+dropdown+onchange+javascript&safe=off

(second link, accepted answer for a nutshell version)

The basic idea is that you want to assign an onchange event handler to the dropdown menu, so that each time an option gets selected, it calls a function. This function would get the currently selected option, get the value/name, etc whatever you need from it, and then create the XMLHttpRequest object, and make the request to your PHP script.

jxfish2 · September 18, 2013

Sorry, but I'm back again.

I'm still having one big issue.

I've been trying all day to figure it out on my own, but have had no luck.

Here are some of my code snippets:

while($row = mysqli_fetch_array($result)) { echo "<tr>"; $alt=$row['alt_code']; echo "<td>" . " " . $alt . " " . "</td>";

The above array initialization is working just fine, as intended.

I substituted the actual variable "$alt" in the echo command, just to make sure a valid value was being declared.

Here's the current <SELECT> statement, which on the surface, also looks like it's working as intended. At least it's displaying correctly on the webpage:

echo "<td>"; echo '<form method="post"> <select name="update"> <option value="2"> Abandon </option> <option value="3"> On Hold </option> <option value="4"> Provider Input Requested </option> <option value="5"> Working </option> <option value="6"> Complete - Not Yet Delivered </option> <option value="7"> Complete - Delivered </option> </select> <INPUT type="button" value="Update" onclick="func_UpdateOldAssets($alt,$value); return false;"></INPUT> </form>'; echo "</td>";The issue I'm having, is that the variable "$alt", and the variable initialized by the select drop down box, both need to be passed to the JS Function.

Neither of these two variables is being passed to the JS Function!

Here's the first few lines from my JS Function:

function func_UpdateOldAssets() { alert("Update equals " + 'this.value');

var formdata=document.getElementById(this.value).value;

When I run the script, and select the drop down value that I want, here's what I get as output:

Error: '$alt' is undefined

If I change the variables in the INPUT line as follows:

A successful call to the JS Function returns the following values:

Update equals this.value

In short, I can't get the 2 variables that I need to pass to the JS Function to work.

I believe once I get the variables to the JS Function, I can finish the rest on my own.

But, I've been "playing" / "experimenting" all day today, and still haven't hit on the magic button...

If you could help with this one last piece, I believe I can finish the rest on my own.

Thanks in advance, and have a great day.

JCF

justsomeguy · September 18, 2013

It explains on the PHP manual that single-quoted strings do not expand variables. When you use $alt in the single-quoted string it does not use the value of the $alt variable, it uses the string "$alt". If you looked at the HTML source code in the browser then you would see the text "$alt" there.

If you want to use the value of alt then just concatenate that variable with the string:

...onclick="func_UpdateOldAssets(' . $alt . ',' . $value . '); return false;...

If those variables have strings in them then you also need to surround those values with quotes so that when that HTML code gets printed, the values have quotes around them. String values need to be quoted. For this:

alert("Update equals " + 'this.value');

You are telling it to alert the string "this.value", because you have it in quotes. Remove the quotes if you want the value property of the this object.

You should also define that function to take 2 parameters, or else you'll need to refer to them as arguments[0] and arguments[1]. The arguments array inside a Javascript function contains all of the arguments that were passed to the function.

jxfish2 · September 24, 2013

Hi Guys,

I really appreciate the help you've given so far, but I still can't seem to make it work.

Here's my code snippets:

Inside of the PHP script:

<HTML>

</HEAD>

<?php

......... Some code that doesn't pertain to this issue.........

$result = mysqli_query($con, "select * from tbl_vms order by alt_code");

while($row = mysqli_fetch_array($result)){echo "<tr>";

$alt = $row['alt_code'];echo "<td>" . " " . $alt . " " . "</td>"; //echo "<td>" . " " . $row['alt_code'] . " " . "</td>";

?>

<form method="post"> <select name="stat"> <option value="2"> Abandon </option> <option value="3"> On Hold </option> <option value="4"> Provider Input Requested </option> <option value="5"> Working </option> <option value="6"> Complete - Not Yet Delivered </option> <option value="7"> Complete - Delivered </option> </select> <input type="button" value="Update" onclick="func_UpdateOldAssets(' . $alt . ',' . $stat . '); return false;"></input> </form>

<?php

Inside of the functions.js script:

function func_UpdateOldAssets(){ alert("Update equals " + 'this.value'); var alt_stat = [' $alt ' . ',' . ' $stat ']; document.getElementById(this.value).value; var formdata=document.getElementById(this.value).value; alert(formdata);

.........

I know that the variable "$alt" is initialized inside the PHP code.

I have to assume that the variable "$stat" is being initialized via the "SELECT" code, when I step out of PHP and into HTML.

I still don't understand, and still can't seem to pass both of these variables to the functions.js script.

None of the "alert" commands inside of the functions.js script are returning any values.

Note that I'm also using the "F12 Developer Tools" dropdown.

I am getting an error that says "SCRIPT5009: 'func_UpdateOldAssets' is undefined".Remember that I have only been playing with PHP for about 1 week now.

In this time, with my extensive shell scripting background, I have managed to successfully create a number of PHP scripts already.

But, this particular one, with the select statement, and need to pass multiple variables to the JavaScript function, seems to be giving me a world of trouble.

If you could help me to get this one running correctly, I would be very grateful, as this same "format" / "functionality" will be used for a number of additional, similar pages in the near future...

Thanks in advance, and have a great day.

JCF.

justsomeguy · September 24, 2013

Keep in mind that PHP is completely separate from Javascript and HTML. They do not share anything. They don't run in the same environment, they don't share memory, etc. PHP runs on the web server, and Javascript runs in the browser on the user's computer. When you use PHP to output HTML code, all you are doing is dynamically creating HTML code for the browser. There is nothing from PHP left in the HTML, it is just HTML as far as the browser knows. So, when you have PHP creating the HTML code for the select element, you can view the source in your browser to see the code that PHP has generated. It needs to be valid HTML/Javascript code. Look there if you are wondering what PHP is producing and what you are telling the browser to do. That call to your Javascript function needs to be valid Javascript code after PHP has done its thing on the server.

Also, in order for the server to execute PHP code, it needs to know that the file is handled by PHP. When you save your file as a .php file, the server has an application mapping to send those files to the PHP interpreter for them to be executed. You can set up application mappings for any type of file, but unless a mapping exists then PHP is not going to be used to execute the code. If your server does not have a mapping to execute .js files with PHP, then PHP code in those files is not going to be executed and instead is going to be returned to the browser as-is, meaning that the browser is going to receive the actual PHP code. Browsers don't execute PHP, only servers do. It looks like you are trying to do something in your Javascript function with PHP variables and that isn't going to work like it's written. If you want your file to be executed by PHP then you can name it something like functions.js.php, but even so the code in your Javascript function is not valid PHP code, there is not a PHP block there to execute.

If you're passing 2 variables to the Javascript function, then define it like this, or whatever names you want to use:

function func_UpdateOldAssets(var1, var2)

and then you can alert those values:

function func_UpdateOldAssets(var1, var2){  alert(var1);  alert(var2);}

Remember, it's just Javascript code. It runs in the browser. It cannot contain PHP code, the browser doesn't know how to execute that. You can use PHP to output HTML and Javascript code, but the result needs to be valid HTML and Javascript.

jxfish2 · September 25, 2013

Thanks to everyone who tried to help. I really appreciate both your time, and your input.

The output that I was trying to get was similar to the following, in that there were a number of database records being returned, each record had it's own select dropdown box, and when selected for "Update", that record, and only that record was supposed to be updated.

ABC123 Little_Boy_Blue My Record 20130521 No Update Available Abandon SS_SD-Y HLS_SD-N iPhone_SD-N SS_HD-N HLS_HD-N

BDF812 Man_In_The_Moon Your Record 20130715 No Update Available On Hold SS_SD-N HLS_SD-N iPhone_SD-N SS_HD-N HLS_HD-Y

XYZ246 Blue_Boy_n_Pinky Our Record 20130627 No Update Available Provider Input Requested SS_SD-Y HLS_SD-Y iPhone_SD-N SS_HD-Y HLS_HD-Y

But, no matter how much help you guys provided, I could not get it to work!

I was pulling the data straight from the database, and building the above array live, as the data was retrieved.

In order to update the database, I needed to take the environment variable from the 1st column, and include it with the dropdown selection variable from the 6th column, passing both variables to the JS function, when the "Update" button was selected.

But, I don't know if I was pulling the first column value correctly from the array, as the page was displayed in it's entirety, before the dropdown box and Update button (Submit) were being selected.

And, no matter how much I tried, I could not get the JS function to return the alert messages.

Historically, over the past few weeks, I've created numerous other scripts that passed a single variable to the JS function file, and successfully received the alert messages.

However, this was the first time I tried to mix PHP and HTML data together in one script.

I'm really sorry that my efforts weren't successful, but after wasting several days, I've decided to abandon the "Update" piece of this effort.

Note that the same output above, minus the status box, dropdown box and Update button, also serves a purpose, so the entire effort wasn't wasted.

Again, thanks for your assistance, and have a great week.

JCF

Edited September 25, 2013 by jxfish2

How do I call and execute an HTML select from within my PHP code?

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Create an account or sign in to comment

Create an account

Sign in