Creating searching functionality in php page for html content - javascript

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>";
}

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.

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.

jQuery filter table rows by multiple columns

This is my PHP script to generate the table:
$products = get_db( "SELECT * FROM `products` ORDER BY Data desc" );
echo '<form id="productsEdit" action="actions.php" method="get" />';
echo "<table id='products'>";
echo "<thead>";
echo "<tr id='filter_table'>";
echo "<th class='id'>Cod. prodotto<br><input type='text' class='id' /></th>";
echo "<th class='articolo'>Articolo<br><input type='text' class='articolo' /></th>";
echo "<th class='fornitore'>Fornitore<br><input type='text' class='fornitore' /></th>";
echo "<th class='nome'>Nome<br><input type='text' class='nome' /></th>";
echo "<th class='taglia'>Taglia<br><input type='text' class='taglia' /></th>";
echo "<th class='colore'>Colore<br><input type='text' class='colore' /></th>";
echo "<th class='prezzo_acquisto'>Prezzo acquisto<br><input type='text' class='prezzo_acquisto' /></th>";
echo "<th class='prezzo_vendita'>Prezzo vendita<br><input type='text' class='prezzo_vendita' /></th>";
echo "<th class='data'>Data<br><input type='text' class='data' /></th>";
echo "<th class='q'>Qta<br><input type='text' class='q' /></th>";
echo "<th class='qA'>QtaA<br><input type='text' class='qA' /></th>";
echo "</tr>";
echo "</thead>";
echo "<tbody>";
foreach ($products as $product) {
echo "<tr class='prod_". $product['id'] ."'>";
echo "<td class='id'>". $product['id'] ."</td>";
echo "<td class='articolo'>". $product['articolo'] ."</td>";
echo "<td class='fornitore'>". $product['fornitore'] ."</td>";
echo "<td class='nome'>". $product['nome'] ."</td>";
echo "<td class='taglia'>". $product['taglia'] ."</td>";
echo "<td class='colore'>". $product['colore'] ."</td>";
echo "<td class='prezzo_acquisto'>". $product['prezzo_acquisto'] ."</td>";
echo "<td class='prezzo_vendita'>". $product['prezzo_vendita'] ."</td>";
echo "<td class='data'>". $product['data'] ."</td>";
echo "<td class='q'>". $product['quantita'] ."</td>";
echo "<td class='qA'>". $product['qta_acquisto'] ."</td>";
echo "</tr>";
}
echo "</tbody>";
echo "</table>";
echo "</form>";
My jQuery script:
$('#filter_table input').live("keyup", function() {
var searchStr = $(this).val();
var column = $(this).attr("class");
if (searchStr.length > 0) {
$('tbody > tr').hide();
$('td.'+ column +':containsNC('+ searchStr +')').each(function(){
$(this).parent("tr").show();
});
} else {
$('tbody > tr').show();
}
});
The filter work only for a column, but it doesn't work when I apply filter on more columns in the same time, such as 'AND' condition between fields of different columns.
Can someone help me?
var $rows = $('tbody > tr'),
$filters = $('#filter_table input'),
cache, $m, len, cls;
$filters.on("keyup", function () {
$m = $filters.filter(function () {
return $.trim(this.value).length > 0;
}), len = $m.length;
if (len === 0) return $rows.show();
cache = {};
cls = '.' + $m.map(function () {
cache[this.className] = $.trim(this.value);
return this.className;
}).get().join(',.');
$rows.hide().filter(function () {
return $('td', this).filter(cls).filter(function () {
return this.textContent.indexOf(cache[this.className]) > -1;
}).length === len;
}).show();
});
http://jsfiddle.net/k47dkruh/
Note that live method was deprecated in jQuery 1.7 and removed in jQuery 1.9, in the above example I have used the on method. Based on the posed code there is no need to even use event delegation technique, if you are using one of the older versions of jQuery that doesn't have on method use the click method. If you really need to delegate the event use live or the delegate method.

Hiding/Showing Drop Down menus depending on another option

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

How to add column to a table using javascript and take the column name from a textbox?

I wrote this code to add column to a table using javascript and take the column name from a html textbox. But this is not working.
JavaScript :-
<script type="text/javascript">
$(document).ready(function () {
$('#btnAdd').click(function () {
var count = 3,
first_row = $('#Row2');
while (count-- > 0) first_row.clone().appendTo('#blacklistgrid');
});`enter code here`
var myform = $('#myform'),
iter = 4;
$('#btnAddCol').click(function () {
var col_name = document.getElementID("txt_col_name").value;
myform.find('tr').each(function(){
var trow = $(this);
if(trow.index() === 0){
trow.append('<td>'+colname+'</td>');
}else{
trow.append('<td><input type="text" name="al'+iter+'"/></td>');
}
});
iter += 1;
});
});
</script>
HTML :-
<form name="myform" id="myform">
<table id="blacklistgrid">
<tr id="heading">
<td>Employee ID</td>
<td>Employee Name</td>
<td>Basic Salary</td>
<td>Mobile Allowances</td>
<td>Travel Allowences</td>
<td>Internet Allowences</td>
<td>Sales Commission</td>
<td>Bonus</td>
<td>Net Salary</td>
</tr>
<?php
$sql1="SELECT user_id, user_fname, user_lname
FROM ".$prefix."users_info
WHERE user_st='1'";
$employee_info = $wpdb->get_results($sql1);
//var_dump($employee_info);
foreach ($employee_info as $employee_info_row)
{
$user_id = $employee_info_row->user_id;
$user_fname = $employee_info_row->user_fname;
$user_lname = $employee_info_row->user_lname;
echo "<tr id=\"row\">";
echo "<td>";
echo "$user_id";
echo "</td>";
echo "<td>";
echo "$user_fname $user_lname";
echo "</td>";
echo "<td>";
echo "<input type=\"text\" name=\"bs\" />";
echo "</td>";
echo "<td>";
echo "<input type=\"text\" name=\"a1\" />";
echo "</td>";
echo "<td>";
echo "<input type=\"text\" name=\"a2\" />";
echo "</td>";
echo "<td>";
echo "<input type=\"text\" name=\"a3\" />";
echo "</td>";
echo "<td>";
echo "<input type=\"text\" name=\"sc\" />";
echo "</td>";
echo "<td>";
echo "<input type=\"text\" name=\"bns\" />";
echo "</td>";
echo "<td>";
echo "";
echo "</td>";
echo "</tr>";
}
?>
</table>
<input type="text" id="txt_col_name" name="add_col" />
<button type="button" id="btnAddCol">Add new column</button>
</br>
</br>
<input type="submit"></input>
</form>
I also want to add the new column between 'Internet Allowences' and 'Sales Commission'. Can anyone pls tell me how to do that. Thank You
Hope this help
jsfiddle.net/stormspirit/2zh64/1/

Categories