I am working on a search project where results should be based on user interest.
I have a database column "favmusic" & "favsport" .
I have declared them as variables in PHP.
Now in the following simple Search code(using HTML & Javascript) ,
I just want to know is it possible to add that database variable to perform search based on taking values from the database variable
Here is my Code :
<input type="text" name="search" id="search" style="width:400px;"/>
<input type="button" name="searchBtn" id="searchBtn" value="Search" onclick="searchLink()"/>
<script language="javascript" type="text/javascript">
function searchLink()
{
var link1 = document.getElementById("search").value;
window.location.href = 'https://www.google.co.in/#q='+$favsport '+$favmusic;
}
</script>
If you see the JavaScript code you can understand that i have added the columns for performing search in addition to database variable.
How can i fix this ?
Here is all code
suppose you have php array
<?php $fieldArray=array('fruits','gold','pen');?>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script>
$(function() {
var availableTags = <?php echo jsonencode($fieldArray)?>
$( "#search" ).autocomplete({
source: availableTags
});
});
</script>
</head>
Here is input type
<input type="text" name="search" id="search" style="width:400px;"/>
You can use jquery auto complete Jquery Autocomplete
put this code
$( "#search" ).autocomplete({
source: availableTags
});
Just fetch your fields and create one php array like $favsport_favmusic=array().
Then create javascript array like in above example(open link and click on view source)
` var availableTags=<?php echo jsonencode($favsport_favmusic);?>;` .
Hope this will work for you.
As I understand you, you want to get a value from the database and add that to the search query, correct?
You can most definetly do this - try looking up PHP Database connection( https://www.google.dk/search?q=php+database+connection&oq=PHP+Database )
Let me know if you need any further help :-)
UPDATE: To have the variables output to the browser in JS, you would do something like
So the final JS block looks like:
<script language="javascript" type="text/javascript">
function searchLink()
{
var link1 = document.getElementById("search").value;
window.location.href = 'https://www.google.co.in/#q= <?php echo $favsport."+".$favmusic ?>';
}
</script>
JavaScript is just like HTML when it comes to PHP, so you have to echo your PHP results in the JavaScript code.
window.location.href = "https://www.google.co.in/#q=<?php echo urlencode($favmusic.' '.$favsport); ?>"
#paicubes ... i had edited this code ..can you please tell me it is correct or not
<?php
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>SearchProject | Home Page<?php echo $websiteName; ?> </title>
<?php require_once("db-con.php"); ?>
</head>
<body>
<input type="text" name="search" id="search" style="width:400px;"/>
<input type="button" name="searchBtn" id="searchBtn" value="Search" onclick="searchLink()"/>
$( "#search" ).autocomplete({ source: availableTags });
$favsport_favmusic=array()
<script language="javascript" type="text/javascript">
function searchLink()
{
var link1 = document.getElementById("search").value;
var availableTags=<?php echo jsonencode($favsport_favmusic);?>;
}
</script>
</body>
?>
Related
I am using JQuery to test the size of an input after submitting a form:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Page 1</title>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<form method="post" action="essai.php">
<input type="text" name="mail" id="email" placeholder="mail"/><br />
<input type="submit" name="submit" value="Validate" />
</form>
<?php
if (isset($_POST['submit'])){
echo($_POST['mail']);
if(isset($_POST['mail'])){
$data=789;
}
}
?>
<script>
$(function(){
var data = <?php echo json_encode($data); ?>;
$("form").on("submit", function() {
if(data.toString().length < 4) {
alert(data);
return false;
}
});
});
</script>
</body>
</html>
The problem is that the alert (if I enter only 1 caracter for instance) does not pop up after the 1st submitting but only after the others.
Thank you
First, it's terribly insecure to embed PHP code within JavaScript. I can't think of one reason why you will want to use server-side code on the client-side. As an alternative, echo the javascript code from PHP, not the other way round.
Now your problem comes up because the first time the page is loaded, nothing is posted. You have some chunk of code which executes only after something gets posted. If your PHP script can display errors, you will see an undefined variable notice thrown the first time you load the code. You can work around that by declaring the variable before using it in the condition:
$data = 0; // Initialize variable here
if (isset($_POST['submit'])){
echo($_POST['mail']);
if(isset($_POST['mail'])){
$data=789;
}
}
I'm making a site for some peaple of my class and I want them to be able to login. I don't want to make an extra loginpage, so I created this bit of code for my login system, but it doesn't work. I looked al over the internet to find other soloutions, but with no success... I want the person to type in their username and password and I want to store that information in a javascript function, so that I can do a function like tis:
function passCheck () {
if (pass="johndohpassword1234") // userbname johndoe and passsword password1234
{
document.getElementById('h').innerHTML= "welcome, John!";
}
this is my code:
<?php
$id = $_POST[username] . $_POST[password];
?>
<html>
<head>
<title>Login</title>
<script type="text/javascript" src="script.js">
var pass=" <?php echo "$id"; ?>";
window.alert( "welkom, " + pass );
</script>
</head>
<body>
<h1 id="h">Login</h1> <br>
<form action="http://timkast.tk" method="post">
<b>Username:</b><input type="text" name="username"> <br>
<b>Password:</b><input type="password" name="password"><br>
<input type="submit"></input>
</form>
</body>
</html>
everything works fine, but the code for window.alert does nothing and I dont know why, please can someone explain/fix this?
When you specify a src for the script tag, it ignores the contents of the script tag.
As specified in the documentation:
If a script element has a src attribute specified, it should not have a script embedded inside its tags.
You can't write code into a <script> tag with reference to external file <script src="...">.
You have:
<script type="text/javascript" src="script.js">
var pass=" <?php echo "$id"; ?>";
window.alert( "welkom, " + pass );
</script>
And you need:
<script type="text/javascript" src="script.js"></script>
<script>
var pass=" <?php echo "$id"; ?>";
window.alert( "welkom, " + pass );
</script>
So, I tried everything that I know and I tried to find everywhere but no luck. I want to paste imdb link into (id="id_imdb") and then when I press button (name="b") I want that link to become variable $hjo and then to execute php script get_info_imdb.php and then return variable $slbl into javascript which will set textarea (name="movie_desc") to echo $slbl.
insert-movie.php
<html>
<body>
<?php
global $hjo;
$hjo = "http://www.imdb.com/title/tt1431045/";
include ("get_info_imdb.php");
?>
<form action="insert_movie.php" method="post" enctype="multipart/form-data">
<div>
<div>
<div>Description:</div>
<div><textarea name="movie_desc" rows="7" cols="50" id="id_desc" value="<?php echo (isset($slbl))?$slbl:'';?>"></textarea></div>
</div>
<div>
<div>Imdb:</div>
<div><input id="id_imdb" type="text" name="movie_imdb" size="50">
<button name="b" type="button">Button</button></div>
</div>
<div>
<div><input type="submit" name="submit" value="Publish"></div>
</div>
</form>
<script type="text/javascript">
function myFunction() {
document.getElementById("id_desc").value = "<?php echo $slbl; ?>";
}
</script>
</body>
</html>
<?php
...here is script to insert in database which is working...
?>
get_info_imdb.php
<?php
include ("simple_html_dom.php");
$html = new simple_html_dom();
$html->load_file($hjo);
$html = $html->find('.summary_text', 0);
$nesto = strip_tags($html);
$nesto = trim($nesto);
$slbl = $nesto;
?>
This is an example to explain how to perform your request through javascript and jQuery. It's only an example, you have to implement it wih your own code:
File get_info_imdb.php:
<?php
$movieID = $_GET['id'];
// Your code to retrieve movie info and chunk of HTML you want put in textarea
echo $TextAreaValue;
?>
Fle insert-movie.php:
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
</head>
<body>
<script type="text/JavaScript">
function getHTML()
{
$.get( "get_info_imdb.php?id=tt1431045", function( data ) {
$( "#myTextArea" ).html( data );
});
}
</script>
<form action="YourAction.php" method="YourMethod">
<textarea id="myTextArea"></textarea>
<button id="myButton" onclick="getHTML(); return false;">Click Me</button>
</form>
</body>
</html>
In the <head><script> I load jQuery; In javascript function getHTML() I use jQuery get method to retrieve desired url (I have insert movie id, you can insert variable id with php) and put it into the content of textarea #myTextArea.
In the <form> the <button id="myButton"> call getHTML() js function.
See more about jQuery
See more about jQuery.get method
See an alternative in javascript
I am working on an autocomplete script where i first read files from a local directory using php as shown below:
<?php
$file = glob('pages/*');
//var_dump($file);
foreach($file as $value)
{
$output = substr($value, 6, strlen($value) - 6);
//echo($output)."<br>";
}
?>
the above script displays all the files in the 'pages' folder i.e pageone.html,pagetwo.html....
i then use a javascript file to dispaly a text field that when entered for example 'page', should show aome autocomplete options say 'pageone.html' or 'pagetwo.html' e.t.c
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Autocomplete - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
var availableTags = ["
<?php echo $output; ?>"
];
$( "#tags" ).autocomplete({
source: availableTags
});
});
</script>
</head>
<body>
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags">
</div>
</body>
</html>
i combine the above php code with this js to a single php file
as shown, i try embedding the '$output' into the js 'availableTags' variable but when i type something on the text field, nothing happens..i'm sure it has to do with the php code embedded in the js so any help would be appreciated
Your $output contains only a single value (last file in your list). You can create an array of files like:
$res = array();
foreach($file as $value)
{
$res[] = substr($value, 6, strlen($value) - 6);
}
and pass it to javascript as: a javascript array (with json_encode function)
<script>
$(function() {
var availableTags = <?=json_encode($res)?>
...
You can use autocomplete.js. It's more lite and easy to use that jQuery UI.
I am learning jquery.ajax but I cant understand something
<html>
<head>
<title>the title</title>
<script type="text/javascript"
src="/jquery/jquery-1.3.2.min.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$("#driver").click(function(event){
var cacat = $("#nam").val();
$("#stage").load('/jquery/result.php', {"name":cacat} );
alert(cacat);
});
});
</script>
</head>
<body>
<p>Enter your name and click on the button:</p>
<input type="input" id="nam" size="40" /><br />
<div id="stage" style="background-color:blue;">
STAGE
</div>
<input type="button" id="driver" value="Show Result" />
</body>
</html>
and here is the Php FIle
<?php
if( $_REQUEST["name"] )
{
$name = $_REQUEST['name'];
echo "Welcome ". $name;
}
?>
I don't understand what is this $("#stage").load('/jquery/result.php',{"name":cacat});
because it's also working with $("#stage").load('result.php', cacat );
So here comes the question:
What's the difference between {"name":cacat} and cacat? Also both scripts do the same thing, the jQuery gets the value of the input and the PHP also gets the value of the input, why so?
The difference is that the first one sends a JSON object which gets to $_REQUEST whereas the other one sends the value, without the JSON form.