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);
?>
Related
I want to send data using GET or POST to another php file on a button's(NOT Submit button) onClick() Event.
Please help me.
Let I give you simple HTML with post method using AJAX
Test.php
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
$(function() {
$("#Submit").click(function() {
var value = jQuery("#txt").val();
var data=jQuery('#myform_new').serializeArray();
$.post('test1.php', { myform: data});
return false;
});
});
</script>
</head>
<body>
<form id="myform_new">
<input type="text" name="abc" value="abc" id="txt"/>
<input type="text" name="abc1" value="abc1" id="txt1"/>
<input type="button" name="Submit" id="Submit" value="Submit" />
</form>
</body>
</html>
Test1.php(ajax calling file)
<?php
echo "<pre>";print_r($_POST);
?>
Let i give you some of the ajax posting method
(1)
<script>
$(function() {
$("#Submit").click(function() {
var value = jQuery("#txt").val();
var data=jQuery('#myform_new').serializeArray();
$.post('test1.php', { myform: data});
return false;
});
});
</script>
(2)
<script type="text/javascript"> $(function() { $("#Submit").click(function()
{
var txt = jQuery("#txt").val();
var txt1 = jQuery("#txt").val();
$.post('test1.php', { txt: txt,txt1:txt1 }); return false; }); });
</script>
(3)
<script type="text/javascript"> $(function() { $("#Submit").click(function() {
var txt = jQuery("#txt").val();
var txt1 = jQuery("#txt").val();
$.post('test1.php', { data: "txt="+txt+"&txt1="+txt1}); return false; }); });
</script>
Hello in there i have explain both ajax and get/post method, Please have look below link for get/post method for submit a form in php.
http://www.tutorialspoint.com/php/php_get_post.htm
This below code is used for submit form using ajax
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<form id="formoid" action="studentFormInsert.php" title="" method="post">
<div>
<label class="title">First Name</label>
<input type="text" id="name" name="name" >
</div>
<div>
<label class="title">Name</label>
<input type="text" id="name2" name="name2" >
</div>
<div>
<input type="submit" id="submitButton" name="submitButton" value="Submit">
</div>
</form>
<script type='text/javascript'>
/* attach a submit handler to the form */
$("#formoid").submit(function(event) {
/* stop form from submitting normally */
event.preventDefault();
/* get some values from elements on the page: */
var $form = $( this ),
url = $form.attr( 'action' );
/* Send the data using post */
var posting = $.post( url, { name: $('#name').val(), name2: $('#name2').val() } );
/* Alerts the results */
posting.done(function( data ) {
alert('success');
});
});
</script>
</body>
</html>
I'm having difficulties in putting jquery plugin in my php file. I want to be able to prevent sending the form when the text field is empty, but it doesnt work.
PHP:
<html>
<head>
<script src="jquery.js"></script>
</head>
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
if(empty($_POST["login"])) {
echo '<script type="text/javascript">
$("form").submit(function(event){
event.preventDefault();
alert("submit prevented");
});
</script>';
}else {
$login = test_input($_POST['login']);
}
}
?>
HTML:
<form action="form.php" method="post">
Login: <input type="text" name="login"><br>
<input type="submit">
</form>
The same script in my script file
$("form").submit(function(event){
event.preventDefault();
alert("submit prevented");
});
works just fine, the problem is just i can't put it into my php and i think its because of the absence of jQuery.
Simply start with $(document).ready(), very good practice in jquery:
$(document).ready(function() {
$("form").submit(function(event) {
event.preventDefault();
alert("submit prevented");
});
});
Your code:
echo '<script type="text/javascript">
$("form").submit(function(event){
event.preventDefault();
alert("submit prevented");
});
</script>';
That is not how you properly echo multi lines in PHP.
Check out heredoc . Example:
echo <<<EOD
Example of string
spanning multiple lines
using heredoc syntax.
EOD;
echo <<<"FOOBAR"
Hello World!
FOOBAR;
There is also nowdoc but no parsing is done inside the block.
echo <<<'EOD'
Example of string
spanning multiple lines
using nowdoc syntax.
EOD;
Instead of echoing it, just close the braces. Also $(document).ready
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
if(empty($_POST["login"])) {;?>
<script type="text/javascript">
$(document).ready(function(){
$("form").submit(function(event){
event.preventDefault();
alert("submit prevented");
});
});
</script>
<?php }else {
$login = test_input($_POST['login']);
}
};?>
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)?>;
Ok, I have this code:
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
function get() {
$.post('tt.php', { name : $(this).attr('id') }, function(output) {
$('#age').html(output).show();
});
}
</script>
</head>
<body>
<input type="text" id="name"/>
<a id="grabe" href="javascript: get()">haller</a>
<div id="age">See your name</div>
</body>
</html>
Here's what I want: get the id of an anchor tag from the anchor tag that has been clicked by the user via jQuery and then past that to a PHP file. The PHP file will then echo the id name of the anchor tag that was clicked by the user back to the jQuery which will then display the output into the specified element.
Here's the PHP file:
<?
$name=$_POST['name'];
if ($name==NULL)
{
echo "No text";
}
else
{
echo $name;
}
?>
Bind your event like this, since you are using jQuery
$('a').click(function(){
$.post('tt.php', { name : $(this).attr('id') }, function(output) {
$('#age').html(output).show();
});
});
And remove the javascript from the href
<a id="grabe" href="#">haller</a>
<a id="kane" href="#">haller 2</a>
$('#grabe').click(function() {
$('#age').load('yourphp.php', {'name':$(this).prop('id')});
});
You can use $(this) to access almost anything about "what brought you here" in the code. You'll also need a listener for the event. In this way too brief example below, I have it listening for any clicks to <span class="edit_area"> spans.
<script>
$(document).ready(function(){
$('span.edit_area').click( function(){
var fieldname = $(this).attr('id');
...
});
});
I dont know why you want to send an id to a server and then receive that id back again from the ajax call as it is already there in your client script. Anyway this is the code.
This code will does this functionalirty for all a tag with a class called"crazyLink" and show the data received from the server page in a div with id anotherCrazyDiv
HTML
<a class="crazyLink" href="#">I am crazy</a>
<a class="crazyLink" href="#">I am crazy2</a>
<div id="anotherCrazyDiv"></div>
Script
$(function(){
$(".crazyLink").click(function(){
var id=$(this).attr("id");
$.post("data.php", { name : id } ,function(data){
$("#anotherCrazyDiv").html(data);
});
return false; // to prevent normal navigation if there is a valid href value
});
});
Keep in mind that, in your scenario, the value in id variable and value in data variable (after getting response from ajax call ) are same.
you may want to separate your javascript from your html. it makes things easier. it should probably look something like this.
HTML
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"> </script>
<script type="text/javascript" src="javascript/somescript.js"></script>
</head>
<body>
<input type="text" id="name"/>
<a id="grabe" class="someclass">haller</a>
<div id="age">See your name</div>
</body>
</html>
javascript
$(document).ready(function() {
$('.someclass').click(function() {
$('#age').load(
url: 'tt.php',
data: { name: $(this).attr('id')}
);
});
});
Solution:
The problem is that in my php code, I have a debug message: print $_GET['term'];
It also return the result to client.
I am implementing search with autocomplete feature, but hitting some issues when connecting to php, here is my code
html:
<input type="text" id="leaderboard_search" />
search.js:
jQuery(function($) {
$( "#leaderboard_search" ).autocomplete({
minLength: 1,
width: 240,
source: 'search.php'
});
});
search.php:
<?php
$values = array('abc','def');
echo json_encode($values);
?>
When I type something. It just doesn't show anything. I have debugged into php code, search.php get called with no problem. So I suspect the problem is on jquery side.
I am using jqueryui 1.8
Update: to simplify the problem, I changed to embedded js, but still doesn't work:
html code:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<script>
$(function() {
$( "#leaderboard_search" ).autocomplete({
minLength: 2,
width: 240,
source: 'search.php'
});
});
</script>
<html>
<fieldset class="searchinput"><input type="text" id="leaderboard_search" /></fieldset>
</html>
try this as your search.php:
$values = ['abc','def'];
echo json_encode($values);
according to the jquery documentation here http://jqueryui.com/demos/autocomplete/
it states that the result either can be a name value pair or just an array or strings.. so instead u shud echo smthing like this.
echo '["abc","def"]';