I am Front end developer but never touched any backend language. So now I have to create a website for my client. They have supposed data of 500 items with 10 fields each in Excel file. Now they want to create a search engine within their website where we search for the name and all the info related to that name appears.Search should be only by 1 field that is name. Any help?
Even if I hire someone to help me out, what all technologies he/she should know?
Dont think its right thing to do. Using database would be a good idea but this is something you can do to overcome this issue.I think import your data to html table and do the following.
function myFunction() {
var input, filter, table, tr, td, i;
input = document.getElementById("myInput");
filter = input.value.toUpperCase();
table = document.getElementById("myTable");
tr = table.getElementsByTagName("tr");
for (i = 0; i < tr.length; i++) {
td = tr[i].getElementsByTagName("td")[0];
if (td) {
if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
} else {
tr[i].style.display = "none";
}
}
}
}
#myInput {
background-image: url('/css/searchicon.png');
background-position: 10px 12px;
background-repeat: no-repeat;
width: 100%;
font-size: 16px;
padding: 12px 20px 12px 40px;
border: 1px solid #ddd;
margin-bottom: 12px;
}
#myTable {
border-collapse: collapse;
width: 100%;
border: 1px solid #ddd;
font-size: 18px;
}
#myTable th, #myTable td {
text-align: left;
padding: 12px;
}
#myTable tr {
border-bottom: 1px solid #ddd;
}
#myTable tr.header, #myTable tr:hover {
background-color: #f1f1f1;
}
<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for names..">
<table id="myTable">
<tr class="header">
<th style="width:60%;">Name</th>
<th style="width:40%;">Country</th>
</tr>
<tr>
<td>Garry</td>
<td>Australia</td>
</tr>
<tr>
<td>Ben Hopkins</td>
<td>USA</td>
</tr>
<tr>
<td>Deric</td>
<td>UK</td>
</tr>
<tr>
<td>Ollie</td>
<td>Germany</td>
</tr>
</table>
First of all, You need a DBMS in you PC then make a Database here according to requirements. then using server side programming language like PHP, C#, Java etc. now you are able to make the search engine.
I am here to help you more if you need more help. thanks
Here are dome steps that might help you
1. You need a database and all the data inserted to it with specific fields.
2. Now On the front-end you need a from like this
<form method="post" action="">
<input type = text name="field_name_to_search">
<input type = submit name = "submit" value="submit" >
</form>
3. For displaying the data searched you need a database connection for the file in which you are writing your code.
4. After connecting with database you need to get the data with sql query and view in a required format. The query can be like this
<?php if(isset($_POST('submit'))){
$sql = "select * from database_table WHERE field_name_to_search =
$_POST('field_name_to_search')";
}
?>
5. Now you have all the data regarding the field searched in the variable $sql.
6. You can check the data by print_r($sql) function. You have all the data that is searched you can parse it into your html using a (for) loop.
If you hire a developer just show him this answer. I am sure he will get my point.
Related
Okay I tried this before and it got closed because it wasn't specific. Below is my entire page code. Please ignore the font and html stuff because all of that is working fine. My Specific question is how to alter this so that the column called "Given" is reset to 0 (zero) at the first day of each month automatically. I am only specifically asking for how to make this happen.
Everything else is working to manually add and subtract, etc. I only need assistance in making that column reset to zero on the first day of each month.
TO BE EVEN MORE SPECIFIC the column "OWED" in the database should be reset to 0 (zero) at the first day of each month automatically to achieve this.
I am new to coding and this code was made for me months ago, and while I have learned a lot since then, I do not seem to find any example to learn from on how to make what I am asking happen. Thank you
EDIT - The objective is to reset all of the rows in the "Owed" column at the same time. Either automatically each month, or manually with one button (or image button)
<?php
$servername = "localhost";
$username = " ";
$password = " ";
$db=" ";
$conn = mysqli_connect($servername, $username, $password,$db);
// $sql = "INSERT INTO `number`( `number`)
// VALUES ('$qty')";
$sql = "SELECT id,name,requests,owed FROM record ORDER BY name";
$result = $conn->query($sql);
?>
<!DOCTYPE html>
<html>
<head>
<style>
table#customers {
width: fit-content;
margin: auto;
margin-top: 2px;
}
#customers {
font-family: Arial, Helvetica, sans-serif;
border-collapse: collapse;
width: 100%;
}
#customers td, #customers th {
border: 2px solid #B7B7B7;
padding: 4px;
}
#customers tr:nth-child(even){background-color: #ffffff;}
#customers tr:nth-child(odd){background-color: #f2f2f2;}
#customers tr:hover {background-color: aliceblue;}
#customers th {
padding-top: 2px;
padding-bottom: 2px;
text-align: center;
background-color: #FFB951;
color: black;
}
.sub-add{
float: right;
}
span.sub-add a {
text-decoration: none;
margin: 1px;
}
</style>
</head>
<body leftmargin="0" topmargin="0">
<meta http-equiv="refresh" content="10" >
<table id="customers" bgcolor="#CCCCCC">
<tr>
<th height="5" width="20%">Name</th>
<th height="5" width="20%" style="display:none">Requests</th>
<th height="5" width="10%">Earned</th>
<th height="5" width="10%">Given</th>
<th height="5" width="10%">Owed</th>
</tr>
<?php
if ($result->num_rows > 0) {
// output data of each row
while($row = $result->fetch_assoc()) {
$earned = $row["requests"]/1;
$owed = $row["owed"];
$earned = (int)$earned;
$owedtoo = $earned - $owed;
echo '<tr><td><center><b><font color="Orange">'.$row["name"].'<font></b><br><a onclick="return confirm(\'Are You SURE You Want To Delete?\')" href="delete.php?id='.$row['id'].'">Delete</a> | Edit
</center></td><center><td style="display:none"><center>'.$row["requests"].'<span class="sub-add"><span>-</span> <span> +  </center></span></span></td></center><td><center><b><font color="green">'.$earned.'</font></b></td><center><td><center><b>'.$row["owed"].'</b><span class="sub-add"><span> - </span> <span> + </span></span></center></td><td><center><b><font color="red">'.$owedtoo.'</font></b></td></tr>';
}
}
?>
</table>
</body>
</html>
<?php $conn->close(); ?>
Use cron jobs for routine or date/time specific tasks.
Good question thread here: How to create cron job using PHP?
I am using PHP to call data from a Microsoft SQL Database. That functionality is working, however when PHP updates the table's data it is overriding some of the formatting. One big specification I wanted was to have a max-height of 400px and once it crosses that the table becomes scroll-able.
Some context: I am running this on a local PHP server.
I have tried adding !important tags but that did not work.
<table id = 'tbl' class='table'>
<thead id = 'heading'>
<tr>
<td scope="col" >Applicant ▼</td>
<td scope="col">Grantee EIN</td>
<td scope="col">State</td>
<td scope="col">FAC Accepted Date</td>
<td scope="col">Expenditures</td>
<td scope="col">Prior Finding</td>
<td scope="col">Audit</td>
</tr>
</thead>
<div id = 'scrollbody'>
<tbody>
<?php
$result = array();
do {
while ($row = sqlsrv_fetch_array($stmt, SQLSRV_FETCH_ASSOC)){
echo '
<tr>
<td>'.$row["AUDITEENAME"].'</td>
<td>'.$row["EIN"].'</td>
<td>'.$row["STATE"].'</td>
<td>'.$row["FACACCEPTEDDATE"].'</td>
<td>'.$row["TOTFEDEXPEND"].'</td>
<td>'.$row["PYSCHEDULE"].'</td>
<td><input type="checkbox" oninput=""></td>
</tr>
';
}
} while (sqlsrv_next_result($stmt));
// sqlsrv_free_stmt($stmt);
// sqlsrv_close($conn); //Close the connnectiokn first
// echo json_encode($result); //You will get the encoded array variable
?>
</tbody>
</div>
</table>
#tbl {
margin: auto;
top: 0px;
height: 100%;
max-height: 400px;
position: relative;
font-family: 'Segoe UI';
box-shadow: 0px 0px 5px 2px rgb(240, 240, 240);
perspective: 1px;
border-radius: 0px 0px 20px 20px;
white-space: nowrap;
width: 100%;
z-index: 1;
}
What I want to see is a table of 400px height, but instead a table of much longer height is being displayed.
So, there are 2 options:
Wrap the table in with a wrapper and give the max-height to that element.
<div id="table-wrapper">
<table>
{Your stuff...}
</table>
</div>
Give the thead, tbody a display: block property. With which again your CSS styles will come into use.
First you need to know how a browser works.
The browser will not show anything until this steps are made:
Your browser request a file like html or php first.
Then it will check the styling (CSS/SCSS).
Checking for JavaScript.
checking for source like an image or other media.
Only then it will display the page.
So if you want to style after this process, you will need JavaScript.
JavaScript is invented to manipulate or modify the DOM (document object Model).
That means, you can point to an element and style it, remove it, add a new element etc.
For a better format I prefer jQuery.
jQuery is another way to code JavaScript. (jQuery = JavaScript, just in another form) jQuery calls the JS library.
you can't set header of a table, a table height is based on his content, if you need a table with a specific height you need to change the display type and add overflow rule:
#tbl {
margin: auto;
top: 0px;
height: 100px;
max-height: 400px;
position: relative;
font-family: 'Segoe UI';
box-shadow: 0px 0px 5px 2px rgb(240, 240, 240);
perspective: 1px;
border-radius: 0px 0px 20px 20px;
white-space: nowrap;
width: 100%;
z-index: 1;
display:block;
overflow:auto;
}
Here a live fiddle https://jsfiddle.net/g7fuLhyp/
I have a php table retrieved dynamically from Mysql, and i also have an input field in the table to edit a column.
When i clicked anywhere on the table, the table would disappear - so i used pointer-events: none; in the css. This cured the problem, however now when i click the input field to type something in, the table disappears again.
I do not want the table to disappear when i click on the input field to type something in.
I have tried many different Pointer events in the css of the input field without any luck...and if i take the pointer-events: auto; out of the css for the input field, i cannot click on the input field at all
Below is my code - Does anyone know what i am doing wrong?
Code for my Table:
<div id="table1" class="table1">
<form action="" method="post">
<?php
if(isset($_POST["submit"]))
{
$searchTerm=$_POST['search'];
$stmt = $conn->prepare(" SELECT question.description AS question, answer.description AS answer, discipline.name AS name, response.responseid AS responseid, response.response AS response, response.student_id AS student_id, response.Date_Time AS Date
FROM response
INNER JOIN answer ON response.question_id = answer.answerid
INNER JOIN question ON response.question_id = question.qid
INNER JOIN discipline ON response.discipline_id = discipline.disciplineid WHERE Date_Time LIKE :searchTerm");
$stmt->bindValue(':searchTerm','%'.$searchTerm.'%');
$stmt->execute();
$result=0;
/*
The above code is a query which selects attributes according to the search term
*/
echo "<table> <tr><th>Discipline</th><th>Question</th><th>Student ID</th><th>Response</th><th>Date & Time</th><th>Answer</th><th>Final Marks</th></tr>";
while ($response = $stmt->fetch()) /* This is a While loop which iterates each row */
{
echo " <tr><td>".$response["name"]."</td><td>".$response["question"]."</td><td>".$response["student_id"]."</td><td>".$response["response"]."</td><td>".$response["Date"]."</td><td><input type='text' name='date' value=". $response["answer"]."></td></tr> ";
$result++;
}
} /* This bit of code closes the connection with the database */
?>
<input type="submit" name="save" value="save">
</form>
</div>
CSS:
.table1 {
position: fixed;
pointer-events: none;
background-color: white;
border-collapse: collapse;
width: 40px;
color: black;
margin-left: 50px;
margin-top: 66px;
white-space: nowrap;
}
.table1 input {
pointer-events: auto;
width: 20px;
height:25px;
}
Need some help.
I'm creating a table view with grid/borders.
However,some borders can't be seen although I'm including in tags the style=''.
Much better if I will tell that I only see the table border which is included in table tag.
Please see attached file for the format.
By the way I'm getting the records in database via PHP script.
Here is my code:
$result.="<br/><br/><br/>
<table style='border:solid 1px;'>";
$result.="<thead style='border-bottom:thin solid'><th style='text- align:center;border-style:solid 1px'>YC ".$store_name."</th></thead>
<tr><td></td>
<td colspan='3'>Service Time </td>
<td colspan='3'>Production Time</td>
<!--<td colspan='3'>Customer Feedback</td>
<td colspan='3'>Customer Feedback</td>
<td colspan='3'>Customer Feedback</td>-->
</tr>
<tr></tr>
<tr>
<td></td>
<td>TC Within<br>30 mins.</td>
<td>Total<br>TC</td>
<td><br/>%</td>
<td>Within 15 <br/>mins.</td>
<td>Total <br/>TC</td>
<td><br/>%</td>
</tr>
<tr></tr>";
//get PartView
$query = "SELECT * FROM Part_view WHERE StoreID = ".$store_id." AND datepart(month,TransDate) = '".$month."' AND datepart(year,TransDate) = '".$year."' ORDER BY TransDate ASC ";
$que = mssql_query($query);
while($row=mssql_fetch_array($que)){
$transdate =date('d',strtotime($row['TransDate']));
$tc30 = $row['TC30'];
$totaltc30 = $row['Total_TRX1'];
$hitrate = round($row['Hitrate']);
$pd15 = $row['PDT15'];
$totalpd15 = $row['Total_TRX2'];
$production = round($row['ProdTime']);
$excellence = $row['Excellence'];
$totalexcellence = $row['Total_TRX4'];
$excellencepercent = round($row['ExcelPercent']);
$good = $row['Good'];
$totalgood = $row['Total_TRX5'];
$goodpercent = round($row['GoodPercent']);
$poor = $row['Poor'];
$totalpoor = $row['Total_TRX6'];
$poorpercent = round($row['PoorPercent']);
if($hitrate==""){
$hitrates = "";
}else{
$hitrates = $hitrate;
}
$result.="<tr>
<td>".$transdate."</td>
<td>".$tc30."</td>
<td>".$totaltc30."</td>
<td>".$hitrate."% </td>
<td>".$pd15."</td>
<td>".$totalpd15."</td>
<td>".$production."% </td>
</tr>";
}
$result.="</table>";
echo $result;
Can someone help me?
OK, I think what you are actually asking is why the entire grid isn't being 'bordered'. You can use CSS to accomplish this far cleaner than inline styles. You need to set styles for TD.
Code:
table {
border-width: 1px;
border-spacing: 0px;
border-style: solid;
border-color: black;
border-collapse: separate;
background-color: white;
}
table th {
border-width: 1px;
padding: 3px;
border-style: solid;
border-color: black;
background-color: white;
}
table td {
border-width: 1px;
padding: 3px;
border-style: solid;
border-color: black;
background-color: white;
}
If you use this in your CSS you can remove all the inline styling you have already, this code will fix it all.
You can use this tool to create the table. But I recommend you to do that by yourself. And you should include your code and we can help you to fix that.
Tool: http://divtable.com/generator/
I am having an issue with my CSS, It is by far something i am not good at but i cant seem to solve an issue where my Table will not display based on screen width. It used to be static but since changing the values to % of screen it has not made any visual changes to my Table. (UPDATED BASED ON ANSWERS/COMMENTS)
HTML / PHP
//Table Titles row
echo "<div class='tablediv' style='width:100%; border: 5px solid black'><table name ='ipv4' class='tableparent'><td class='tabled' width='100%'>IP Address</td><td class='table'>Subnet</td><td class='table'>PC Name</td><td class='table'>Owner</td><td class='table'>Customer</td><td class='table'>Customer Site</td></tr>";
//loops through search results and echo table
while ($row = mysqli_fetch_array($view)){
$id = $row['companyId'];
$company = $customers[$id];
echo "<tr><td class='tabled'>". $row['ip']."</td><td class='table'>". $row['Subnet']."</td><td class='table'>".$row['hostName']."</td><td class='table'>". $row['owner']."</td><td class='table'>". $company ."</td><td class='table'>".$row['siteName']."</td></tr>";
}
echo"</table></div>";
CSS
.table
{
border:1px solid black;
text-align: left;
padding:10px;
width:12%;
overflow:hidden;
}
.tabled
{
top:500px;
border:1px solid black;
text-align: left;
width:40%;
overflow: hidden;
}
.tableparent
{
border:1px solid black;
border-collapse:collapse;
width: 95%;
text-align: left;
padding:15px;
table-layout:fixed;
}
.tablediv
{
position:absolute;
width: 95%;
top:70px;
}
Currently this displays the table looking like this
Add width="100%" in table tag, it will set full width as parent div width
echo "<div class='tablediv' style='width:100%'><table width='100%' name ='ipv4' class='tableparent'><td class='tabled'>IP Address</td><td class='table'>Subnet</td><td class='table'>PC Name</td><td class='table'>Owner</td><td class='table'>Customer</td><td class='table'>Customer Site</td></tr>";
Found the issue, The page was POST'ed to by ajax. I then found that the result's div of the search was accidentally surrounded by another div, limiting its width. Thanks for the help