Hiding/Showing Drop Down menus depending on another option - javascript

I am trying to make it so when a person selects an option from a drop down menu, another drop down menu shows up. So if I have a drop down menu with 3 choices, "Vancouver, "Singapore","New York". When a user selects Vancouver a drop down menu shows up with a couple of options, if they select new york another drown down menu shows up. To make things complicated I am also using php as its going to be running things on the server side eventually.
echo "<script type=\"text/javascript\">";
echo "function getDropDown(sel){";
echo "hideAll();";
echo "document.getElementById(sel.options[sel.selectedIndex].value).style.display ";
echo "= 'block';";
echo "}";
echo "function hideAll(){";
echo "document.getElementById(\"vancouver\").style.display = 'none';";
echo "document.getElementById(\"singapore\").style.display = 'none';";
echo "document.getElementById(\"newyork\").style.display = 'none';";
echo "}";
echo "</script>";
echo "<tr>";
echo "<td align=\"right\">";
echo "<td>";
echo "<select name=\"optionDrop\" onChange=\"getDropDown(this)\">";
echo "<option value=\"\">Please Select</option>";
echo "<option value=\"vancouver\">Vancouver</option>";
echo "<option value=\"singapore\">Singapore</option>";
echo "<option value=\"newyork\">New York</option>";
echo "</select>";
echo "</td>";
echo "</tr>";
echo "<tr>";
echo "<td align=\"right\">City</td>";
echo "<td>";
echo "<div id=\"vancouver\" style=\"display: none;\">";
echo "<select name=\"optionDrop\" >";
echo "<option value=\"\">Please Select</option>";
echo "</select>";
echo "</div>";
echo "<div id=\"singapore\" style=\"display: none;\">";
//echo "<select name=\"optionDrop2\">";
// echo "<option value=\"\">Please Select2</option>";
echo "Sing";
echo "</div>";
echo "<div id=\"newyork\" style=\"display: none;\">";
echo "New York";
echo "</div>";
echo "</td>";
echo "</td>";
echo "</tr>";
Right now when I select the option "Vancouver" a drop down menu does shot up, and when selected other options a text shows up. However if I uncomment the lines
//echo "<select name=\"optionDrop2\">";
// echo "<option value=\"\">Please Select2</option>";
Then nothing works anymore. No matter what option I select nothing shows up. I am completely stuck and cant figure out what is wrong with it.

Hum... first of all I'll give you a hint you might have begged for many years ago:
Closing a php tag within a php file won't break your code.
If you want to display only HTML like you are doing in the code you posted, just do the following:
<?php
$variable = "test";
// Some random things blabla.
?>
<span class="test">
<?php echo $variable; ?>
</span>
<?php
$something = "something_else";
// Some other php
?>
About your problem, there you go:
http://codepen.io/anon/pen/GxytE

Related

How to send php Select box value?

The following code will output as shown in the attached picture.
Select the value of the Select box in test16 and press the "test19" button, the value of the Select box you want to modify.I want to make the value delivered to php.
I want to know how to deliver the value of the select box in php and how to receive the value delivered.
<?php
if($result = mysqli_query($link, $sql)){
$test = 'test';
if(mysqli_num_rows($result) > 0){
echo "<table id='datatable1' class = table style = 'width: 100%; background-color:#dee2e6'>";
echo "<thead >";
echo "<tr>";
echo "<th>No</th>";
echo "<th>test1</th>";
echo "<th>test2</th>";
echo "<th>test3</th>";
echo "<th>test4</th>";
echo "<th>test5</th>";
echo "<th>test6</th>";
echo "<th>test7</th>";
echo "<th>test8</th>";
echo "<th>test9</th>";
echo "<th>test10</th>";
echo "<th>test11</th>";
echo "<th>test12</th>";
echo "<th>test13</th>";
echo "<th>test14</th>";
echo "<th>test15</th>";
echo "<th>test16</th>";
echo "<th>test17</th>";
echo "<th>test18</th>";
echo "<th>test19</th>";
echo "</tr>";
echo "</thead>";
echo "<tbody>";
while($row = mysqli_fetch_array($result)){
echo "<tr>";
echo "<td>" . $row['id'] . "</td>";
echo "<td>" . $row['chart_num'] . "</td>";
echo "<td>" . $row['chart_name'] . "</td>";
echo "<td>" . $row['visit'] . "</td>";
echo "<td>" . number_format($row['total_medical_bills']) . "</td>";
echo "<td>" . number_format($row['total_amount']) . "</td>";
echo "<td>" . number_format($row['amount_asked']) . "</td>";
echo "<td style = 'font-weight: bold'>" . number_format($row['medical_bills_payment']) . "</td>";
echo "<td style = 'font-weight: bold'>" . number_format($row['personal_liability_amount']) . "</td>";
echo "<td style = 'font-weight: bold'>" . number_format($row['non_payment']) . "</td>";
echo "<td>" . $row['insurance_division'] . "</td>";
echo "<td>" . $row['division'] . "</td>";
echo "<td>" . number_format($row['cash_amount_received']) . "</td>";
echo "<td>" . number_format($row['card_amount_received']) . "</td>";
echo "<td style = 'font-weight: bold'>" . number_format($row['treatment_fees_difference']) . "</td>";
echo "<td>" . $row['treatment_fees_check_division'] . "</td>";
echo "<td><select name='". $test ."'>";
echo "<option value='". $test ."'>First</option>";
echo "<option value='". $test ."'>Second</option>";
echo "<option value='". $test ."'>Third</option>";
echo "</select></td>";
echo "<td>" . $row['treatment_fees_check'] . "</td>";
echo "<td>" . $row['treatment_fees_check_modify'] . "</td>";
echo "<td>";
if($row['medical_bills_payment'] == $row['personal_liability_amount'] + $row['non_payment']){
echo "수정불가";
}
else{
echo "<a href='treatment_fees_check_update.php?id=". $row['id'] ." title='수정' data-toggle='tooltip'><span class='icon ion-edit'></span></a>";
}
echo "</td>";
echo "</tr>";
}
echo "</tbody>";
echo "</table>";
mysqli_free_result($result);
}
}
else{
echo "ERROR: Could not able to execute $sql2. " . mysqli_error($link);
}
// Close connection
mysqli_close($link);
?>
Since you can have a lot of select boxes, you will need give them an ID so we can reference the respective field. Let's add/change your code as below:
$rowCount=0;
while($row = mysqli_fetch_array($result)){
echo "<tr>";
echo "<td>" . $row['id'] . "</td>";
...
echo "<td><select id='MySelect".$rowCount."' name='". $test ."'>";
echo "<option value='". $test ."'>First</option>";
echo "<option value='". $test ."'>Second</option>";
echo "<option value='". $test ."'>Third</option>";
echo "</select></td>";
...
echo "<td>";
if($row['medical_bills_payment'] == $row['personal_liability_amount'] + $row['non_payment']){
echo "수정불가";
}
else{
echo '<span class="icon ion-edit"></span>';
}
echo "</td>";
$rowCount++;
EDIT: I missed to add $rowCount++; before close while block. Sorry.
At the end of your document, before close body tag you add:
<script>
function GetMySelectValue(select,objId){
document.location.href= "yoursite.com/treatment_fees_check_update.php?id="+objId+"&myselect="+document.getElementById(select).value;
}
</script>
In treatment_fees_check_update.php you get id and select value:
$rowid=$_GET['id'];
$myselect=$_GET['myselect'];
Hope it can help you.
The principles for what you need is to asign a id to each one of the options in the dropdown, so you can send the id of tha specific value, compare with that same id in the database if exists then you will have the column with the value that you need to modify in the database, but first bring and add the proper id of each one of the options in the select.

Creating searching functionality in php page for html content

I have a php page which displays the F5 pool member status. I would like to create a search bar so that when you start typing something, it displays the pool name and pool member only with the text that has been typed. Can someone please recommend ?
Here is the part of the php code which displays the pool and member status-
echo "<center><table cellspacing='6' cellpadding='6' width='100%'
border='0'>";
echo "<tr><th><font size='6'><b>Pools</b></font></th></tr>";
echo "<tr><td valign='top' width='50%'>";
foreach ($pool_list as $index=>$pool)
{
$pool_name=trim($pool,"/Common/");
echo "<center><a name='$pool'></a>";
$availability_status=$poolstatus[$index]->availability_status;
$img = getgif($availability_status);
echo "<img src='$img'><b> &nbsp $pool_name</b>";
echo "<table border='1' cellpadding='5' width='100%'>";
echo "<tr>";
echo "<th bgcolor='#ADD8E6' width='25%'>Member IP</th><th bgcolor='#ADD8E6' width='25%'>Member Name</th><th bgcolor='#ADD8E6' width='25%'>Enable Status</th><th bgcolor='#ADD8E6' width='25%'>Current Connections</th></tr>";
foreach ($memberlist[$index] as $member_index=>$member_value)
{
$address=$member_value->member->address;
$name=$client3->get_screen_name(array($address));
if ($name[0] == "") { $name[0]=$address; }
$port=$member_value->member->port;
$member_name=trim($name[0],"/Common/");
$sess_status=$member_value->object_status->availability_status;
$enabled_status=$member_value->object_status->enabled_status;
$mon_status=$membermonlist[$index][$member_index]->monitor_status;
$stats=$client2->get_statistics(array($pool),array(array($member_value->member)));
$ccount=$stats[0]->statistics[0]->statistics[4]->value->low;
$tcount=$stats[0]->statistics[0]->statistics[6]->value->low;
echo "<tr>";
echo "<td bgcolor='#F5F5DC' align='center'> &nbsp $address</td>";
echo "<td bgcolor='#F5F5DC' align='center'>$member_name</td>";
$img = getgif_member($sess_status, $enabled_status);
echo "<td bgcolor='#F5F5DC' align='center'>";
echo "<img src='$img'>";
echo "</td>";
echo "<td bgcolor='#F5F5DC' align='center'>$ccount</td>";
echo "</tr>";
}
echo "</table>";
}

Datatable reorder issue

I'm having an issue with the following code. What I'm trying to do is to populate a modal form with data from the row on which you pressed the edit button.
The script works fine until I try to reorder the table: when the table is reordered the script is getting the information of the pre-reordered table.
This is the script that get called when the edit button get clicked:
$(document).ready( function () {
//create datatable
//declaring a variable without var makes it global
table_movimenti = $('#movimenti').DataTable();
$('#movimenti table tbody tr td').on('click', function () {
$("#transaction_ID").val($(this).find("td:eq(6)").attr('id'));
$("#data_cont").val($(this).find("td:eq(0)").text());
$("#data_valuta").val($(this).find("td:eq(1)").text());
$("#importo").val($(this).find("td:eq(2)").text());
$("#divisa").val($(this).find("td:eq(3)").text());
$("#causale").val($(this).find("td:eq(4)").text());
var categoria=$.trim($(this).find("td:eq(5)").text());
$("#categoria option").each(function() {
if($(this).text() == categoria){
//$(this).prop("selected", true);
$(this).attr("selected", "selected");
return;
}
});
});
This is the table:
<?php
echo "<table id='movimenti' class='table table-bordered table-striped table no-margin'>";
echo "<thead>";
echo "<tr>";
echo "<th>Data contabile</th>";
echo "<th>Data valuta</th>";
echo "<th>Importo</th>";
echo "<th>Divisa</th>";
echo "<th>Causale</th>";
echo "<th>Categoria</th>";
echo "<th>Edit</th>";
echo "</tr>";
echo "</thead>";
echo "<tbody>";
while($row = mysqli_fetch_array($result)){
echo "<tr class='table_row'>";
echo " <td>" . $row['Data_cont'] . "</td>";
echo " <td>" . $row['Data_valuta'] . "</td>";
echo " <td>" . $row['Importo'] . "</td>";
echo " <td>" . $row['Divisa'] . "</td>";
echo " <td>" . $row['Causale'] . "</td>";
echo " <td>";
foreach ($categories as $value){
if ($value['ID'] == $row['Categoria']){
echo " <span class='label label-success'>";
echo "". $value['Descrizione'] ."";
echo "<input type='text' class='label label-success' id='categoria' name='categoria' value='". $value['Descrizione'] ."'/>";
echo "</span></td>";
}
}
In the end I've completely change the approach and now I'm building my table using ajax option in datatable.
In this way I'm able to retrieve all the data in the row using the same ajax option.

I want to display 1 record instead of displaying the whole Database, PHP

dbconnect.php
<form method="post" action="a.php">
<select name="taskOption" id="cust-id" onchange="showUser(this.value)">
<?php
include 'orderSelect.php';
echo '<option>View Order</option>';
while($row = mysqli_fetch_array($result)):;?>
<option value='<?php echo $row[0]; ?>'><?php echo $row[1]; echo " ";
echo $row[2]; ?></option>
<?php endwhile; ?>
</select>
</form>
a.php
<?php
include 'connect.php';
$q = intval($_GET['q']);
$sql = "SELECT id, firstname, lastname,productOne, quantity, price
FROM orderlist";
$result = mysqli_query($conn, $sql);
echo "<table >
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Product</th>
<th>Quantity</th>
<th>Price</th>
<th>Total</th>
</tr>";
while($row = mysqli_fetch_array($result)) {
$tquan = $row['quantity'];
$tprice = $row['price'];
$total = $tquan * $tprice;
echo "<tr>";
echo "<td>" . $row['firstname'] . "</td>";
echo "<td>" . $row['lastname'] . "</td>";
echo "<td>" . $row['productOne'] . "</td>";
echo "<td>" . $row['quantity'] . "</td>";
echo "<td>" . $row['price'] . "</td>";
echo "<td>" . $total . "</td>";
echo "</tr>";
}
echo "</table>";
?>
I got it working. IT display the record/ users that I want to see when something is selected from the drop down list, but the problem is it's displaying the entire database data. I only want to get that specific that of the selected person. Any Ideas how to solve this problem? I would appreciate it.
Image Example
I only wanted the first row to be selected when I select from the dropdown list
Your SELECT is of the whole database you need to select something exact.
For example:
$sql = "SELECT 'id' FROM Users WHERE username='$name'";
That is an example of using the WHERE clause.
In addition to what the above said.
You mentioned you only wanted 1 record.
Add " LIMIT 1" to the end of your query
OR
Change the 'while' command to an 'if' command and it will only run once.

JavaScript for picking an ID from table

I need to get value of the first cell from table (ID's cell). Here's part of code: I need some sort of script that just returns the value of with echo $results['ID'] after clicking on a table row.
echo "<table>";
echo "<tr><th>ID</th><th>Imie</th><th>Nazwisko</th><th>PESEL</th><th>Data Urodzenia</th><th>Miejscowość</th><th>Adres</th><th>Kod Pocztowy</th><th>Województwo</th><th>Telefon</th><th>E-Mail</th><th>Notatki</th><th>Zdjęcie</th><th>Historia</th><th>Umów</th><th>Edytuj</th><th>Usuń</th></tr> ";
while ($results = $query->fetch()) {
echo "<tr><td>";
echo $results['ID'];
echo "</td><td>";
echo $results['imie'];
echo "</td><td>";
echo $results['nazwisko'];
echo "</td><td>";
echo $results['pesel'];
echo "</td><td>";
echo $results['data'];
echo "</td><td>";
echo $results['miejscowosc'];
echo "</td><td>";
echo $results['adres'];
echo "</td><td>";
echo $results['kodpocztowy'];
echo "</td><td>";
echo $results['wojewodztwo'];
echo "</td><td>";
echo $results['telefon'];
echo "</td><td>";
echo $results['email'];
echo "</td><td>";
echo $results['notatki'];
}
This is easily done with jQuery, you assign a click handler to all table-rows, then you find the contents of the first element of that row.
$("tr").click(function() { //assign click handler to rows
var id = $(this).children().first().html() //get content of first element of row
console.log(id) //write the id to the browsers console
})
Full example:
http://jsfiddle.net/d3n4czph/
If you are not familiar with jQuery, you need to include it with a script tag, then run the code above on your page when it loads

Categories