|
JavaScript - Xmlhttprequest Passing Object To Onreadystatechange
Hey all,
This is a problem that I've tried various ways round - consider the following code: Code: if (window.XMLHttpRequest)
{
this.xhr = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
this.xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
this.xhr.onreadystatechange = function () {
if(this.readyState == 4) {
if(this.status == 200) { editor.loadObject.doLoad(); }
else window.console.log("Loader: Loader Error code " + xhr.status);
}
}
the code is called from my "loader" object which in turn is loaded from another object in this case "editor" (editor initiates the loader object by this.loadObject = new loader(this.ident + "loader");). In the example above I have had to hard-code the variable "editor" (i.e. the original object) because when I define this.xhr.onreadystatechange as a function, anything outside the function is outside of it's scope, so I can't for example define this.callerObject and put it in place of editor. This is a nuisance as you can imagine - Any ideas how to do this? Many thanks Edd Similar TutorialsThis is my class doucmnet :: PHP Code: XMLXHttpRequest = function(name){ this._handle = new XMLHttpRequest(); this._method = ''; this._url = ''; this.readyState = 0; this.responseBody = ''; this.responseText = ''; this.responseXML = ''; this.status = 0; this.statusText = ''; this.className = name; this.onreadystatechange = function(){} this.ontimeout = function(){} this.abort = function(){ this._handle.abort(); } this.getAllResponceHeaders = function(){ return this._handle.getAllResponceHaders; } this.getResponceHeader = function(bstrHeader){ return this._handle.getResponceHeader(bstrHeader); } this._readyStateUpdate = function(){ if(typeof(name) !== "undefined"){ name = this.className; } eval(""+name+".onreadystatechange();"); eval(""+name+".readyState = "+name+"._handle.readyState;"); eval(""+name+".status = "+name+"._handle.status;"); eval(""+name+".statusText = "+name+"._handle.statusText;"); eval(""+name+".responseText = "+name+"._handle.responseText;"); eval(""+name+".responseBody = "+name+"._handle.responseBody;"); eval(""+name+".responseXML = "+name+"._handle.responseXML;"); } this.open = function(sMethod, sUrl){ this._readyStateUpdate(); this._handle.onreadystatechange = this._readyStateUpdate; this._handle.ontimeout = this.ontimeout(); this._url = sUrl; this._method = sMethod; } this.send = function(data){ this._handle.open("GET", "xml.php?url="+ this._url + "&method=" + this._method + "&data=" + urlencode(data)); this._handle.send(null); } this.setRequstHeader = function(sName, sValue){ return this._handle.setRequestHeader(sName, sValue); } } What this is supposed to do :: This is a class that is supposed to allow CrossDomain AJAX(XMLXHttpRequest) in the exact same way the XMLHttpRequest dose all the same handlers other then it uses a php file to get all the data now the PHP File works perfectly post and GET - Without cURL. Now most of the class works it can send the data("POST" or "GET") cross domain the only problem seems to be firing the onreadystatechange PHP Code: this.open = function(sMethod, sUrl){ this._readyStateUpdate(); this._handle.onreadystatechange = this._readyStateUpdate; this._handle.ontimeout = this.ontimeout(); this._url = sUrl; this._method = sMethod; } As you can see i have its set to fire the _readyStateUpdate on the onreadystatechange so why is it not fireing, This is tested in FireFox 3.5, ComitBird(Firefox 3.2 Core), Google Chrome and IE and it dose not work in all of them as i know there is a bug with FireFox 3.5 and Firebug wich im a developer i have got it but thats why im testing in GG and IE Any help would be greatly appreciated I have the following code: [CODE] rtn += "<div class='crowelem' style='width:100px;'>"+panel.genSendButton(current.readNode())+"</div>"; [CODE] This is in a loop that generates rows in a DIV. current.readNode() is returning an object from a linked list, the method genSendButton looks like this: [CODE] MatchRequest.prototype.genSendButton = function (obj) { var rtnstr = null; if(obj.msNotified == 0) { rtnstr = "<input type='button' value = 'Notify' onClick=\"javascriptanel.sendNotification("+obj+")\"/>"; } else { rtnstr = "<input type='button' value='Already Notified' disabled='true' onClick=\"javascriptanel.sendNotification('"+obj.msID+"')\"/>"; } return(rtnstr) ; } [CODE] If you step into this code in a debugger, obj is correctly passed into genSendButton as an object of the appropriate class. The code in the if(obj.msNotified == 0) clause generates an error. The var obj resolves to NPanlel: (this happens to be the class of the object). Regardless of how I try to pass obj into the method sendNotification it doesn't resolve to an object. Can anyone shed any light on where my omission of intelligence is occurring? Any help would be greatly appreciated. Mrbub PHP Code: function $(x) { return document.getElementById(x); } function test(x) { alert(x.id); } function init() { var o = {}; o.id = "a"; $("one").addEventListener("click", function () {test(o);}); o.id = "b"; $("two").addEventListener("click", function () {test(o);}); o.id = "c"; $("three").addEventListener("click", function () {test(o);}); } window.onload = init; I have some code similar to this. When the HTML elements with id's "one", "two", or "three" are clicked, they all alert "c", but I want them to alert the respective values (a, b, and c). How can I pass the object by value and not by reference? I guess in this simple example you would just define two more objects, but my code is actually within a for-loop. The object properties are changed each iteration (ideally each iteration creates a new object) and then passed to the function. My question is commented in the script: Code: function Love(){
var req = {
ring : 'gold',
money : 'a lot',
commitment : 'long-term'
}
this.loveReqs = function(){
return req;
}
}
var you = new Love();
var details = you.loveReqs();
details.ring = "silver";
console.log(details.ring);
var me = new Love();
var details = me.loveReqs();
console.log(details.ring); // why does this return gold and not silver if req is passed by reference and we already changed its value above and so it's pointing to the same memory position?
Hi Everyone, I have the following problem that I have been trying to figure out for a few hours now and am hoping someone can give me a help out. I am opening a popup - this popup is solely to take an image url and as such has one field. On this 1st popup I have a 'button' which when clicked launches a 2nd popup window containing a file browser. The user selects the file by double clicking on the image they want, the url is passed back to the 1st popup, poulating the field and the 2nd popup is closed. Work perfectly in FF etc.. but in IE7 and IE8 it will not work. I am using the following function, linked to the button in the 1st popup, to open the 2nd popup window pass across the name of the field and the window object to the 2nd window. Code: function popupTwoInit(file_path, field_name, win) {
var w = window.open(file_path, null, 'toolbar=yes,menubar=yes,width=900,height=600');
w.fileFileField = field_name;
w.fileFileWin = win;
}
Where w is holding the window object created by the window.open, field_name is the name of the field on the popup that I wish to pass back a value to and win is the window object of the 1st popup. I am using this function as the callback to poulate the field in the 1st dialog after an image in the 2nd dialog has been selected: Code: filebrowser_callback(url) {
window.fileFileWin.document.forms[0].elements[window.fileFileField].value = url;
window.fileFileWin.focus();
window.close();
}
So this function accesses the passed through window object and field name from the window.open function, populates the field, gives the 1st popup focus and closes the 2nd popup. I thought about using opener in the 2nd popup to access the window object and field in the 1st popup but opener seems to refer to the main page in the browser - perhaps because I am using 2 popups OR I have got that wrong. Like I say works perfectly in FF but IE is always undefined for both 'window.fileFileWin' & 'window.fileFileField' which seems to suggest that the object is not interpreted by IE in the first function? I am a PHP developer with limited Javascript knowledge so any help would be great. Thanks very much. I'm trying to diagnose the javascript part of an ajax script: Code: <form>
<ul id='May120128AM' name='apt_time' value='May120128AM'>
<input type="hidden" id='May120128AMhidden' name="user_id" value='May120128AM'>
</form>
<script type="text/javascript">
<!--
var request;
request = new XMLHttpRequest();
function checkData()
{
alert(request.readyState);
}
var apt_time = encodeURIComponent(document.getElementById(May120128AM').value);
var userid = encodeURIComponent(document.getElementById(May120128AMhidden').value);
var parameters = "apt_time"+apt_time //+"&"+"user_id"+userid;
request.open("POST", "/cgi-bin/my_script.php", true);
request.onreadystatechange = checkData;
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
request.send(parameters);
//-->
</script>
The checkData script puts each readyState in an alert box, so I know the javascript is firing. If I change the red line of code to this, the alert boxes no longer pop up, so I assume the javascript is not firing: Code: var parameters = "apt_time"+apt_time+"&"+"user_id"+userid; I thought name/value pairs were written like this: Code: name1=value1&name2=value2 I though that was exactly what the red line of code was doing. Does anyone know why it isn't firing? UPDATE: This works: Code: var parameters = "apt_time=+apt_time+&user_id=+userid"; I don't know why the above works and the other doesn't. They both look like they do the same thing - this: Code: apt_time=value1&user_id=value2 The line "xmlHttp.onreadystatechange = function()" Does the following error, i dont know whats wrong. The code: Code: function MakeRequest()
{
var xmlHttp = getXMLHttp();
var page = document.getElementById("page").value;
var content = document.getElementById("code").value;
xmlHttp.onreadystatechange = function()
{
if(xmlHttp.readyState == 4 && xmlHttp.status==200)
{
HandleResponse(xmlHttp.responseText);
}
}
xmlHttp.open("POST", "edit.save.php", true);
xmlHttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlHttp.send("page="+page+"&content="+content+"");
}
function getXMLHttp()
{
var xmlHttp
try
{
//Firefox, Opera 8.0+, Safari
xmlHttp = new XMLHttpRequest();
}
catch(e)
{
//Internet Explorer
try
{
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e)
{
try
{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e)
{
alert("Your browser does not support AJAX!")
return false;
}
}
}
}
function HandleResponse(response)
{
document.getElementById('SavedFile').innerHTML = response;
}
I am trying to figure out that if the function "xmlhttp.onreadystatechange=function()" returns true the whole function "function checkUser(str)" should return true as well....so not sure how to do it. i have banged my head since long so please advise! Here is the code below: -------------------------------------------------------- function checkUser(str) { var sp = document.getElementById("msgs"); if (str=="") { document.getElementById("msgs").innerHTML="Username cannot be empty."; return false; } if (str.length <= 6) { document.getElementById("msgs").innerHTML="Username cannot be less than 6 characters and must not start with a number or a special value"; return false; } if (window.XMLHttpRequest) { //code for IE7+, firefox, chrome, opera, safari xmlhttp=new XMLHttpRequest(); } else { //code for old IE xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { if (xmlhttp.responseText === 'FOUND') { sp.style.color = "red"; sp.innerHTML = "[ERROR]: The username \"" + str + "\" already exist. Please try a different name."; return false; } else if (xmlhttp.responseText === 'NOT FOUND') { sp.style.color = "blue"; sp.innerHTML = "Username: VALID"; return true; } } } xmlhttp.open("GET", "checkUser.php?q="+str,true); xmlhttp.send(); } I'm starting to learn javascript and trying to get the below code to work with newer browsers. I'm not sure how to implement the below to make it work with XMLHttpRequest. There is a small form that uses this function to allow you to select an xml file to load. Your help is much appreciated. Thanks. Code: function importXML() {
if (document.implementation && document.implementation.createDocument) {
xmlDoc = document.implementation.createDocument("", "", null);
xmlDoc.onload = createQuiz;
}
else if (window.ActiveXObject) {
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.onreadystatechange = function () {
if (xmlDoc.readyState == 4) createQuiz()
};
}
else {
alert('Your browser cannot handle this script');
return;
}
xmlDoc.load(document.getElementById('file').value);
}
Ok, so I have built a website using galleryCMS, a pre-built CMS for images, which outputs XML via php to an address of: http://www.granitesupermarket.ca/login.php/view/xml Firefox and Chrome can pull the XML from the webpage using my code, however IE does nothing with it at all. I have found that if I use a page with a proper xml extension then the code works fine (ie test.xml); however, without the .xml it seems like IE does nothing?? I am not the most advanced user, so tampering with the CMS is not the best option for me... is there any workaround that I might be able to employ? Maybe a way I could take the xml I get from "login.php/view/xml" and save it to gallery.xml on the same server? Any help or ideas would be helpful. Code: <html>
<head>
<title></title>
<head>
<body>
<script type="text/javascript">
// Get XML function
function loadXMLDoc(dname)
{
if (window.XMLHttpRequest)
{
xhttp=new XMLHttpRequest();
}
else
{
xhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xhttp.open("GET",dname,false);
xhttp.send();
return xhttp.responseXML;
}
// XML source
xmlDoc=loadXMLDoc("login.php/view/xml")
t=xmlDoc.getElementsByTagName("thumbnail");
// TEST THAT XML IS WORKING
document.write(""+ t[0].childNodes[0].nodeValue + "");
</script>
</body>
</html>
I tried posting this same thread under AJAX and I didn't get a single response. I am wondering if it may be in the wrong section so I decided to try here. If this is bad posting etiquette, I apologize. Hello. I am trying to use a form to submit values to MySQL and then have a Google map returned that has certain parameters. I have modeled this code after an example I found on w3schools. I believe that this is strictly a javascript coding problem. This is the code that I am using: Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ Page Language="C#" %>
<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#filter {
height: 5%;
width: 73%;
margin-top: 5px;
margin-left: 2%;
border: 3px solid black;
padding: 1%;
overflow: auto }
#txtHint {
height: 20%;
width: 73%;
margin-top: 5px;
margin-left: 2%;
border: 3px solid black;
padding: 1%;
overflow: auto
}
#maplist {
height: 60%;
width: 75%;
margin-top: 5px;
margin-left: 2%;
border: 3px solid black }
</style>
<script type="text/javascript">
function showTrail(str)
{
if (str=="")
{
document.getElementById("maplist").innerHTML="";
return;
}
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)
{
alert(xmlhttp.responseText);
}
}
xmlhttp.open("GET","traillist2.php?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<div id="filter">
<form name="filterform">
<select id="scenery" onchange="">
<option value="">Select Scenery Rating:</option>
<option value="a">A</option>
<option value="b">B</option>
<option value="c">C</option>
<option value="d">D</option>
<option value="f">F</option>
</select>
<select id="length" onchange="">
<option value="">Select Trail Length</option>
<option value="g">Less than 1</option>
<option value="h">1-2.9</option>
<option value="i">3-4.9</option>
<option value="j">5-6.9</option>
<option value="k">7-8.9</option>
<option value="l">More than 9</option>
</select>
<select id="difficulty" onchange="">
<option value="">Select Trail Difficulty</option>
<option value="m">Easy</option>
<option value="n">Moderate</option>
<option value="o">Strenuous</option>
</select>
<input id="combined" type="button" value=" Find Trail!
"onclick="showTrail(this.form['scenery'].value +
this.form['length'].value + this.form['difficulty'].value)"/>
</form>
</div>
<div id="maplist"></div>
</body>
</html>
The code is designed to drop the map into the "maplist" div. In the code above, you see that I have the line "alert(xmlhttp.responseText);" which was originally: document.getElementById("txtHint").innerHTML=xmlhttp.responseText;" I wrote the php page so it would return code as shown below. This is the actual responseText received from the alert. Code: script type="text/javascript">
var map;
function initialize() {
var latlng = new google.maps.LatLng(34.65, -83.9);
var options = {
zoom: 9,
center: latlng,
mapTypeId: google.maps.MapTypeId.TERRAIN
};
var infoWindow = new google.maps.InfoWindow;
var html;
var map = new google.maps.Map(document.getElementById('map_canvas'),
options);
var point = new google.maps.LatLng(
parseFloat(34.558350),
parseFloat(-84.250122));
var marker = new google.maps.Marker({
position : point,
map : map,
icon : 'http://labs.google.com/ridefinder/images/mm_20_red.png'
});
var html = '<div><br><b>Amicalola Falls State Park - Creek Trail</
b><br><br><b>Trail Length: </b>0.5 miles<br><b>Scenery
Rating: </b>C<br><b>Difficulty Rating: </
b>Easy<br><b>Trail Features: </b>Stream<br><br><font
size:large><font face="Tahoma, Geneva, sans-serif" size="1"
color="#000071"><strong><a href="http://www.digitaltrailguide.com/
amicalolafallsstateparkcreekmountainlaurelspringtrails.aspx">View This
Trail</a></strong></font></div>';
bindInfoWindow(marker, map, infoWindow, html);
function bindInfoWindow(marker, map, infoWindow, html) {
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(map, marker);
});
}
}
function loadScript() {
var script = document.createElement("script");
script.type = "text/javascript";
script.src = "http://maps.google.com/maps/api/js?
sensor=false&callback=initialize";
document.body.appendChild(script);
}
window.onload = loadScript;
</script>I thought that this code would be dropped into the div and
Hi there, Im looking for a general function which would work for most browsers when using the xmlhttprequest() I am just trying to send input data to the server store it and send back a response. I have one that works for both ie and ff, however when using ff the function does not return the text from the request to the server, but does with ie no problems. Any help would be much appreciated. Thanks Code: /* get response http request */
function getData(cURL) {
var xmlHttp = null;
xmlHttp = new XMLHttpRequest();
/* branch logic for ff or ie */
if (navigator.appName=='Netscape')
lSynch = true;
else
lSynch = false;
xmlHttp.open( "POST", cURL, lSynch );
xmlHttp.send( null );
var info = xmlHttp.responseText;
return info;
}
Hi, I am trying to create a script that would output two variables - X Controllers and Y Pilots. Basically, I would need to capture the contents of the following webpage and extract those two numbers from the second line of text. http://66.109.25.244/ I think this may involve XMLHttpRequest but I am not sure. If anyone can help me do this, I would greatly appreciate it. Thanks in advance! This question hovers between PHP and JavaScript, but I think it fits here a little better. I've got a web app that does a lot of asynchronous calls to various PHP pages. I'm familiar with using an iFrame or div to hold a controller, then making forms post to that controller so you can see the output. However, I'm not doing a lot of submitting forms. Typically, I utilize the onclick event of various elements to initiate an XmlHttpRequest that jumps over to a PHP page and back. I'm looking for a way to easily debug my PHP code. Right now I'm using Firebug (on Firefox) to look at the HTTP requests. I can see the post data and response and all that, which is good. However, it requires a good amount of clicking and time to get to that data. Is there an easier way to do this? Ideally I'd love to include some sort of debug window that displays all of the PHP controller errors and things that I echo out. hello all, I am trying to see if the w3schools example works on my site with a collapsible panel. here is what I have: Code: <script type="text/javascript">
function getXMLcontent() {
if (window.XMLHttpRequest)
xmlhttp=new XMLHttpRequest();
}
else
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
document.getElementById('CollapsiblePanel1').style.visibility = 'visible';
document.getElementById("CollapsiblePanelContent").innerHTML=xmlhttp.responseText;
xmlhttp.open("GET","showfunction.php?fname=" + document.getElementById('functions').value, true);
xmlhttp.send();
alert("showfunction.php?fname=" + document.getElementById('functions').value);
}
</script>
the panel shows up as a thin grey line because no text is being thrown into it from the 'responsetext' property. I don't really know anything about what I'm doing. Just trying to copy and paste what the website example is. is there anything else I should know about what I'm doing, that would at least tell me why I'm not getting the data back out of the server like I should be? the 'functions' element on the page is a dropdown box, but it is not inside of a form tag. does that make a difference since I am using 'GET'?? thanks! I'm trying to create a script that will call a flickr rest method and output its XML. I have written the following code, but it seems to not work. I am stumped, and was wondering what I am doing wrong. I have uploaded my code to http://www.sfu.ca/~jca41/stuph/blahh/example.html Code: function foo() {
//var url = "http://flickr.com/services/rest/?method=flickr.photos.geo.getLocation&api_key=aa9b622e629e51d3fcda1f967c429237&photo_id=6174355034";
alert(loadXMLDoc(url));
}
function loadXMLDoc(dname) {
if (window.XMLHttpRequest) {
xhttp=new XMLHttpRequest();
} else {
xhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xhttp.open("GET",dname,false);
xhttp.send("");
return xhttp.responseText;
}
</script>
Hi, because i need to get rid off Code: <iframe src="my.php"> in my html page, i have decided to replace it with javascript function which will get data from the server and will insert it into div section.But i dont know how can i obtain html page from my.php script... I know there is function XMLHttpRequest, but does it use current session from the browser ( my.php is protected - it does check the $_SESSION variable ) ? And does work this function in Mozilla ? I've been working for some time trying to get XMLHTTPRequests to work. Nothing doing. The code seems simple enough, but I can't duplicate it on my own. I have two pages on the same PC. Code to follow. Please help me see the problem: Page One - Originator <code> <html> <head> <title>Origination</title> <script type='text/javascript'> function ajaxRequest(){ var activexmodes=["Msxml2.XMLHTTP", "Microsoft.XMLHTTP"]; //activeX versions to check for in IE if (window.ActiveXObject){ //Test for support for ActiveXObject in IE //first (as XMLHttpRequest in IE7 is broken) for (var i=0; i<activexmodes.length; i++){ try{ return new ActiveXObject(activexmodes[i]); } catch(e){ //suppress error } } } else if (window.XMLHttpRequest) // if Mozilla, Safari etc return new XMLHttpRequest(); else return false; } //Usage: //new ajaxRequest() function getStuff() { var getdata = new ajaxRequest(); if (getdata.readyState==4){ if (getdata.status==200){ var htmldata=getdata.responseText var txtfields = htmldata.getElementsByTagName('input'); alert(txtfields); } else{ alert('An error has occured making the request'); } } getdata.open('POST', 'test.html', true); getdata.send(null); } </script> </head> <body> <h5>Origination</h5> <form <form action="file:///test.html" method="post" enctype="text/plain"> <input type='text' name='homepage' value=''/> <input type='button' name='getit' value='GetSome' onclick='getStuff()'/> </form> </body> </html> </code> Page Two - The Target Page: <code> <html> <head><title></title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"/> <script type="text/javascript" src=" http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"/> <style type="text/css"> html {font-family: arial; font-size: 0.8em; } </style> </head> <body> <div id="wrapper"> <form action="file:///eyec.html" method="post" enctype="text/plain"> <input type='text' name='first' value='First Field'/> <input type='text' name='second' value='Second Field'/> <input type='text' name='third' value='Thrird Field'/> <input type='text' name='fourth value='Fourth Field'/> </form> </div> <!-- wrapper --> </body> </html> </code> I'd deeply appreciate correction. Thanks. On my music site, I want to keep track of the number of times each song has been played. The code below uses a clicked button to send the request. But I need to be able to send the request as each song begins to play. Or when a user clicks another song in the list. Mr Oldies online radio station I am using the audio.js script for the html5 audio player. That code is listed below as well. This code creates a division with the ID of "playing" for the active song. It is in here somewhere, where I would need to include the request to send the data to a php page which then does the work of accessing and updating a databse. I just do not know enough of Javascript to do this. Can someone show me where exactly to put the required code to do this? Thanks. Code: <!DOCTYPE html>
<html>
<head>
<script>
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;
}
}
xmlhttp.open("GET","demo_get2.asp?fname=Henry&lname=Ford",true);
xmlhttp.send();
}
</script>
</head>
<body>
<h2>AJAX</h2>
<button type="button" onclick="loadXMLDoc()">Request data</button>
<div id="myDiv"></div>
</body>
</html>
audio.js code the other part of the audio.js script can be found here http://mroldies.net/test/audio.js Code: <script>
var loadedobjects=""
var rootdomain="http://"+window.location.hostname
function ajaxpage(url, containerid){
var page_request = false
if (window.XMLHttpRequest) // if Mozilla, Safari etc
page_request = new XMLHttpRequest()
else if (window.ActiveXObject){ // if IE
try {
page_request = new ActiveXObject("Msxml2.XMLHTTP")
}
catch (e){
try{
page_request = new ActiveXObject("Microsoft.XMLHTTP")
}
catch (e){}
}
}
else
return false
page_request.onreadystatechange=function(){
loadpage(page_request, containerid)
}
page_request.open('GET', url, true)
page_request.send(null)
}
function loadpage(page_request, containerid){
if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
document.getElementById(containerid).innerHTML=page_request.responseText
}
function loadobjs(){
if (!document.getElementById)
return
for (i=0; i<arguments.length; i++){
var file=arguments[i]
var fileref=""
if (loadedobjects.indexOf(file)==-1){ //Check to see if this object has not already been added to page before proceeding
if (file.indexOf(".js")!=-1){ //If object is a js file
fileref=document.createElement('script')
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src", file);
}
else if (file.indexOf(".css")!=-1){ //If object is a css file
fileref=document.createElement("link")
fileref.setAttribute("rel", "stylesheet");
fileref.setAttribute("type", "text/css");
fileref.setAttribute("href", file);
}
}
if (fileref!=""){
document.getElementsByTagName("head").item(0).appendChild(fileref)
loadedobjects+=file+" " //Remember this object as being already added to page
}
}
}
</script>
I'm very new to this so don't laugh at me But anyways what did I do wrong? Code: function XMLHttpRequest() {
var request = false;
if(window.XMLHttpRequest) {
if(typeof XMLHttpRequest != 'undefined')
try {
request = new XMLHttpRequest();
}
catch(e) {
request = false;
}
}
else if (window.ActiveXObject) {
try {
request = new ActiveXObject('Msxml2.XMLHTTP');
}
catch(e) {
request = false;
}
}
return request;
}
XMLHttpRequest.onreadystatechange = function requestWindow(url) {
windowOpen();
if(xmlhttp.readyState==4) {
document.getElementById('action1').innerHTML=XMLHttpRquest.responseText;
}
}
XMLHttpRequest.open("GET",url,false);
XMLHttpRequest.send(null);
when I click my button to use requestWindow it says requestWindow is not defined... ok I got it to try to load a page with this... but the problem was that the server does not find so and so page now =S and I know that page exists and its directing to the correct directory. Code: function requestWindow(url) {
windowOpen()
if (window.XMLHttpRequest) {
xmlhttp=new XMLHttpRequest();
}
else {
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET",url,false);
xmlhttp.send(null);
document.getElementById('action1').innerHTML=xmlhttp.responseText;
}
and now im even more confused... if I run it on localhost my page at least loads... run it on server and my scripts crash page does not load... GAH!!! http://opentech.durhamcollege.ca/~in...rittains/labs/ ok here is the entire crappy thing Code: var browser=navigator.appName;
var frameWidth = "";
var frameHeight = "";
var bgImage = "";
var desktop = "";
var menuBar = "";
var menuBarButton = "";
var menuBarContainer = "";
var menuBarClock = "";
var action1 = "";
var action2 = "";
var action3 = "";
var d = new Date();
var year = d.getFullYear();
var date = "";
var menuCheck = false;
var si = "";
var io = "";
function requestWindow(url) {
windowOpen()
if (window.XMLHttpRequest) {
xmlhttp=new XMLHttpRequest();
}
else {
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET",url,false);
xmlhttp.send(null);
document.getElementById('action1').innerHTML=xmlhttp.responseText;
}
/*
function XMLHttpRequest() {
var request = false;
if(window.XMLHttpRequest) {
if(typeof XMLHttpRequest != 'undefined')
try {
request = new XMLHttpRequest();
}
catch(e) {
request = false;
}
}
else if (window.ActiveXObject) {
try {
request = new ActiveXObject('Msxml2.XMLHTTP');
}
catch(e) {
request = false;
}
}
return request;
}
XMLHttpRequest.onreadystatechange = function requestWindow() {
windowOpen();
if(xmlhttp.readyState==4) {
document.getElementById('action1').innerHTML=XMLHttpRquest.responseText;
}
}
XMLHttpRequest.open("GET",url,false);
XMLHttpRequest.send(null);
*/
function reset() {
if (self.innerWidth) {
frameWidth = self.innerWidth;
frameHeight = self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth) {
frameWidth = document.documentElement.clientWidth;
frameHeight = document.documentElement.clientHeight;
}
else if (document.body) {
frameWidth = document.body.clientWidth;
frameHeight = document.body.clientHeight;
}
bgImage = document.getElementById("bgImage");
desktop = document.getElementById("desktop");
menuBar = document.getElementById("menuBar");
menuBarButton = document.getElementById("menuBarButtonSpan");
menuBarContainer = document.getElementById("menuBarContainer");
menuBarClock = document.getElementById("menuBarClock");
action1 = document.getElementById("action1");
action2 = document.getElementById("action2");
action3 = document.getElementById("action3");
if(browser!="Netscape") {
bgImage.style.top = 8 + "px";
bgImage.style.left = 8 + "px";
desktop.style.top = 8 + "px";
desktop.style.left = 8 + "px";
menuBar.style.top = (frameHeight - 45) + "px";
menuBar.style.left = 8 + "px";
}
bgImage.style.width = (frameWidth - 21) + "px";
bgImage.style.height = (frameHeight - 51) + "px";
desktop.style.width = (frameWidth - 20) + "px";
desktop.style.height = (frameHeight - 50) + "px";
menuBar.style.width = (frameWidth - 20) + "px";
menuBar.style.top = (frameHeight - 40) + "px";
menuBarClock.style.left = (frameWidth - 100) + "px";
t=setTimeout('reset()',500);
}
function menuSize() {
action3.style.backgroundColor = "black";
action3.style.color = "#C0C0FF";
action3.style.border = "1px solid #C0C0FF";
action3.style.width = "250px";
action3.style.height = "400px";
action3.style.padding = "5px";
if(browser!="Netscape") {
action3.style.top = (frameHeight - 452) + "px";
var winCheck = frameWidth - 1651;
if(winCheck<=0) {
action3.style.left = 8 + "px";
}
else {
action3.style.left = (frameWidth - 1672) + "px";
}
}
else {
action3.style.top = (frameHeight - 452) + "px";
var winCheck = frameWidth - 1672;
if(winCheck<=0) {
action3.style.left = 8 + "px";
}
else {
action3.style.left = (frameWidth - 1672) + "px";
}
}
//menuT=setTimeout('menuSize()',500);
}
function menu() {
if(menuCheck==false) {
var lab1 = "'../lab1.html'";
menuSize();
action3.innerHTML = '<input type="button" class="menuButtons" id="menuButton1" value="Lab1" onclick="requestWindow(' + lab1 + ')" /><input type="button" class="menuButtons" id="menuButton2" value="Lab2" onclick="lab2()" /><input type="button" class="menuButtons" id="menuButton3" value="Lab3" onclick="lab3()" /><input type="button" class="menuButtons" id="menuButton4" value="Lab4" onclick="lab4()" /><input type="button" class="menuButtons" id="menuButton5" value="Lab5" onclick="lab5()" /><input type="button" class="menuButtons" id="menuButton5" value="Lab6 - comming soon" onclick="lab6()" />';
menuCheck=true;
}
else if(menuCheck==true) {
action3.style.backgroundColor = "transparent";
action3.style.border = "0px solid #C0C0FF";
action3.style.width = "0px";
action3.style.height = "0px";
action3.style.padding = "0px";
action3.style.top = "0px";
action3.style.left = "0px";
action3.innerHTML = "";
window.clearTimeout(menuT);
menuCheck=false;
}
}
function clearMenu() {
action3.style.backgroundColor = "transparent";
action3.style.border = "0px solid #C0C0FF";
action3.style.width = "0px";
action3.style.height = "0px";
action3.style.padding = "0px";
action3.style.top = "0px";
action3.style.left = "0px";
action3.innerHTML = "";
menuCheck=false;
//menuT=setTimeout('clearMenu()',500);
}
function windowSize () {
action1.style.backgroundColor = "black";
action1.style.color = "#C0C0FF";
action1.style.border = "1px solid #C0C0FF";
action1.style.width = (frameWidth - 375) + "px";
action1.style.height = (frameHeight - 200) + "px";
action1.style.left = (frameWidth - 1500) + "px";
var winCheck1 = (frameWidth - 1500);
if(winCheck1<=0) {
action1.style.left = (frameWidth - 850) + "px";
}
action1.style.top = (frameHeight - 750) + "px";
var winCheck2 = (frameHeight - 750);
if(winCheck2<=0) {
action1.style.top = (frameHeight - 500) + "px";
}
t=setTimeout('windowSize()',500);
}
function windowOpen() {
windowSize()
document.getElementById("action1").innerHTML = '';
action1.style.filter = "alpha(opacity=" + (0*100) + ")";
action1.style.opacity = 0;
var si = setInterval(function() {
io+=0.05;
action1.style.filter = "alpha(opacity=" + (io*100) + ")";
action1.style.opacity = io;
}, 100);
io = 0;
if(io==1) {
window.clearInterval(si);
}
clearMenu();
}
function lab1() {
windowOpen();
<?php
$page = file_get_contents("../lab1.html");
$page = str_replace("\r", "", $page); //remove carriage returns
$page = str_replace("\n", "", $page); //remove carriage returns
?>
document.getElementById("action1").innerHTML = '<?php echo $page; ?>';
}
function lab1b() {
windowOpen();
<?php
$page = file_get_contents("../lab1b.html");
$page = str_replace("\r", "", $page); //remove carriage returns
$page = str_replace("\n", "", $page); //remove carriage returns
?>
document.getElementById("action1").innerHTML = '<?php echo $page; ?>';
}
function lab2() {
windowOpen();
<?php
$page = file_get_contents("../lab2.html");
$page = str_replace("\r", "", $page); //remove carriage returns
$page = str_replace("\n", "", $page); //remove carriage returns
?>
document.getElementById("action1").innerHTML = '<?php echo $page; ?>';
}
function lab3() {
windowOpen();
<?php
$page = file_get_contents("../lab3.html");
$page = str_replace("\r", "", $page); //remove carriage returns
$page = str_replace("\n", "", $page); //remove carriage returns
?>
document.getElementById("action1").innerHTML = '<?php echo $page; ?>';
}
function lab4() {
windowOpen();
<?php
$page = file_get_contents("../lab4.html");
$page = str_replace("\r", "", $page); //remove carriage returns
$page = str_replace("\n", "", $page); //remove carriage returns
?>
document.getElementById("action1").innerHTML = '<?php echo $page; ?>';
}
function lab5() {
windowOpen();
<?php
//$page = file_get_contents("../lab5.php");
//$page = str_replace("\r", "", $page); //remove carriage returns
//$page = str_replace("\n", "", $page); //remove carriage returns
?>
document.getElementById("action1").innerHTML = '<?php /*echo $page;*/ /*str_replace("\r", "", include "../lab5.html");*/ include "../lab5b.php"; ?>';
}
function lab6() {
windowOpen();
document.getElementById("action1").innerHTML = '<?php include "../lab62.php"; ?>';
}
|
|||||||