JavaScript - Bookmark Web Page That Uses Ajax
We have an html page which brings in content dynmically using Ajax. So the page starts out with certain content, and when a particular link is clicked, the content is swapped out with new content. With this approach, the back button on the browser does not work, because the URL didn't actually change. How could a user bookmark the new page with the second set of content? Is this even possible?
Similar Tutorialsworked it out
Can anyone post Add bookmark script that works fine on all major browsers (IE, FF, Opera, Chrome, safari)? The script should be as compact as possible. All I have found works only on opera or firefox but not both. Thanks Hi... I am having a problem with the resize... I use the script below to adjust the size of the frame. It works nicely for me. The only problem is, the frame initially jumps to the bookmark, and then on the reload, jumps to the top of the page. Any ideas on how to keep the frame at the bookmark in the web page, instead of jumping back up to the top???? Thanks much in advance.... <script> <!-- function resize_iframe(){ if ( window.frames["MainWindow"].document.body.scrollHeight=0 ) { } else { document.getElementById("MainWindow").height=100 document.getElementById('MainWindow').height=window.frames["MainWindow"].document.body.scrollHeight + 20 } } // --> </script> <IFRAME src="main.htm" frameborder="0" scrolling="no" ID=MainWindow NAME=MainWindow HEIGHT=800 WIDTH=1012 onLoad=resize_iframe();></IFRAME> Hi just wondering if someone could check my code. I have a flash document that is referenced in index.html file below. I want to create book marks to specific pages of the flash file. My code below opens it up at the first page but I want it to open at page 5. Any help would be appreciated? Code: <script language="javaScript"> function loadPage($page) { var load = window.open('/resources/default/html/Mag/index.html?page='+$page,'','scrollbars=no,menubar=no,height=800,width=1280,resizable=no,toolbar=no,location=no,status=no'); } </script> <LI><A href="javascript:loadPage(5)">Face to face1</A></LI> Hello folks, I want to have a combobox with bookmark options. After you select a value from this combobox you can bookmark it with a push button. This should popup a bookmark dialog from the browser bookmark dialog. Can anybody help me? Lets say we have 3 options in the value's. Google, Yahoo, Bing When you select Google and you push Place bookmark you should get a browser bookmark dialog with a title "Google search site". The url would be just http://www.google.com/ I also want Yahoo with the url http://www.yahoo.com/ and the bookmark title Search at Yahoo! and Bing with the url http://www.bing.com and the title Search at Bing I'm looking already for a while for this. Can anybody help me? Thanks in advance! grid Several of the iPhone features can be duplicated with Javascript. One such feature I'd like to see is the Bookmark feature. You click on the Bookmark or Favorite button and the page name (of the html page) is saved to a list, just like what you see in modern browsers. Clicking on the list row brings up the bookmarked page. However, the app is not a browser, but made up of html/css/js pages that function from within a /www/ folder of the app. I've searched for such a script online, but the only ones I see are for desktop browsers (they permit a visitor to click on a link to place the page in the Bookmarks tab or folder of the browser). Does anyone know of a script that'll work on html pages in the iPhone and Android devices? Thanks! Steve hey guys i have been trying for the last week to make a one of a kind login page. but i cannot figure out how to make the Slide bar initiate a Form submition i have made a sample page on jsfiddle shown here http://jsfiddle.net/Cav3maN/ZzwQq/embedded/result/ if your not farmiliar with jsfiddle just remove the embedded/result/ to see the source http://jsfiddle.net/Cav3maN/ZzwQq/ please feel free to modify the source and get it to submit. if your slider disapeers click the "Run" tab at the top. and when you get it successfully working click "Update" tab and send the new url on here for me to see. thanks very much. aslo this is a free source feel free to embed it in your site anywhere. thanks alot and please guy i beleve in you all lol im new to web coding and i wanna be successful so if you wish to show me exactly what you done to make this work i would love you for ever. Hey, I have 3 bits of code, 2 of which I'm pretty sure are right [i know the php works, and the ajax looks fine], but one i'm having trouble with. Basically what I'm trying to do is use a link to call php function [calls a piece of text from a database]. Which worked fine. But then I tried to incorporate AJAX into the script to make change dynamically on the page, and I'm a little confused with it all. I've got the AJAX and PHP, [and an attempted page with a link on to try and call the function with AJAX] but so far it's not doing as it should. Wondered if anyone could show me where I'm going wrong with the whole 'linking together' thing? So far everything I've tried hasn't worked. [hope this doesn't violate the forums 'don't dump your code' rule. But it's kind of all necessary] The AJAX [AJAX.js]: Code: function loadurl(generate.php) { var ajax = false; // Create the object: // Choose the objecttype, depending on what is supported: if (window.XMLHttpRequest) { // IE 7, Mozilla, Safari, Firefox, Opera, most browsers: ajax = new XMLHttpRequest(); } else if (window.ActiveXObject) { // Old IE-browsers // Make the type Msxml2.XMLHTTP, if possible: try { ajax = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e1) { // Else use the other type: try { ajax = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e2) { } } } // Retrieving the data from the page if (ajax) { alert("url:generate.php" + url); ajax.open('GET', url); // Sends request ajax.send(null); // Function that handles response ajax.onreadystatechange=function(){ // If everything is OK: if ( (ajax.readyState == 4) && (ajax.status == 200) ) { // Returns the value to the document alert(ajax.responseText); } } } else { // AJAX is not useable alert('It is not possible to connect, please update your browser.'); } } The PHP [generate.php] Code: <!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> <?php if($_GET['act'] == "generate_quotes") { $db = mysql_connect("*", "*", "*") or die ("Unable to connect to database."); mysql_select_db("quote") or die ("Unable to select database."); $result = mysql_query( " SELECT * FROM `quote` ORDER BY RAND() LIMIT 0,1 " ); $fetch = mysql_fetch_array($result); echo "<blockquote>".$fetch['q_quote']."</blockquote>"; mysql_close($db); } else { echo "<img src=\"1.png\">"; } ?> </body> </html> The page where I'm trying to bring them together [PULL.php] Code: <!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> <script src="ajax.js" type="text/javascript"></script> </head> <body> <a onClick="loadurl('generate.php'); return false;">Click Here</a> </body> </html> I've included the file names with extensions just in case it's something to do with those, but thanks in advance for any help. Greatly appreciated. I am not sure if this is the proper place to ask this or not or even what to ask for. I am very new to this and this is just for learning. The code is not mine. The code is just a blue table with a bookmark option. When I remove the javascript code for the bookmark the blue table disappears. Can anyone tell me why that happens? Code: <html> <body> <table width="95%" align="center" cellpadding="0" cellspacing="0" bgcolor="#3399ff"> <tr bgcolor="#3399ff"> <td colspan="11" align="right" valign="middle" bgcolor="#3399ff"> <script language="javascript"> <!--blue area below tabs--> //This code is for IE v4 or better if (navigator.appName == "Microsoft Internet Explorer" && navigator.appVersion >= "4.0") {document.write( "<SPAN class='bookmark' onClick='window.external.AddFavorite(location.href, document.title);'>*Bookmark this page*</SPAN>")} //This code posts text if not else {document.write("<span class='bookmark'>book mark this page</span>")} </script> </tr> </table> </body> </html> This is the code exactly how it was sent. I am trying to remove the bookmark option but keep the table the way it is. Anyone have any idea what I am doing wrong? Thank you very much I'm poking in the blind with javascript and hope that you can help with this issue. A javascript function is making a call to an external php file, which checks the compares the current time with a time stored in a mysql database. If a certain time passes, the php will send back instructions to redirect the user to a different page. The issue is that the page refreshes every time the is javascript function is executed. This resets any forms, or videos that the user is watching on the page. Here is the relevant code: Code: function checkTimer() { 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) { window.location.href = xmlhttp.responseText; } } xmlhttp.open("POST","php/5minforpage10.php",true); xmlhttp.send(); } window.setInterval(checkTimer,15000); Is there a way to achieve the goal of checking the time against the server time (via the php code) without refreshing the page? Thanks kindly! I have been searching online for hours, but it is possible I'm just not thinking of the correct keywords. I have included a basic illustration of the current setup (which does not work). The issue lies with the page that is the desired output. I have a far deeper issue which I have narrowed down to javascript on the final .asp page not loading at all. On default.asp, I am calling a function contained in 'ajax_call-contentselection.js' Code: <a onclick="func_displaycontents('restaurants'); return false">displayajaxcontent</a> Honestly, I don't believe the following piece of code (ajax_call-contentselection.js) is relevant, as it is standard ajax code, but just in case: Code: function func_displaycontents(var_type){ var xmlHttp = GetXmlHttpObject(); var url = "../_include/ajax_display-contentselection.asp"; url += "?type="+var_type; if (!xmlHttp){ alert ("Browser does not support HTTP Request") return } xmlHttp.onreadystatechange=function(){ if(xmlHttp.readyState == 1){ document.getElementById("div_ajaxfillattractions").innerHTML = "<div style='padding-top:50px;color:white;width:930px;text-align:center;'><img src='../_images/ajax-loader.gif'/><br/>Loading...</div>"; }; if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){ document.getElementById("div_ajaxfillattractions").innerHTML=xmlHttp.responseText; } }; xmlHttp.open("GET", url, true); xmlHttp.send(null); } The other contents of "ajax_display-contentselection.asp" are displayed properly in "div_ajaxfillattractions" of "default.asp", but no javascript code on that page loads. If I use "ajax_display-contentselection.asp" as an include file on "default.asp", I get the javascript alert of 'Success', but when I initiate the AJAX it does not work, so I know there isn't a problem with the javascript. Please let me know if I sucked at explaining something, or more detail is needed. Thanks in advance, Matt OK, I've just been working with kwyl, trying to intergrate a like/dislike script to her site. There was an original script, and although bugged, it's almost the What works The user clicks the like/dislike icon. Ajax sends a request to PHP: Either the like/dislike gets inserted into the database. OR, if the user has already liked/disliked that post, an alert error gets returned. What doesn't work If you click to like/dislike a post, it won't appear (the current count is in brackets beside the icons) unless the page is refreshed. How would I use this along side Ajax for auto update? $data = mysql_fetch_object(mysql_query('SELECT `like`,`unlike` FROM posts WHERE id="'.$row['id'].'"')); It's used he Code: $data = mysql_fetch_object(mysql_query('SELECT `like`,`unlike` FROM posts WHERE id="'.$row['id'].'"')); ?> <br /> <div class="vote"> <a href="javascript:;" onclick="doAction('<?php echo $row['id']; ?>','unlike');"> <input type="image" name="submit" src="images/down.gif" /></a> (<span id=""><?php echo $data->unlike;?></span>) <a href="javascript:;" onclick="doAction('<?php echo $row['id']; ?>','like');"> <input type="image" name="submit" src="images/up.gif"></a> (<span id=""><?php echo $data->like;?></span>) I hate javascript and this is utterly driving me up the wall. Any help would be much appreciated. If you need more informaton/code please ask. Hello, I've searched high and low for some decent code that will allow a visitor to a website to bookmark the site through a hyperlink. The bookmarking is done through a javascript function that looks like this: Code: function OnBookmarkButtonClick (e) { if (window.sidebar) { // Mozilla Firefox Bookmark window.sidebar.addPanel("TimeSheet", window.document.location,""); } else if (window.external) { // IE Favorite window.external.AddFavorite( window.document.location, "TimeSheet"); } } I need to add some detection for Opera, Safari, and Chrome. Please note that it must be feature detection, not browser detection. But as I said, I've searched high and low for this, and couldn't find anything. Help is much appreciated. I have a problem where the page doesn't expand when more results get loaded via jquery on a facebook style wall. Once more results get loaded the footer stays static instead of moving down. What's the best way to do this? I have a website that is using ajax to keep the page up to date with the database information. I call this page through a file called start.php. Once index.php is loaded it has a menu with selections. I then want it to call a page called query.php in an iframe to update the information, but not open a new window. In the iframe the query.php will run and then redirect itself to blank.php. The code is as follows and any help would be much appreciated. I have tried several methods of doing this and they have been commented out because they didn't work or didn't do what I wanted them to do. I do not want to use window.open since IE doesn't work well with it. window.open does work by pop up windows but I want to stay away from them. The main code I am looking to get help on is in red under start.php. In start.php I will include the entire file. In index.php I'm only going to include the main sections I use for this snippit. In query.php I'm not going to include query.php since I beleive this file isn't important for this snippit. start.php Code: <html> <head> <title>Countries At War!</title> <body style="background-color:#B0C4DE;"> <script language="JavaScript" type="text/javascript"> //Gets the browser specific XmlHttpRequest Object function getXmlHttpRequestObject() { if (window.XMLHttpRequest) { return new XMLHttpRequest(); //Not IE } else if(window.ActiveXObject) { return new ActiveXObject("Microsoft.XMLHTTP"); //IE } else { //Display your error message here. //and inform the user they might want to upgrade //their browser. alert("Your browser doesn't support the XmlHttpRequest object. Better upgrade to Firefox."); } } //Get our browser specific XmlHttpRequest object. var receiveReq = getXmlHttpRequestObject(); //Initiate the asyncronous request function sayHello() { //If our XmlHttpRequest object is not in the middle of a request, start the new asyncronous call. if (receiveReq.readyState == 4 || receiveReq.readyState == 0) { //Setup the connection as a GET call to SayHello.html. //True explicity sets the request to asyncronous (default). receiveReq.open("GET", 'index.php', true); //Set the function that will be called when the XmlHttpRequest objects state changes. receiveReq.onreadystatechange = handleSayHello; //Make the actual request. receiveReq.send(null); } } //Called every time our XmlHttpRequest objects state changes. function handleSayHello() { //Check to see if the XmlHttpRequests state is finished. if (receiveReq.readyState == 4) { //Set the contents of our span element to the result of the asyncronous call. document.getElementById('span_result').innerHTML = receiveReq.responseText; } } function openMenu(query) { var myString = 'query.php?' + query; // window.open(myString, 'linkname', 'title=no, height=465, width=400, left=550, top=150, location=yes, resizable=no, menubar=no, scrollbars=no') //document.getElementById('engine').src = myString; //document.getElementById('engine').setAttribute('src',myString;); //top.frames['engine'].location.href = myString; pausecomp(1000); sayHello(); } function pausecomp(millis) { var date = new Date(); var curDate = null; do { curDate = new Date(); } while(curDate-date < millis); } </script> </head> <body> <a href="javascript:sayHello();">Say Hello</a><br /> <iframe src="blank.php" MarginWidth="0" transparent="yes" width="30" height="25" frameborder="0" scrolling="no" name="engine"> UPGRADE YOUR BROWSER</iframe> <span id="span_result"></span> <body onLoad="sayHello();"> </body> </html> index.php Code: <table width="100%" border="2" bordercolor="Black"> <tr><center> <td><center><a href="javascript:void(0);" onclick="javascript: openMenu('menulevel1=1');">Home</a></td> <td><center><a href="javascript:void(0);" onclick="javascript: openMenu('menulevel1=2');">Jobs</td> <td><center><a href="javascript:void(0);" onclick="javascript: openMenu('menulevel1=3');">Travel</td> <td><center><a href="javascript:void(0);" onclick="javascript: openMenu('menulevel1=4');">Fight</td> <td><center><a href="javascript:void(0);" onclick="javascript: openMenu('menulevel1=5');">Inventory</td> <td><center><a href="javascript:void(0);" onclick="javascript: openMenu('menulevel1=6');">Properties</td> <td><center><a href="javascript:void(0);" onclick="javascript: openMenu('menulevel1=7');">Rewards<?php if($db_field['rewardpoints'] >= "1") print "(". $db_field['rewardpoints'] . ")";?></td> <td><center><a href="javascript:void(0);" onclick="javascript: openMenu('menulevel1=8');">Profile<?php if($db_field['profilepoints'] >= "1") print "(". $db_field['profilepoints'] . ")";?></td> <td><center><a href="javascript:void(0);" onclick="javascript: openMenu('menulevel1=9');">Alliances</td> <td><center><a href="javascript:void(0);" onclick="javascript: openMenu('menulevel1=10');">Options</td> </tr></center> </table> Thanks in advance for all the help. hi, When I navigate to a page with Ajax on my iphone or ipad, it doesn't show up, page is just blank, I have checked for errors and there is no errors?! here is my Ajax code Code: function datecheckFunction(){ var datecheckRequest; // The variable that makes Ajax possible! try{ // Opera 8.0+, Firefox, Safari datecheckRequest = new XMLHttpRequest(); } catch (e){ // Internet Explorer Browsers try{ datecheckRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try{ datecheckRequest = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e){ // Something went wrong alert("Your browser broke!"); return false; } } } // Create a function that will receive data sent from the server datecheckRequest.onreadystatechange = function(){ if(datecheckRequest.readyState == 4){ var ajaxDisplay = document.getElementById('ajaxDiv'); ajaxDisplay.innerHTML = datecheckRequest.responseText; } } var datepicker = document.getElementById('datepicker').value; var queryString = "?datepicker=" + datepicker; //Add the following line datecheckRequest.open("GET", "http://www.affordableappliancerepairs.co.uk/admin/checkdate.php" + queryString, true); datecheckRequest.send(null); } he everyone please i want to know how to submit a form using ajax every 5 minutes without reloading page i have a huge form for exams and i need to submit the form without the need to wait until pressing submit because the user may wait to think about the answer a very long time.. so i want to submit the form and at the same time i cant reload the page as it is in normal submit form.. so how i can submit form in the background without letting the user knows that the form is submitted??? in my php page i have two text field i have to get the value by ajax/java script then by clickin radio button add or multy ply i have to show the result. how cain i do it?
Hi, I am hoping I just need to be pointed in the right direction with this. I have Page1. When Page1 body onloads it uses Ajax to call PartA Within PartA I have a message board so members can write messages which will be sent to my database in PartA[1] and immediately posted for view on to PartA[2]. As I want to have my request to the server updating regularly I want to have PartA[2] on a timed loop to refresh - I do not need the content of PartA[1] to refresh. So the order of events would look like this: Page1 | onload call | v PartA / \ V V PartA[1] PartA[2] (loads once) (constantly refreshes) What I am not sure about is that I have <body> and <head> attributes in Page1 only. I have already used my body onload to call PartA (and can't use it to call PartA[2] before PartA has loaded anyway). I do not want the user to have to click a button or do anything to call up PartA[2]. So my question is how would I get PartA[2] to automatically load within PartA? I hope I have made this clear, but if I haven't let me know and I will try again. |