The program I have made contains only one search bar, so I can't filter more accurate or related tables.
I need one more search bar in order to enter the value in two search field by clicking post it will search from database and get most related once.
<?php
if(isset($_POST['search']))
{
$valueToSearch = $_POST['valueToSearch'];
// search in all table columns
// using concat mysql function
$query = "SELECT * FROM `included` WHERE CONCAT(`id`, `a`, `b`,
`c`,`c`,`d`,`e`,`f`,`g`,`h`,`i`) LIKE '%".$valueToSearch."%'";
$search_result = filterTable($query);
}
else {
$query = "SELECT * FROM `included`";
$search_result = filterTable($query);
}
// function to connect and execute the query
function filterTable($query)
{
$connect = mysqli_connect("localhost", "root", "", "hospitaldata");
$filter_Result = mysqli_query($connect, $query);
return $filter_Result;
}
?>
<!DOCTYPE html>
<html>
<head>
<img src="nop.jpg">
<title>PHP HTML TABLE DATA SEARCH</title>
<style>
table,tr,th,td{
border:.3px solid blue;
color:#000;
font-family:sans-serif;
}
div.relative {
position: relative;
top: -50px;
width: 1400px;
height: 100px;
color: #0C3;
font-family: "Arial Black", Gadget, sans-serif;
font-size: 24px;
}
div.absolute {
position: absolute;
top: 51px;
right: 20;
width: 1261px;
height: 40px;
color: #999;
font-family: Verdana, Geneva, sans-serif;
left: 65px;
}
input[type=text] {
alignment-baseline:central;
width: 130px;
box-sizing: border-box;
border: 2px solid #ccc;
border-radius: 4px;
font-size: 16px;
background-color: white;
background-image:url('ds.jpg');
padding: 12px 20px 12px 40px;
-webkit-transition: width 0.4s ease-in-out;
transition: width 0.4s ease-in-out;
}
input[type=text]:focus {
width: 50%;
}
table,tr,th,tr
{
border:1px solid blue;
}
</style>
</style>
</head>
<body>
<div class="relative"><h1 align="center">HOSPITAL</h1>
<div class="absolute" align="center">Check provided points here</div>
</div>
<form action="index.php" method="post">
<input type="text" name="valueToSearch" placeholder="Search..."><br>
<input type="submit" name="search" value=">>"><br><br>
<table>
<tr>
<th>Building</th>
<th>Floor</th>
<th>zone</th>
<th>Room no</th>
<th>Room Type</th>
<th>Room Name</th>
<th>Types of Connection</th>
<th>Suggested</th>
<th>Provided</th>
</tr>
<!-- populate table from mysql database -->
<?php while($row = mysqli_fetch_array($search_result)):?>
<tr>
<td><?php echo $row['a'];?></td>
<td><?php echo $row['b'];?></td>
<td><?php echo $row['c'];?></td>
<td><?php echo $row['d'];?></td>
<td><?php echo $row['e'];?></td>
<td><?php echo $row['f'];?></td>
<td><?php echo $row['g'];?></td>
<td><?php echo $row['h'];?></td>
<td><?php echo $row['i'];?></td>
</tr>
<?php endwhile;?>
</table>
</form>
</body>
</html>
From your comments I understand the following:
you have a webpage with a search input field
you want a second input so your users can search more presice
one serach button should send both input fields
A really plain (and untested) version could look like this:
<form action="search.php" method="post">
<label><input name="search1"/> First keyword</label>
<label><input name="search2"/> Second keyword</label>
<input type="submit" value="Serach"/>
</form>
<?php
// If the Search button was pressed
if(isset($_POST['search1'])) {
$stmt = $pdo->prepare($query = "SELECT * FROM `included` WHERE CONCAT(`id`, `a`, `b`, `c`) LIKE '%:search1%' OR CONCAT(`d`, `e`) LIKE '%:search2%'");
$stmt->execute(['search1' => $POST['search1'], 'search2' => $POST['search2'] :? 'default');
foreach ($stmt as $row) {
// do something with $row
}
}
Of course you have to fit the SQL statement to your needs.
For infos about how to setup the $pdo database connection, please refer to the link: http://stackoverflow.com/a/60496/1152471
Related
I've been trying to select this WebElement for a while. It's a sign up button on the front page of the web application I test. I was wondering, is there a method I could use to grab text within the HTML to define a WebElement?
<div>
<div>
<div style="">
<div style="transform: translate(0px, 0px) scale(0.5, 0.5) rotate(0deg);">
<div role="img">
<img src="images/lsloginform/newskin/try_it_normal.png?1444658058414">
</div>
</div>
<div style="transform: translate(0px, 75px) scale(1, 1) rotate(0deg);">
<canvas height="7" width="75" style="top: 0px; left: 0px; width: 75px; height: 7px;"></canvas>
</div>
<div style="transform: translate(0px, 82px) scale(1, 1) rotate(0deg);">
<div style="font-family: franklin-gothic-ext-comp-urw; font-weight: 700; font-style: normal; font-size: 15px; opacity: 1; color: rgb(63, 63, 63); transform: translate(7px, 0px) scale(1, 1) rotate(0deg);">SIGN UP</div>
</div>
</div>
<div style="display: none;"></div>
<div style="display: none;">
<div style="transform: translate(0px, 0px) scale(0.5, 0.5) rotate(0deg);">
<div role="img">
<img src="images/lsloginform/newskin/try_it_MO.png?1444665385167">
</div>
</div>
<div style="transform: translate(0px, 75px) scale(1, 1) rotate(0deg);">
<canvas height="7" width="75" style="top: 0px; left: 0px; width: 75px; height: 7px;"></canvas>
</div>
<div style="transform: translate(0px, 82px) scale(1, 1) rotate(0deg);">
<div style="font-family: franklin-gothic-ext-comp-urw; font-weight: 700; font-style: normal; font-size: 15px; opacity: 1; color: rgb(63, 63, 63); transform: translate(7px, 0px) scale(1, 1) rotate(0deg);">SIGN UP</div>
</div>
<div></div>
</div>
<div style="display: none;"></div>
<div style="display: none;"></div>
</div>
</div>
Specific example, I'd like to the xpath of the above div utilizing the "SIGN UP" text at the end of the HTML. How do I go about doing that?
The application I test on is finicky as all hell, and being able to select by that attribute would make my life much easier. The reason this is a problem is because I need 3 different methods of grabbing an xpath: One for the button as normal, one for the hover, and another because the button changes momentarily when it is clicked. Most of my automation scripts look something like:
public class changeLanguageLogin {
public void run(WebDriver driver) {
WebElement changeLanguage = getWebElement(driver, "xpath", "img", "src", "select_application_language_normal");
Actions actions = new Actions(driver);
actions.moveToElement(changeLanguage).build().perform();
WebElement changeLanguageMO = getWebElement(driver, "xpath", "img", "src", "select_application_language_hover");
changeLanguageMO.click();
WebElement changeLanguageClicked = getWebElement(driver, "xpath", "img", "src", "select_application_language_pushed");
changeLanguageClicked.click();
}
private static By buildXPathExpression(String htmlElement, String attributeName, String attributeValue)
{
return By.xpath("//"+htmlElement+"[contains(#"+attributeName+",'"+attributeValue+"')]");
}
private static By buildCSSExpression(String htmlElement, String attributeName, String attributeValue)
{
return By.cssSelector(""+htmlElement+"["+attributeName+"='"+attributeValue+"']");
}
private static WebElement getWebElement(WebDriver driver, String operation, String htmlElement, String attributeName, String attributeValue)
{
By byObj = null;
WebElement webElementObj = null;
if(operation!= null)
{
if(operation.equals("xpath"))
{
byObj = buildXPathExpression(htmlElement,attributeName,attributeValue);
}
else if(operation.equals("cssSelector"))
{
byObj = buildCSSExpression(htmlElement,attributeName,attributeValue);
}
}
if(byObj != null)
{
webElementObj = driver.findElement(byObj);
}
return webElementObj;
}
}
Many, many, many times a day, one method of defining the xpath simply "will not work" and I have to scrounge around for another one. The goal is to not use any "hard coded" xpaths, as that was problematic when I had began the job.
So the answer I'm looking for: Define an xpath by the text in the HTML, "SIGN UP".
This response will not help if you are bound to only xpath or
css lookups.
Option 1
If you would be willing to add another case to your helper method I'm thinking that By.linkText may do what you're wanting?
/**
* #param linkText The exact text to match against
* #return a By which locates A elements by the exact text it displays
*/
public static By linkText(final String linkText) {
if (linkText == null)
throw new IllegalArgumentException(
"Cannot find elements when link text is null.");
return new ByLinkText(linkText);
}
Or possibly By.partialLinkText
/**
* #param linkText The text to match against
* #return a By which locates A elements that contain the given link text
*/
public static By partialLinkText(final String linkText) {
if (linkText == null)
throw new IllegalArgumentException(
"Cannot find elements when link text is null.");
return new ByPartialLinkText(linkText);
}
This would potentially be an issue if you're testing against a system that has been internationalized. Depending on the environment the locale of the user/browser would change the text you're looking for.
This can also be a maintenance issue if the text changes.
Option 2
If you have control of the HTML, you may consider adding id's to the elements on the page. With that then you can use the By.id lookup. From some of my preliminary research the element id is seen as one of the more reliable and consistent paths.
/**
* #param id The value of the "id" attribute to search for
* #return a By which locates elements by the value of the "id" attribute.
*/
public static By id(final String id) {
if (id == null)
throw new IllegalArgumentException(
"Cannot find elements with a null id attribute.");
return new ById(id);
}
Option 3
My final suggestion would be to try to implement your own By lookup. I would fall short on suggesting an implementation for the lookup, but if this behavior is what you're needing then you should be aware that you could potentially create a subclass to do what you're wanting.
Best of Luck.
For old time inlie style css, you generate the css selector depends on the style written for the div like "div[style*='paste_style_attribute']". However this method is not dependable because of duplication of same style.
For the following div:
<div style="font-family: franklin-gothic-ext-comp-urw; font-weight: 700; font-style: normal; font-size: 15px; opacity: 1; color: rgb(63, 63, 63); transform: translate(7px, 0px) scale(1, 1) rotate(0deg);">SIGN UP</div>
You can generate the following css selector:
"div[style*='font-family: franklin-gothic-ext-comp-urw; font-weight: 700; font-style: normal; font-size: 15px; opacity: 1; color: rgb(63, 63, 63); transform: translate(7px, 0px) scale(1, 1) rotate(0deg);']"
Java code:
driver.findElement(By.cssSelector("div[style*='font-family: franklin-gothic-ext-comp-urw; font-weight: 700; font-style: normal; font-size: 15px; opacity: 1; color: rgb(63, 63, 63); transform: translate(7px, 0px) scale(1, 1) rotate(0deg);']"))
Before:
After
The first image is of the login page, but when I click login button the navigation bar becomes like the second picture, spaces appear between the blocks. This happens when a sevlet is called and has this code:
out.print("<p style='position:absolute;top:200px;left:300px;color:#CC0066;'>Sorry username or password error! </p>");
RequestDispatcher rd=request.getRequestDispatcher("login.jsp");
rd.include(request, response);
The CSS code is:
#menuli{
display: inline;
float: left;
color: #CCCCCC;
}
#menuA,#menuAL {
display: block;
width: 180px;
padding: 10px;
color: #FFFFFF;
font-size: x-large;
font-variant: normal;
font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
margin: 10;
text-decoration: none;
opacity: 0.9;
border-spacing:0;
border-collapse:collapse;
text-align: center;
background-color: #000033;
/*font-weight: bold;
/*border-radius: 20px;*/
}
#menuA:hover, #menuAL:hover
{
/*color: #699;*/
background-color: #003;
/*text-shadow: 10px 0px 10px; */
font-weight: bold;
background-image: -webkit-gradient(linear, 50.00% 0.00%, 50.00% 100.00%, color-stop( 0% , rgba(65,62,110,1.00)),color-stop( 40.94% , rgba(7,5,53,1.00)),color-stop( 49.74% , rgba(9,8,56,1.00)),color-stop( 100% , rgba(12,11,60,1.00)),color-stop( 100% , rgba(54,56,116,1.00)));
background-image: -webkit-linear-gradient(270deg,rgba(65,62,110,1.00) 0%,rgba(7,5,53,1.00) 40.94%,rgba(9,8,56,1.00) 49.74%,rgba(12,11,60,1.00) 100%,rgba(54,56,116,1.00) 100%);
background-image: linear-gradient(180deg,rgba(65,62,110,1.00) 0%,rgba(7,5,53,1.00) 40.94%,rgba(9,8,56,1.00) 49.74%,rgba(12,11,60,1.00) 100%,rgba(54,56,116,1.00) 100%);
}
#menu
{
position: absolute;
top: 126px;
left: 139px;
}
The JSP code is:
<div name="header" id="header">
<img id="logo" style="position:absolute; left:145px; top:10px; "src="images/logo.jpg">
<div id="menu" >
<ul>
<li id="menuli"><a id="menuA" href="index.jsp#header">Home</a></li>
<li id="menuli"><a id="menuA" href="index.jsp#services">Services</a></li>
<li id="menuli"><a class="prod" id="menuA" href="Display?course=6">Products</a>
</li>
<li id="menuli"><a id="menuA" href="index.jsp#contact">Contact</a></li>
<li id="menuli"><a id="menuA" href="index.jsp#about">About</a></li>
</ul>
</div>
</div>
It's happening with all the pages after any servlet includes it.
Please see the links for images.
Printing the html content inside servlet is considered as bad practice . you can rather set the attribute in the request . so instead of this ,
out.print("<p style='position:absolute;top:200px;left:300px;color:#CC0066;'>Sorry username or password error! </p>");
RequestDispatcher rd=request.getRequestDispatcher("login.jsp");
rd.include(request, response);
use,
request.setAttribute("message","Sorry username or password error!");
RequestDispatcher rd=request.getRequestDispatcher("login.jsp");
rd.include(request, response);
And try to print the message in the jsp page,
simply using the scriptlet as ,
<p style='position:absolute;top:200px;left:300px;color:#CC0066;'><%=message></p>
or using EL
<p style='position:absolute;top:200px;left:300px;color:#CC0066;'>${message}</p>
using scriptlets are also considered to be bad practices since a decade . see this How to avoid java codes inside jsp
Hope this helps !!
Got it fixed. I had margin:10px in the CSS part of the navigation bar. Removed it and the problems are all gone.
:)
I'm developing a website for the first time. I have used two div tags. One is outer container whose width and height are set to 100%. Other one is inside container. I want to set this to the center vertically. similar to this website: http://www.bigcinemas.com/IN/home.aspx.
But its not working. I tired something like this:
index.jsp
<div class="container">
<div class="banner">
<a class="logo" href="index.jsp">
<img src="images/logo.png" alt="Rainbow Entertainment" width="250px" height="50px"/></a>
<div id="login">
<table style="background-color: purple">
<tr><td>Username : <input type="text"></td>
<td>Password : <input type="password"></td>
<td>Sign in<input type="submit"></td></tr>
</table>
</div>
</div>
</div>
</body>
</html>
menu.css
.container{
width: 100%;
height: 100%;
}
#banner{
width: 60%;
padding-left: 30%;
padding-right: 30%;
position: absolute;
}
.logo{
margin-top: 5px;
float: left;
width: 20%;
position: relative;
}
#login{
width: 30%;
float: right;
padding-left: 10%;
}
#menu{
height: 20%;
width: 70%;
}
.menu_items{
width: 80%;
color: white;
}
Also I want to the difference between id and class.
I was looking for a similar solution earlier today - check the answer on this question. How to vertically center a div for all browsers? . It sounds like the code provided there will suit your needs.
<div class="outer">
<div class="middle">
<div class="inner">
<h1>The Content</h1>
<p>Once upon a midnight dreary...</p>
</div>
</div>
</div>
CSS
.outer {
display: table;
position: absolute;
height: 100%;
width: 100%;
}
.middle {
display: table-cell;
vertical-align: middle;
}
.inner {
margin-left: auto;
margin-right: auto;
width: /*whatever width you want*/;
}
I was tring to make a question answer forum in which each question being displayed is having three divisons : Answers Count,View count,Question.So for achieving this I do something like this :
<div id="container">
<div id="a">
<p align="center">0</p>
<p align="center">Answers</p>
</div>
<div id="b-wrapper">
<div id="b">
<p align="center">0</p>
<p align="center">Views</p>
</div>
</div>
<div id="c-wrapper">
<div id="c">
<p align="center">Question</p>
<p align="right">Asked By Micheal</p>
</div>
</div>
<br style="clear: both;">
</div>
In css i did :
#container {
width: 800px;
}
#a, #b-wrapper, #c-wrapper {
float: left;
}
#a {
width: 10%;
background-color: #0ff;
}
#b-wrapper {
width: 10%;
}
#b {
margin-left: 20px;
background-color: #0f0;
}
#c-wrapper {
width: 60%;
}
#c {
margin-left: 20px;
background-color: #EEEEEE;
}
Now I am facing two problems.
The divison for Answer is getting a bit bigger in height.How to manage it.
I am fetching questions from database Like :
while(rs.next){
String myid=rs.getString("ID");
//display here all three divisons where rs is ResultSet
}
So here problem is that i want to assign this myid to each of the divison And on click of any divison move to second.jsp.
Please help to solve these problems.
I'm new to GCM / Java, I'm experienced in php, but only mysql.
I found this tutorial:
http://www.androidhive.info/2012/10/android-push-notifications-using-google-cloud-messaging-gcm-php-and-mysql/
It was very useful, and I got it to work. My only problem is that this code is for sending to one device at a time.
I tryed to edit it so it sends to multiple devices using one form & one submit button, but without a success.
This code gets from Java (Client) Info and puts it in a mysql database using php (Server).
It also registers the GCM registration id of the device in the mysql DB,
and than you can send notifications by id to the device using the id's GCM reg id.
Here is the index.php where you fill in the form:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
});
function sendPushNotification(id){
var data = $('form#'+id).serialize();
$('form#'+id).unbind('submit');
$.ajax({
url: "send_message.php",
type: 'GET',
data: data,
beforeSend: function() {
},
success: function(data, textStatus, xhr) {
$('.txt_message').val("");
},
error: function(xhr, textStatus, errorThrown) {
}
});
return false;
}
</script>
<style type="text/css">
.container{
width: 950px;
margin: 0 auto;
padding: 0;
}
h1{
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 24px;
color: #777;
}
div.clear{
clear: both;
}
ul.devices{
margin: 0;
padding: 0;
}
ul.devices li{
float: left;
list-style: none;
border: 1px solid #dedede;
padding: 10px;
margin: 0 15px 25px 0;
border-radius: 3px;
-webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.35);
-moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.35);
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.35);
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
color: #555;
}
ul.devices li label, ul.devices li span{
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 12px;
font-style: normal;
font-variant: normal;
font-weight: bold;
color: #393939;
display: block;
float: left;
}
ul.devices li label{
height: 25px;
width: 50px;
}
ul.devices li textarea{
float: left;
resize: none;
}
ul.devices li .send_btn{
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0096FF), to(#005DFF));
background: -webkit-linear-gradient(0% 0%, 0% 100%, from(#0096FF), to(#005DFF));
background: -moz-linear-gradient(center top, #0096FF, #005DFF);
background: linear-gradient(#0096FF, #005DFF);
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.3);
border-radius: 3px;
color: #fff;
}
</style>
</head>
<body>
<?php
include_once 'db_functions.php';
$db = new DB_Functions();
$users = $db->getAllUsers();
if ($users != false)
$no_of_users = mysql_num_rows($users);
else
$no_of_users = 0;
?>
<div class="container">
<h1>No of Devices Registered: <?php echo $no_of_users; ?></h1>
<hr/>
<ul class="devices">
<?php
if ($no_of_users > 0) {
?>
<?php
while ($row = mysql_fetch_array($users)) {
?>
<li>
<form id="<?php echo $row["id"] ?>" name="" method="post" onsubmit="return sendPushNotification('<?php echo $row["id"] ?>')">
<label>Name: </label> <span><?php echo $row["name"] ?></span>
<div class="clear"></div>
<label>Email:</label> <span><?php echo $row["klas"] ?></span>
<div class="clear"></div>
<div class="send_container">
<textarea rows="3" name="message" cols="25" class="txt_message" placeholder="Type message here"></textarea>
<input type="hidden" name="regId" value="<?php echo $row["gcm_regid"] ?>"/>
<input type="submit" class="send_btn" value="Send" onclick=""/>
</div>
</form>
</li>
<?php }
} else { ?>
<li>
No Users Registered Yet!
</li>
<?php } ?>
</ul>
</div>
</body>
</html>
It's using ajax to send it to GCM:
Send_message.php:
<?php
if (isset($_GET['regId']) && (isset($_GET["message"]))) {
$regId = $_GET['regId'];
$message = $_GET["message"];
include_once './GCM.php';
$gcm = new GCM();
$registatoin_ids = array($regId);
$message = array("price" => $message);
$result = $gcm->send_notification($registatoin_ids, $message);
echo $result;
}
?>
As you see, it gets everthing by id,
but I want to use one form, one submit button & one text field to send to multiple devices.
Would really appreciate it if someone could instruct me how to do it or give me some examples.
I don't know php, but GCM.php from the link you provided seems to already support sending push notifications to multiple devices :
public function send_notification($registatoin_ids, $message) {
// include config
include_once './config.php';
// Set POST variables
$url = 'https://android.googleapis.com/gcm/send';
$fields = array(
'registration_ids' => $registatoin_ids,
'data' => $message,
);
You should simply pass to the send_notification function an array that contains multiple Registration IDs, and it would send notifications to all of them.