Dynamic form PHP / Javascript

Question

Code is below.... I have dropdown menu - that is using PHP to query SQL, in order to populate the dropdown menu options, which is working fine.

You will see below - the sql query is statically configured, I would like to make this more dynamic.

Ideally id like another drop down menu on the same page with statically configured country options, and then when the customer selects which country my PHP script updates with the country in the sql query that php is using....

So for example where in my script below it says;

WHERE country ='SE'

I want it to populate with which ever country the user has selected in the pull down menu, so it could be 'FR', 'DE' or whatever country code has been selected.

I suspect this may be javascript? or maybe php can do this...?

I'm very much a novice level - so if you can be of assistance as much detail, or script as possible please :)

<html>
<body>


<form name="search" action="\cgi-bin\eu.py" method="get">


<?php

require_once 'db.inc.php';

$mysqli = new mysqli(DB_HOST,DB_USER,DB_PASS,DB_NAME);
$sqlSelect="SELECT * FROM clnts WHERE country ='SE' ORDER BY clnt_name";
$result = $mysqli -> query ($sqlSelect);


if(mysqli_num_rows($result)){
$select= '<select name="select">';
while($rs=mysqli_fetch_array($result)){
      $select.='<option value="'.$rs['mgmt_ip'].'">'.$rs['clnt_name'].'</option>';
  }
}
$select.='</select>';

echo $select;

?>
 <input type="submit" name="submit" value="Submit">  
</form>
</body>
</html>

while mixing functionnal and object style for `mysqli` works, you should consider using only one style to get a more readable code [Is it acceptable to use a mix of object oriented style with procedural style in coding PHP?](http://stackoverflow.com/q/16756002/3992945) — ᴄʀᴏᴢᴇᴛ, Feb 13 '17 at 16:35

score 0 · Answer 1 · answered Feb 13 '17 at 16:40

0

You can POST the selected dropdown value to the same page. You can do this automatically by using an 'onChange()' event on the dropdown menu.

Use this to POST to the same page and then get the value for the selected option and use that in your query...

<form method="post" action="<?php echo $_SERVER['PHP_SELF'];?>">

add this at the top of you PHP....

if(isset($_POST['select']))
{
    $selected_country_var = " country = '" . $_POST['select'] . "' ";
}else
{
    $selected_country_var = " ";
}

edit your query to ...

$sqlSelect="SELECT * FROM clnts WHERE" .  $selected_country_var . " ORDER BY clnt_name";

now edit your option/dropdown to have the onChnange event...

<select name="select" onchange="this.form.submit()">';

Let me know if I should clarify or if you need additional functionality.

answered Feb 13 '17 at 16:40

CommonKnowledge

769
1
10
35

1

Please don't do it this way, as this opens up an SQL Injection vulnerability. Use parameterized queries. – alttag Feb 13 '17 at 17:04
Yes definitely use parameterized queries for your final implementation, but for purposes of answering the question, this will work. – CommonKnowledge Feb 13 '17 at 17:13
Given the level of knowledge demonstrated in the question, even showing "it works but don't do it this way" answers isn't a great idea. Also, submitting on a select change event is also not ideal (accessibility and UI reasons), but at least it's not a gaping security hole. – alttag Feb 14 '17 at 17:43

score 0 · Answer 2 · answered Feb 13 '17 at 16:56

It's usually not a "clean" solution to put together both server and client side code on the same page.

It's actually a better practice to put the server code on a seprate file for example 'handler.php' or 'api.php' and then call it using XMLHttpRequest (more commonly known as AJAX) ...

then, when using ajax you can pass data to the server using POST or GET variables and have it process the data.

that way you can create client side which is more fluent, and communication between the server and the client will be more "tidy"

in your case if you have say 'handler.php' on the server and use jquery ajax you could do something like :

client.html

$.ajax({
   url       : 'path_to_handler.php',
   method    : 'POST',
   data      : { countryCode : 'IL', otherVar : 1 },
   onSuccess : function(result){
      // do whatever with the data
   }
});

and on the server

handler.php

if( isset($_POST['contryCode']) ){
   // query the db and have the result returned as json
   echo json_encode($result_query);
}

Dynamic form PHP / Javascript

2 Answers2

client.html

handler.php