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.
Related
I wrote the following code. With this code pushing Submit button submits the form manually. I have also a timer which I want to auto submit the form after 10 seconds. But it does not work. It counts until 0 and then it does not do anything. Can you please tell me what I am missing or how to change my timer (if there, is the problem)? But I want the user to watch the timer as my example
<!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" />
<script type="text/javascript">
function countDown(secs,elem)
{
var element = document.getElementById(elem);
element.innerHTML = "<h2>You have <b>"+secs+"</b> seconds to answer the questions</h2>";
if(secs < 1){
clearTimeout(timer);
document.getElementById('myquiz').submit();
}
secs--;
var timer = setTimeout ('countDown('+secs+',"'+elem+'")',1500);
}
</script>
<div id="status"></div>
<script type="text/javascript">countDown(5,"status");</script>
<title>Questionnaire</title>
<style type="text/css">
span {color: #FF00CC}
</style>
</head>
<body>
<h1>Please complete the following Survey</h1>
<form name="quiz" id ="myquiz" method="post" action="includes/process.php">
First Name: <input type="text" name="firstname" id="fname"/>
<p></p>
Last Name: <input type="text" name="lastname" id="lname"/>
<p></p>
<input type="submit" name="submit" value="Go"></input>
<input type="reset" value="clear all"></input>
</form>
</body>
</html>
There are three errors producing this bug.
You have a typo in form attributes. there is a space after id. It should be id="myquiz".
Your form has a button named "submit", which is wrong. It overrides the function. Name it "submitbutton" or something other.
The "validate" method is not defined. It should return true.
By the way, the timeout has wrong time, it should be 1000.
Working example: plunk
Don't do this:
var timer = setTimeout ('countDown('+secs+',"'+elem+'")',1500);
in countDown. Every 1500 you're calling countDown again.
Put this at the bottom of the page (before closing body tag)
<script type="text/javascript">
secs = 10;
timer = setInterval(function () {
var element = document.getElementById("status");
element.innerHTML = "<h2>You have <b>"+secs+"</b> seconds to answer the questions</h2>";
if(secs < 1){
clearInterval(timer);
document.getElementById('myquiz').submit();
}
secs--;
}, 1000)
Btw: where is validate() declared ?
Didn't test it, but it should do the trick.
You have to submit a form, not an element so try this:
document.forms["quiz"].submit();
OR if its the only form you can use
document.forms[0].submit();
This Code will work:
<!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" />
<script type="text/javascript">
function countDown(secs, elem)
{
var element = document.getElementById(elem);
element.innerHTML = "<h2>You have <b>"+secs+"</b> seconds to answer the questions</h2>";
if(secs < 1) {
document.quiz.submit();
}
else
{
secs--;
setTimeout('countDown('+secs+',"'+elem+'")',1500);
}
}
function validate() {
return true;
}
</script>
<div id="status"></div>
<script type="text/javascript">countDown(5,"status");</script>
<title>Questionnaire</title>
<style type="text/css">
span {
color: #FF00CC;
}
</style>
</head>
<body>
<h1>Please complete the following Survey</h1>
<form name="quiz" id="myquiz" onsubmit="return validate()" method="post" action="includes/process.php">
First Name: <input type="text" name="firstname" id="fname"/>
<p></p>
Last Name: <input type="text" name="lastname" id="lname"/>
<p></p>
<input type="submit" name="submitbutton" value="Go"></input>
<input type="reset" value="clear all"></input>
</form>
</body>
</html>
define function wait as
function caller()
{
setInterval(submit_now, 10000);
}
function submit_now()
{
document.forms["quiz"].submit();
}
Explaination:
1). Function wait() will set a time interval of 10 seconds (10000) ms before it calls submit_now() function.
2). On other hand submit_now() function do submit your form data when calling of this function is performed.
I have here a page in which I am trying to update a users email now the div refreshes on submit like it is ment to but it is not updating the database and I ain't for the life of me know why.
My layout is one page click a menu link and it loads the page into the content div (below does) now I am wanting to post a form and it reload in that div and update the mysql database but for some reason it don't want to update the database.
Anyone got any suggestions into why it's not updating the database? have i made a small error somewhere in the php or is it due to my page set up on loading this way?
Thanks in advance. :)
<?php
session_start();
include_once("./src/connect.php");
include_once("./src/functions.php");
//Update email
if (isset($_POST['update'])){
$email = makesafe($_POST['email']);
$result = mysql_query("UPDATE Accounts SET email='$email' WHERE `id`= '{$fetchAccount['id']}'")
or die(mysql_error());
echo "<font color='lime'>Updated.</font>";
}
?>
<!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" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Home</title>
<link rel="stylesheet" href="./static/css/LoggedIn/Index.css" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$("#Submit").click(function() {
var url = "Profile.php"; // the script where you handle the form input.
$.ajax({
type: "POST",
url: url,
data: $("#myForm").serialize(), // serializes the form's elements.
success: function(html){ $("#right").html(html); }
});
return false; // avoid to execute the actual submit of the form.
});
});
</script>
</head>
<body>
<div id="right">
<form method="post" action="Profile.php" id="myForm">
E-mail: <input type="text" value="<?=$fetchAccount['email']?>" name="email"><br>
<input type="submit" value="Edit" name="update" id="Submit">
</form>
</div>
</body>
</html>
Heres some changes, read code comments, though the main thing wrong with your code is ajax will get the whole page not just echo "<font color='lime'>Updated.</font>"; part.
<?php
session_start();
include_once("./src/connect.php");
include_once("./src/functions.php");
//Update email only if request is from ajax request
if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) === 'xmlhttprequest'){
//check its POST, and email is real, then do update or exit a error message back
if($_SERVER['REQUEST_METHOD']=='POST' && !empty($_POST['email']) && filter_var($_POST['email'], FILTER_VALIDATE_EMAIL)){
header('Content-Type: text/html');
//check its an email
if(!filter_var($_POST['email'], FILTER_VALIDATE_EMAIL)){
exit('<span style="color:red;">Invalid email.</span>');
}
//Do update
mysql_query("UPDATE Accounts
SET email='".mysql_real_escape_string($_POST['email'])."'
WHERE id= ".mysql_real_escape_string($fetchAccount['id'])) or die('<span style="color:red;">Error updating email. '.mysql_error().'</span>');
exit('<span style="color:lime;">Updated.</span>');
}
}
?>
<!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" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Home</title>
<link rel="stylesheet" href="./static/css/LoggedIn/Index.css" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"/></script>
<script type="text/javascript">
$(function(){
$("#Submit").click(function(e) {
$.ajax({
type: "POST",
url: "Profile.php",
data: $("#myForm").serialize(), // serializes the form's elements.
success: function(html){ $("#right").html(html); }
});
e.preventDefault();
});
});
</script>
</head>
<body>
<div id="right">
<form method="post" action="Profile.php" id="myForm">
E-mail: <input type="text" value="<?=htmlspecialchars($fetchAccount['email'])?>" name="email"/><br/>
<input type="submit" value="Edit" name="update" id="Submit"/>
</form>
</div>
</body>
</html>
Hope it helps
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.
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...
I want to enter different rooms with on button. How is this possible in Javascript. For example, there are three rooms, "Kitchen, toilet and bedroom". How can I use JS to enter any of these rooms depending on my choice. so if i enter "kitchen" in the input box its gonna take me to kitchen.php, if I enter toilet...the same button is going to take me to toilet.php etc.
This is the HTML input,
<form method="post">
<input style=""name="Text1" type="text"><br>
<input name="move" style="height: 23px" type="submit" value="Move">
</form>
Just use a select field jsfiddle demo:
<!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 content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Untitled 1</title>
<script type="text/javascript">
function submitForm() {
var myform = document.getElementById('myform');
var mytext = document.getElementById('room');
myroom = mytext.value.toLowerCase();
if (myroom == 'kitchen') {
myform.action = 'kitchen.php';
myform.submit();
} else if (myroom == 'toilet') {
myform.action = 'toilet.php';
myform.submit();
} else if (myroom == 'bedroom') {
myform.action = 'bedroom.php';
myform.submit();
} else return false;
}
window.onload = function(){
document.getElementById('move').onclick = submitForm;
}
</script>
</head>
<body>
<form id="myform" name="myform" method="post">
<input type="text" id="room" name="room" />
<button id="move" name="move" style="height: 23px">Move</button>
</form>
</body>
</html>
On the php side create three files to test to see if this works, toilet.php, kitchen.php, and bedroom.php with the following code in all three files. make sure the file names are lower cased:
<?php
echo $_POST['room'];
?>
Basically, based on the option that is selected, the JavaScript would change the form's action url and submit. If none is selected it'll return false and not submit. The submitForm function is attached to the move button with an onclick event.