i am trying to do google search from my page and the search is based on specific set of strings.
So the following code has a PHP array field with some values.
So if i need to use them when performing search ,how to do that,i tried to work on following code but it is not working.My code is here
<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>
<?php $fieldArray=array('fruits','gold','pen');?>
<script>
function searchLink()
{
var link1 = document.getElementById("search").value;
window.location.href = 'https://www.google.co.in/?q='+link1;
}
$(function() {
var availableTags = <?php echo json_encode($fieldArray)?>
$( "#search" ).autocomplete({
source: availableTags
});
});
</script>
</head>
<input type="text" name="search" id="search" style="width:400px;"/>
<input type="button" name="searchBtn" id="searchBtn" value="Search" onclick="searchLink()"/>
Add a sigh here The semicolon (;).
You was echo json but not terminate the line so its gives you
ERROR:-SyntaxError: missing ; before statement
var availableTags = <?php echo json_encode($fieldArray)?>;
Related
I want to get a paragraph data from HTML file into the php code.
In my html file I have the following line:
<p style="display: inline;" id="symptoms" name = "symptoms"</p>
In the html file document.getElementById('symptoms').value gathers all the necessary data I want to use in the php code. Obviously, $symptoms = $_POST['symptoms']; doesn't get anything. How can I get it work?
We can actually get the value inside the symptoms as shown here for Jquery. To use this value as php POST value. We can improvise this by next set of code.
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<p style="display: inline;" id="symptoms" name = "symptoms"> HEllo Hari</p>
<script>
$(document).ready(function(){
alert($("#symptoms").html());
});
</script>
Maybe we modify following code as required to achieve what you expect
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<p style="display: inline;" id="symptoms" name = "symptoms"> HEllo Hari</p>
<form method="POST" action="/*toPHPfilePath*/" id="target" >
<input type="hidden" id="hidden_symptoms" name="symptoms">
</form>
<script>
$(document).ready(function(){
$("#hidden_symptoms").val($("#symptoms").html());
$( "#target" ).submit(function( event ) {
alert( "Handler for .submit() called." );
event.preventDefault();
});
});
</script>
what I'm trying to do is get the value of the selected term from the autocomplete menu (ui.item.label), store it in a variable and send that value to my database. For that, I have another php file named "proceed.php", which connects us to the database and will insert the data into the table.
But I seem to be stuck at passing the variable "$selected" from look to proceed as no matter what I do, the browser displays $vari, that is, the variable passed here - proceed1.php?var=$vari
Backstory - You may notice that I have assigned the variable vari as apple. Yet, I see only $vari as the output on the browser and not apple.
Any help will be deeply appreciated.
Thank you very much.
look.php
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
$(function() {
$( "#route" ).autocomplete({
source: 'search.php',
select: function( event , ui ) {
$selected=ui.item.label;}
});
});
$vari="apple";
</script>
</head>
<link rel="stylesheet" type="text/css" href="look.css" media="screen" />
<body>
<div class="ui-widget">
<label for="route">Router Name: </label>
<input id="route">
<br><br><br>
Proceed
</div>
</body>
</html>
proceed.php
<?php
$dbHost = 'localhost';
$dbUsername = 'root';
$dbPassword = '';
$dbName = 'searchrouters';
//connect with the database
$db = new mysqli($dbHost,$dbUsername,$dbPassword,$dbName);
//get search term
$vari = $_GET['var'];
echo $vari;
?>
UPDATE :
Thank you, the solution provided in the comments worked. But now when I'm trying to get the variable selected's value as :
<?php
$vari=$_GET['selected'];
?>
and then pass it in to the next page as :
Proceed
I get the following error on the browser :
Undefined index: selected in C:\wamp\www\look.php on line 19
You need to modify you code in two places
<script>
$(function() {
$( "#route" ).autocomplete({
source: 'search.php',
select: function( event , ui ) {
$selected=ui.item.label;
$('#btn2').attr({'href':'proceed1.php?var='+$selected});
}
});
});
</script>
<?php
$vari="apple";
?>
and Proceed
and when you need to access the variable just use $_GET['var']
Where ever you want to user php with HTML you need to user the <?php php code here ?>
here is a demo
You can not declare php variable in jquery.
try this
<script>
$(function() {
$( "#route" ).autocomplete({
source: 'search.php',
select: function( event , ui ) {
$selected=ui.item.label;}
});
});
</script>
<?php
$vari="apple";
?>
and
Proceed
You should change here remove $vari="apple"; from script tag and use it inside php tag
<?php $vari="apple"; ?>
and get variable $vari like this
Proceed
I want to fetch the json data from function and not file.
How can i change the autocomplete.php to a PHPfunction?
My code:
<html>
<head>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
$(function() {
$( "#skills" ).autocomplete({
source: 'autocomplete.php'
});
});
</script>
</head>
<body>
<div class="ui-widget">
<label for="skills">Skills: </label>
<input id="skills">
</div>
</body>
</html>
Add get or post parameter to your ajax, for example action=func1 and in your php file make a switch and in the case of action is "func1" just call func1().
Its my html code :
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jqueryui.js"></script>
<script>
$( "#tags" ).autocomplete({
url: 'Ajax.php?txt='
});
</script>
</head>
<body>
<div class="demo">
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags" name="txt" />
</div>
</div>
</body>
</html>
and here is my Ajax.php
<?
$val = $_REQUEST["txt"];
if($val == "251") { echo "its WoooW";}
else
echo "Nothing found";
?>
But it's not working for autocomplete.
What is my mistake?
You should've checked the documentation. The URL property isn't available, but it's the source property:
docs: http://jqueryui.com/demos/autocomplete/#option-source
Example
$( "#tags" ).autocomplete({
source: 'Ajax.php'
});
The query will be added according to the link you provided
You must wrap your jquery into a function like this:
<script>
$(function() {
$( "#tags" ).autocomplete({
source: "Ajax.php",
minLength: 2
});
});
</script>
And you must return json_encoded content from Ajax.php (Example)
It States within the documentation:
When a String is used (eg not a set array), the Autocomplete plugin expects that string to
point to a URL resource that will return JSON data. It can be on the
same host or on a different one (must provide JSONP). The request
parameter "term" gets added to that URL.
<?php
$val = $_REQUEST["term"];
if($val == "251") {
$return="its WoooW 251";
}elseif($val == "123"){
$return="its WoooW 123";
}else{
$return="Nothing Found";
}
echo json_encode($return);
?>
I am new to using jquery and i have written the following code and it does not work and i am not able to figure out what the mistake is ..syntax might also be wrong.
It has 2 submit buttons while using button1 it should get info from the DB and display on the same page.i.e., get the title from the DB and display on the same page.
While second submit button is used to submit title into the DB and update it(written in script_2.php).
<form id="myForm" method="post">
id: <input type="text" name="search"/>
<input type="button" id="button1" value="Submit to script 1" />
<input type="button" id="button2" value="Submit to script 2" />
title:<input type="text" name="title"/>
</form>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#button1").click(function(){
$.post('script_1.php', { name: form.name.value },
function(output) {
$('#age').html(output).show();
}) ;
}) ;
$("#button2").click(function(){
$('form#myForm').attr({action: "script_2.php"});
$('form#myForm').submit();
});
});
</script>
</head>
Help appreciated.
You are missing the }); to close the $("#button1").click function:
<script type="text/javascript">
$(document).ready(function(){
$("#button1").click(function(){
$.post('script_1.php', { name: form.name.value },function(output) {$('#age').html(output).show();});
});
$("#button2").click(function(){
$('form#myForm').attr({action: "script_2.php"});
$('form#myForm').submit();
});
});
</script>
You have too many closing
<script type="text/javascript" src="jquery.js"></script></script>
to
<script type="text/javascript" src="jquery.js"></script>
jQuerys attr() expects strings, not an object, like:
$('form#myForm').attr("action", "script_2.php");
You form is before your <head> tag. It should be after your </head> and in a <body> tag.
You are putting the results of your ajax call in an element with id age, but I don't see any element with that id on your page.
That's all for errors (that I see as of now), but you can also speed up your selecter here $('form#myForm') by changing it to $('#myForm') since id's are unique, and I doubt you have any element with the id myForm which isn't a form.