How to save search engine entry to csv file - javascript

I am trying to make a search engine by comparing any search entry to my csv files. But i am not able to save my search entry into csv file. Below are my html code.
<!DOCTYPE html>
<html>
<head>
<title>Search Engine</title>
<meta name="viewreport" content="width=device-width", intial-scale=1>
<link rel="stylesheet" href="css/style.css"/>
<script type="text/javascript" src="validate.js"></script>
</head>
<body>
<div class="container">
<h1 class = "title">Search Engine</h1>
<form name="search" action="search.php" method="post">
<div class="input-group">
<input type="text" class="form-control" placeholder="Search" name="search" id="search">
<div class="input-group-btn">
<button class="gobtn" type="submit">Go!</button>
<i class="glyphicon glyphicon-search"></i></button>
</div>
</div>
</form>
</div>
</body>
</head>
</html>
And this is my search.php code
<?php
$keys = array('search');
$csv_line = array();
foreach($keys as $key){
array_push($csv_line,'' . $_GET[$key]);
}
$fname = 'search.csv';
$csv_line = implode(',',$csv_line);
if(!file_exists($fname)){$csv_line = "\r\n" . $csv_line;}
$fcon = fopen($fname,'a');
$fcontent = $csv_line;
fwrite($fcon,$csv_line);
fclose($fcon);
?>
Whenever I tried to search something, i kept on getting errors on the line array_push($csv_line,'' . $_GET[$key]);
TQ in advance!

Related

access table from PHP database in Javascript

I have created a login page that allows you to log in using username and password. However, it is currently so that you are always redirected to the "profile" page and there is then checked by PHP whether the login data are correct, because the data are on the DB.
Therefore I have the idea with a validate function directly on the loginpage to check if the data is correct and then I just create a session.
Does anyone have an idea how I can do this?
Here is the code:
<?php session_start();?>
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>Login</title>
<link href="bootstrap_style.css" rel="stylesheet" id="bootstrap-css"> <!-- maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css -->
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script> <!-- //maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js or bootstrap.js-->
<script src="jquery.js"></script> <!-- //cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js -->
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="wrapper fadeInDown">
<div id="formContent">
<!-- Tabs Titles -->
<!-- Icon -->
<div class="fadeIn first">
<img src="default_logo2.png" id="icon" alt="User Icon" onclick="window.open('url', '_blank');"/>
</div>
<!-- Login Form -->
<form action="searchpage.php" method="post" onsubmit="validateForm(event);">
<input type="text" id="login" class="fadeIn second" name="username" placeholder="username">
<input type="password" id="password" class="fadeIn third" name="password" placeholder="password">
<input type="submit" class="fadeIn fourth" value="Log In">
</form>
<!-- Remind Passowrd -->
<div id="formFooter">
<a class="underlineHover" style="color:red" id="warning"></a>
</div>
</div>
</div>
</body>
</html>
<script type="text/javascript">
function validateForm(event) {
var input_username = document.getElementById("login");
var input_password = document.getElementById("password");
if (input_username.value == '' || input_username.value.charAt(0) == ' ' || input_password.value == '') {
event.preventDefault();
document.getElementById("warning").innerHTML = "Fill empty fields!";
}
else {
return true;
}
}
</script>
with this I reach the DB:
$pdo = new PDO('mysql:host=localhost;dbname=ausleihe', 'root', '');
and that is the SELECT:
$login_session = "SELECT * FROM login WHERE username = '".$hereshouldbetheusernamefromform."' AND password = '".herethepasswordfromform."'";
If you need more code or have questions, ask me!
Thx
Client-side JavaScript cannot directly access a Host-side PHP program except through AJAX calls. Only the Host-side software has access to Host-side databases.

Save insert from to file

I have a input form and want to save the data that I haved insert into a file. Should I use get and set for this? Anyone have any ideas on what I should do?
function myfunction() {
if (validation()) // Calling Validation Function
{
// Serializing Form Data And Displaying It In <p id="wrapper"></p>
document.getElementById("wrapper").innerHTML = serialize(document.forms[0]); // Serialize Form Data
document.getElementById("form").reset(); // Reset Form Fields
}
}
function validation() {
var name = document.getElementById("namn").value;
var number = document.getElementById("number").value;
}
<!DOCTYPE html>
<html lang="sv">
<head>
<title>Write</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="style.css">
<script src="http://form-serialize.googlecode.com/svn/trunk/serialize-0.2.min.js" type="text/javascript"></script> <!-- For Serialization Function -->
<script src="hej.js"></script> <!-- Include JavaScript File Here-->
</head>
<body>
<div id="main">
<div id="login">
<hr/>
<form action="" method="post">
<label>Name:</label>
<input type="text" name="name" id="name" required="required" placeholder="fill in your name"/><br /><br />
<label>Number :</label>
<input type="text" name="number" id="number" required="required" placeholder="0876856"/><br/><br />
<input onclick="myfunction()" type="submit"id= "submit" value=" Submit " name="submit"/><br />
</form>
</div>
</div>
</body>
</html>
Thanks in advance!
If you use the normal $_POST you can access the data over $_POST and write it with fopen, fwrite to a file. Over ajax you have to send the Data to a PHP File and do the same there. You cant access the local filesystem over Javascript.
<?php
if(isset($_POST) && !empty($_POST){
// reformat your data here and format it
$yourDataToWriteInTheData = $_POST['firstname'] . '|' . $_POST['lastname'] . PHP_EOF;
// Open the file (or create it, read the fopen manual)
$fileHandler = fopen('file1.txt', 'a+');
fwrite($fileHandler, $yourDataToWriteInTheData);
fclose($fileHandler);
}

PHP Header redirect issue

I have this code that works well and can actually insert data. My problem is in the redirecting back to the page I was from. I have an index.html and add_cars.php
The index.html is like so:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Document</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function(){
$('#search').keyup(function(){
var search = $('#search').val();
$.ajax({
url:'search.php',
data:{search:search},
type:'POST',
success:function(data){
if(!data.error){
$('#result').html(data);
}
}
});
}); // Search function end
$("#add-car-form").submit(function(evt){
evt.preventDefault();
var postData = $(this).serialize();
var url = $(this).attr('action');
$.post(url, postData, function(php_table_data){
$("#car-result").html(php_table_data);
});
}); // add car function end
}); // Document ready function end
</script>
<div id="container" class='col-xs-6 col-xs-offset-3'>
<div class="row">
<h2 >Search the Database</h2>
<input type="text" name="" class='form-control' name='search' id='search' placeholder='Search our inventory'>
<br>
<br>
<h2 class="bg-success" id="result">
</h2>
</div>
<div class="row">
<form id="add-car-form" class="col-xs-6" action="add_cars.php" method="post">
<div class="form-group">
<input type="text" name="car_name" placeholder="Car name" class="form-control">
</div>
<div class="form-group">
<input type="submit" class="btn btn-primary" value="Add Car" name="">
</div>
</form>
<div class="col-xs-6">
<div id="car-result">Sometkasdf</div>
</div>
</div>
</div>
</body>
</html>
and my add_cars.php is like so:
<?php
include("db.php");
if(isset($_POST['car_name'])){
$car_name = $_POST['car_name'];
$query = "INSERT INTO cars(car) VALUES ('$car_name')";
$query_car_name = mysqli_query($connection, $query);
if(!$query_car_name){
die("QUERY FAILED");
}
header("Location: index.html");
exit;
}
?>
When I redirect back to my index.html, I am getting two forms. It's like the first form is copied at the end of it. To be exact, the first form is copied to the #car-result div. What should happen is; it should go back to my index.html and the input box should only have the placeholder value. What am I doing wrong here or what should I do? All help is appreciated.

Uncaught ReferenceError: 'somevar' is not defined

Am trying to insert some data into mysql through ajax call but while am trying to get the data from my form javascript throws me this error "Uncaught ReferenceError: anjelis is not defined" on the first variable
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>aloooooooooooooo!!!!!!!!!</title>
<link rel="stylesheet" href="bootstrap/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="css.css">
<script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="bootstrap/js/bootstrap.js"></script>
<script src="js/main.js"></script>
<script src="js/ajax.js"></script>
<script>
$(document).ready(function(e){
$.ajaxSetup({cache:false});
setInterval(function(){$('#chatlog').load('logs.php');},1000);
setInterval(function(){$('#user_list').load('user_list.php');},1000);
});
function submitChat(){
var uname=<?php echo $_SESSION['username']?>;
var msg=form.msg.value;
var xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById('chatlog').innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open('GET','insert.php?username='+uname+'&msg='+msg,true);
xmlhttp.send();
}
</script>
</head>
The body
<body>
<nav class="navbar navbar-inverse">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="#">ChatCY</a>
</div>
<ul class="nav navbar-nav navbar-right">
<li><?php if(!isset($_SESSION['username'])){echo 'Login/Signin';}else{
echo'Logout';}?></li>
</ul>
</div>
</nav>
<div class="container">
<div class="row">
<div class="col-md-8">
<div class="panel panel-default">
<div id="chatlog" class="panel-body"></div>
</div>
</div>
<div class="col-md-2">
<div class="panel panel-default">
<div id="user_list" class="panel-body"></div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-8">
<form class="form-inline">
<form name="form" class="form-group" onsubmit="return false;">
<input type="textarea" class="form-control" name="msg" style="width:90%;"<?php if(!isset($_SESSION['username'])){
echo 'disabled="disabled" placeholder="You must be logged in to chat .."';}?>></input>
<button type="button" class="btn btn-default" name="send" <?php if(!isset($_SESSION['username'])){
echo 'disabled="disabled"';}?> onClick="submitChat();">send</button>
</form>
</form>
</div>
</div>
</div>
There are a lot of issues in your code.
Quotes are missing in the variable. Add quotes here:
var uname = "<?php echo $_SESSION['username']?>";
Session is not started. Start the session using:
session_start();
Try not to mix up both PHP and HTML. Keep it separate. Don't use echo to write the HTML tags.
No <input /> has an ending tag, and there's no <input type="textarea"... It should be replaced with <input type="text".
Use jQuery or some other awesome libraries for doing complex functions like AJAX calls or something. That makes your and dev's life easier, by providing functions for all the browsers and less clutter of code.
$.ajax(function () {
"url": "/",
// Blah Blah
});
You missed the code
session_start(),
well you can do it another way, create a inpu tag in your html
<input type='hidden' id='uname' value="<?php echo $_SESSION['username']?>">
in js
get your id like this
var uname = $('#uname').val();
Missed the quotes -
var uname= "<?php echo $_SESSION['username']?>";
var form = $('form.form-group');
If it is
var uname = somevar;
somevar will be undefined.
You are not passing or defining form to the function or inside the function.

How to use ACE editor to edit and save a file

I'm a dummy in HTML.
In my project, I want to use ACE editor to allow the user editing and saving a file.
I succeed to load the file, and to open it with ACE editor.
The problem is how to save it.
For this part, I need your help.
Here is the code I wrote to use ACE.
<?php
if(isset($_POST["save_modification"])){
$file = "./".$_POST["file_name"];
$file_ptr=fopen($file,"w");
fwrite($file_ptr,$_POST["content"]);
fclose($file_ptr);
}?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" media="all" type="text/css" href="./css/style.css" />
<title>Test</title>
</head>
<body>
<div class="site">
<div class="header">
<span>Test</span>
</div>
</div>
<div class="clean"></div>
<div class="corp">
<div class="corp_ctn">
<h1>Edit a file</h1>
<div id="content" class="paragraphe">
<?php
$dir=opendir("./");
while($file=readdir($dir)){
if(!in_array($file, array(".",".."))) {
echo '<div style="float:left; margin:0 10px; text-align:center;"><a href="?f='.$file.'">';
echo $file;
echo '</a></div>';
echo '<br/>';
}
}
?>
<br clear="all"/>
<?php
if(isset($_GET["f"])) {
echo "<h1>{$_GET["f"]}</h1>";
$file = "./".$_GET["f"];
$content = file_get_contents($file);
?>
<form method="POST" action="index_select_lua_script.php">
<div id="editor" name="content" style="width:100%;height:200px;">
<?php echo $content ?>
</div>
<script src="js/ace/ace.js" type="text/javascript" charset="utf-8"></script>
<script>
var editor = ace.edit("editor");
editor.setTheme("ace/theme/monokai");
editor.getSession().setMode("ace/mode/lua");
editor.getSession().setTabSize(4);
editor.setHighlightActiveLine(true);
editor.resize();
</script>
<input type="hidden" name="file_name" value="<?php echo $_GET["f"] ?>" />
<input type="submit" name="save_modification" value="Save modification" />
</form>
<br/><br/>
<?php
}
?>
</div>
</div>
</div>
</div>
When I save my modification, using the save button, the content is empty.
Please, do you have an idea of how I can do it?
Thank you
The HTML5 Filesystem API handles tasks like this quite well now. There are a few ways of capturing the contents of the editor area, and once you've done that you can save it.
Look at something like:
http://www.codeproject.com/Articles/668351/HTML-File-API-Capability-and-Compatibility
http://blog.teamtreehouse.com/building-an-html5-text-editor-with-the-filesystem-apis
http://www.html5rocks.com/en/tutorials/file/filesystem/
Can't remember where, but you can ZIP files together using JS now as well, if you so wish.

Categories

Resources