<html>
<head>
<script>
function sentAjax()
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
//alert(xmlhttp.readyState);
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementsByName('content') = xmlhttp.responseText;
}
}
xmlhttp.open("GET","resultPage.php",true);
xmlhttp.send();
}
</script>
<script name="content">
//should be assigned here
</script>
</head>
<body>
</body>
</html>
Below is the result from "resultPage.php"
<script type="text/javascript">
objTreeMenu_1.drawMenu();
objTreeMenu_1.writeOutput();
objTreeMenu_1.resetBranches();
</script>
I would like to assign the above script to the inside <script name="content"></script>. However, I have tired the document.getElementsByName('content') = xmlhttp.responseText; which is wrong.
Is there anyone can help me? Many thanks!
document.getElementsByName('content') only returns the elements.
you should use
document.getElementsByName('content')[0].innerHTML = xmlhttp.responseText
Related
I have a problem with my AJAX function which is not being triggered. It seems like I'm doing everything fine but for some reason it's not triggered when the select box is changed:
Here is my Ajax function:
<script type="text/javascript">
function showSections(id){
if (id=="")
{
document.getElementById("MyDiv").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
var xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
var xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("MyDiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET", "getRets.php?sem=" + id, true);
xmlhttp.send();
}
</script>
here is the select box:
<select name='sub' id="sub" onchange="showSections(this.value)">
<option value="1">Pending</option>
<option value="0">Performed</option>
</select>
<div id="MyDiv">
some data
</div>
This is the gerRets.php file:
<?php
$numbVal = $_GET['sem'];
echo $numbVal;
?>
Can anybody point out to me my mistake? Apparently I just don't see it.
I'm new at Ajax and this code should change the div dynamically in real time when the user type something in the input field but nothing happens.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<!--api to use ajax-->
<script type="text/javascript" src="sarissa/gr/abiss/js/sarissa/sarissa.js"> </script>
<title>Ajax Test</title>
<script>
function loadXMLDoc() {
var xmlhttp;
//parameter
var suggest = document.getElementById("searchbox").value;
//using XMLHttpRequest
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
//when xmlhttp be ready...
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
//the HTML will be modify
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
//the file that will receive and retrieve info
xmlhttp.open("POST","enviar.php",true);
//header to the retrieved information
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//the param will be send
var sendParam = "fname="+suggest;
xmlhttp.send(sendParam);
}
</script>
</head>
<body>
Busca: <input type="text" id="searchbox" />
<div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onkeypress="loadXMLDoc()">Change Content</button>
</body>
</html>
Change the onkeypress event to onclick.
If you would like the content to change as the user types, add an onkeyup event to the text input element.
First you should put your javascript codes before, your HTML inputs, because, the DOM needs to load the entire document, before it can manupilate it. otherwise, you should put your functions inside the body tag, with onload attribute.
second, use the onclick event instead of onkeypress, I modified your script, and tested it. It works now
<html>
<head></head>
<body>
Busca: <input type="text" id="searchbox" />
<div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onclick="loadXMLDoc()">Change Content</button>
<script type='text/javascript'>
function loadXMLDoc() {
var xmlhttp;
//using XMLHttpRequest
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else
{// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
//when xmlhttp be ready...
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
//the HTML will be modify
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
//parameter
var suggest = document.getElementById("searchbox").value;
var sendParam = "fname="+suggest;
//the file that will receive and retrieve info
xmlhttp.open("POST","enviar.php",true);
//header to the retrieved information
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//the param will be send
xmlhttp.send(sendParam);
console.log(xmlhttp);
}
</script>
<body/>
I am doing some work in PHP. I have two php page
index.php
<html>
<head>
<script>
function getVote(int)
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("poll").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","poll-vote.php?vote="+int,true);
xmlhttp.send();
}
</script>
</head>
<body>
<h3>Is this correct? </h3>
<div id="poll">
<form>
Yes:
<input type="radio" name="vote" value="0">
<br>No:
<input type="radio" name="vote" value="1">
<input type="submit" value="Forward" onclick="getVote(value);">
</form>
</div>
</body>
</html>
on click of submit button I need to get the value of selected radio button and pass it to the function.
Please help me
call just a function in youe onclick inline...
<input type="submit" value="Forward" onclick="getVote();"> //here
and get checked radio value in your function..
var radiovalue= $('input[name="vote"]:checked').val()
try this
JAVASCRIPT
function getVote()
{
var radiovalue= $('input[name="vote"]:checked').val()
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("poll").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","poll-vote.php?vote="+radiovalue,true);
xmlhttp.send();
}
HTML
<input type="submit" value="Forward" onclick="getVote();">
Provide action and method attribute to form first
<form action="index.php" method="post">
And than only you can get the value like below:
$vote = $_POST['vote'];
I hope this is what you are looking for.
try:
function getVote()
{
var int=document.getElementById("vote").value;
....
EDIT: noticed it is a radio input... so this won't work. You need something like:
function getRadioCheckedValue(radio_name)
{
var oRadio = document.forms[0].elements[radio_name];
for(var i = 0; i < oRadio.length; i++)
{
if(oRadio[i].checked)
{
return oRadio[i].value;
}
}
return '';
}
And then do:
function getVote()
{
var int=getRadioCheckedValue(vote);
....
Via jquery you can get value of selected radio like this:
$('input[name=vote]:checked').val()
Try changing those 2:
<form name="myForm">
onclick="getValue(document.myForm);"
then the function:
function getValue(form){
var value = '';
for (var i = 0; i < form.elements.length; i++ ) {
if (form.elements[i].type == 'radio') {
if(form.elements[i].checked == true) {
value = form.elements[i].value;
}
}
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("poll").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","poll-vote.php?vote="+value,true);
xmlhttp.send();
}
Call the function without any value and then read out the radiobutton inbetween your function like this:
var rval = document.getElementsByName('vote');
for (var i = 0, length = rval.length; i < length; i++) {
if (rval[i].checked) {
alert(rval[i].value); // your value
}
}
I was try to attach the ckeditor to a textarea in php page, which is being called by ajax in a html page, but ckeditor is not appearing in textarea. Can any one have any idea, Why it is not happening, it just making me freak.
TRY1.HTML
<script type="text/javascript">
function load()
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("div_content").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","try2.php?",true);
xmlhttp.send();
}
</script>
<!--end tinymcs-->
</head>
<body>
<input type="button" onclick="load()">
<div id="div_content">
</div>
</body>
</html>
TRY2.PHP
<textarea id="txt1"> </textarea>
That is because the textarea in which you are binding the editor was not present on the initial load of the page so its not getting binded.
You should bind that on the success call back of ajax call.
On Success you should do bind the textarea with ckeditor and it will work.
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById("div_content").innerHTML=xmlhttp.responseText;
document.getElementById("txt1").ckEditor();
//or whatever the exact code you do for ckEditor
}
I want to post the field values entered in this code to the page ajaxpost.php using Ajax and then do some operations there. What would be code required to be written in ajaxpost.php. Also woithout using any js file/jquery
Here is the code of page in which fields are entered, I would like to know what would be the code to be written in ajaxpost.php
<html>
<head>
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
var zz=document.f1.dd.value; //alert(zz);
var qq= document.f1.cc.value;
xmlhttp.open("POST","ajaxpost.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("dd=zz&cc=qq");
}
</script>
</head>
<body>
<h2>AJAX</h2>
<form name="f1">
<input type="text" name="dd">
<input type="text" name="cc">
<button type="button" onclick="loadXMLDoc()">Request data</button>
<div id="myDiv"></div>
</form>
</body>
</html>
I think you are looking for bare bones php and ajax for which there are tons of tutorials such as this one, which is quite close to what you are looking for.