JavaScript - Chrome Throws Js Error When User Clicks Back Button.
Hi,
"This happens only in chrome browser" I am trying to design a website and it has a couple of radio button on the first page. I selected one radio button and navigated to the next page. On my second page, if i hit back button, the first page show the radio option that i selected(which is correct) but when I hit save and continue it throws a JS error "please select one option". Chrome forces me to re-click the radio option again. The application is MVC 3.5, C# Here is the snippet of the ascx Code: <%= Html.RadioButton("radAccnt", "abc", Account != null ? (entity != string.Empty ? (entity.Substring(0, 3).Equals("abc") ? true : false) : false) : false, new { id = "radAbc", onClick = "SetEntity('abc');", onBlur = "javascript:ValidateOnBlur(\"ValidateAccount('true');\");" })%> I had a alert in SetEntity(Value) function and value is empty when the back button is clicked. I did some research and found that Chrome does not cache the form data. If this is true is there a work around for this? Please help. Thanks. Similar TutorialsHi Everyone, I want to execute a script when the user clicks the button. Currently in my html doc. i have the button declared. <input type="button" id ="button" onclick='notEmpty() value="Play"/> When the button is clicked, i execute the notEmpty() function and I want to execute a script inside the notEmpty(). How can i do this? Thanks, Praveen Hello Everbody, I have been at this problem for 10 hours now and am going NUTS!! I am making website to look around an ancient Egyptian Tomb. Feel free to have a look: http://www.campbelltest.co.uk/britishMuseum/online/ I have a flash movie which I have scripted to utilise the browser back button using this script http://www.asual.com/swfaddress/docs/. This works fine until open a lightbox image form within the flash movie using Lokesh Dhakar Light box http://www.lokeshdhakar.com/projects/lightbox2/ and the browsers back button stops working!! The code below is to the JavScript links and the code that lauches the lightbox: Code: <script type="text/javascript" src="js/swfaddress-optimizer.js"></script> <script type="text/javascript" src="js/swfobject.js"></script> <script type="text/javascript" src="js/swfaddress.js"></script> <script type="text/javascript" src="js/swfmacmousewheel.js"></script> <script src="js/prototype.js" type="text/javascript"></script> <script src="js/scriptaculous.js?load=effects" type="text/javascript"></script> <script src="js/lightbox.js" type="text/javascript"></script> <!-- start | JC --> <!-- added for flash --> <!-- added for launch from flash --> <script language="JavaScript"> function openLightbox(url,group){ var objLink = document.createElement('a'); objLink.setAttribute('href',url); objLink.setAttribute('rel','lightbox['+group+']'); objLink.setAttribute('title','caption'); Lightbox.prototype.start(objLink); } </script> <!-- end | JC --> This code is how I have embeded the flash in the page: Code: <script type="text/javascript"> var so = new SWFObject('container04.swf', 'container04', '760', '450', '8', '#ffffff'); so.useExpressInstall('js/expressinstall.swf'); so.addParam('menu', 'false'); //so.addParam('movie','container04'); so.write('flashcontent'); var macmousewheel = new SWFMacMouseWheel( so ); </script> I have added a text box to movie that shows the back button function exicuting and what its exicuting. I have never done any work with JavaScript before so I am up the creek without a paddle!! Hello I want to add something to my web site. when the user clicks to download. i want to see a pop up screen which says your download has started. <script type="text/javascript"> function show_alert() { alert("Your Download Started!"); } </script> <input type="button" onclick="show_alert()" onclick="get value="Download" /> I dont get where should i put the download link I want to send a simple email with just email & subject only when the user clicks a link that opens a pdf. I'm thinking javascript is the best way to do this but I have no idea how. I have googled it a bunch but most information is about getting an email when someone clicks a link you send in an email. I don't want that. This is on a website. I'm not sure if php would be better to use. Any help would be most appreciated!
How to detect if the user clicked cancel while uploading a file ? Is there an event for it?
I found this code sample that when a user clicks somewhere on the image, then an "X" will appear. I would like to have the "X"s remain visible even when the user clicks on a different area of the image. As you can imagine, a user clicks clicks clicks then there are "X"s everywhere. How do I do this? Do I need to create more "div" tags with the mouse click locations? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Mouse position</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <script language="JavaScript" type="text/JavaScript"> var posx; var posy; function getMouse(e){ posx=0;posy=0; var ev=(!e)?window.event:e;//IE:Moz if (ev.pageX){//Moz posx=ev.pageX+window.pageXOffset; posy=ev.pageY+window.pageYOffset; } else if(ev.clientX){//IE posx=ev.clientX+document.body.scrollLeft; posy=ev.clientY+document.body.scrollTop; } else{return false}//old browsers } function showP(){ document.getElementById("div2").style.visibility="visible"; document.getElementById("div2").style.top =(posy-10)+'px'; document.getElementById("div2").style.left=(posx-6)+'px'; } </script> <style type="text/css"> .div1 {position:absolute;top:100px;left:100px;visibility:visible;z-index:5} .div2 {position:absolute;top:0px;left:0px;visibility:hidden;z-index:1;color:black;} .div3 {position:absolute;visibility:hidden;z-index:10;font-family:monospace;font-size:20px;font-weight:900;color:black;} </style> </head> <body onmousemove="getMouse(event)"> <div id="div1" class="div1"> <img src="./yourImage.jpg" onclick="showP()"> </div> <div id="div2" class="div3"> X </div> </body> </html> i have the following code which i am trying to insert a 'back button' into to go back to the previous page. i can only seem to get the button to appear either at the very top or very bottom of the page, does anyone know how i can specify the location? this script is generated from easypano tourweaver - Code: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Virtual Tour Created By CAPITA SYMONDS</title> </head> <body leftMargin="0" topMargin="0" rightMargin="0" bottomMargin="0"> <script type="text/javascript" src="swfobject.js"></script> <div id="flashcontent"> To view virtual tour properly, Flash Player 9.0.28 or later version is needed. Please download the latest version of <a href="http://www.adobe.com/go/getflashplayer" target="_blank">Flash Player</a> and install it on your computer. </div> <script type="text/javascript"> // <![CDATA[ var so = new SWFObject("twviewer.swf", "sotester", "1024", "768", "9.0.0", "#FFFFFF"); so.addParam("allowNetworking", "all"); so.addParam("allowScriptAccess", "always"); so.addParam("allowFullScreen", "true"); so.addParam("scale", "noscale"); //<!-%% Share Mode %%-> so.addVariable("lwImg", "resources/2_area_multipix_preloading image file.jpg"); so.addVariable("lwBgColor", "255,255,255,255"); so.addVariable("lwBarBgColor", "255,186,186,186"); so.addVariable("lwBarColor", "255,153,0,0"); so.addVariable("lwBarBounds", "-512,-384,1024,768"); so.addVariable("lwlocation", "4"); so.addVariable("lwShowLoadingPercent", "false"); so.addVariable("lwTextColor", "255,0,0,0"); so.addVariable("iniFile", "config_2_Area_Multipix.bin"); so.addVariable("progressType", "1"); so.addVariable("swfFile", "resources/2_area_multipix_1_animation for tourweaver.swf"); so.addVariable("href", location.href); so.write("flashcontent"); // ]]> </script> </body> </html> here is the button code - Code: <span onclick="javascript:history.back()" style="text-decoration:underline; color:blue; cursor:hand">Back</span> I am making a simple puzzle game on Android using Phonegap, that is HTML5, CSS3 and JavaScript. When a user fills an answer on a page, if the answer is correct, it will go to another page. However, once the user goes to the next page, he/she CANNOT return back to the previous page. I do not want the user to return back, else he/she will have to fill the answer again to go to the next page, so it's not good. Thank Sorry if this is the wrong place for this question, but... I'm having an issue with the difference in behavior between the IE and FF back buttons. I'm using jQuery to create collapsable div regions which contain text boxes on a search form. After submit, if the use clicks the back button in FF, the region(s) the user had previously expanded, show as expanded. Also, there search term is still present. In IE, when clicking the back button, all regions are collapsed, in there original loaded state, but the search term is still saved. I put the following code at the top of the page: onload=function(){ alert('Onload!'); } When clicking the back button in FF, nothing happens. For IE, the alert pops up. This tells me that IE reloads the page (but somehow still saves some things, like the search text). My question is, is there a way to keep IE from reloading when the use clicks 'back'? I will be creating my own 'edit' back button for users to get around this, but I also would like to prevent this from confusing users and causing undesired results. Any help would be greatly appreciated. I have a website using this pageslide function http://srobbin.com/blog/jquery-pageslide/ Basically the page you see in the example is acting as a side menu bar and when you click the links on that page, it performs the sliding action and a new page slides into the screen. I'm wondering if there is any way to get the back button to slide it back to the main page, rather than having to click a link to go back? Hi, I have the following problem: When I use this script it pops up both if a user tries to close the window and also if he presses the back button. Please tell how to show another window or do another action when the back button is pressed? I know it is possible although a lot of people say it's not. Code: <script type="text/javascript" type="text/javascript"> window.onbeforeunload = confirmExit; function confirmExit() { return "blabla"; } </script> How you handle back button scenario in firefox browser. The problem is when i click browser back button , the javascript on load is not executed and page is rendered from cache. It works in IE.. I am creating a popup for an online store so that when prospective customers put something in their shopping cart and then try to leave the site, they are offered a coupon in a popup. I am using the following code (FYI, uses prototype.js) Code: Event.observe(document.body, 'click', function(event) { if (Event.element(event).tagName == 'A' || Event.element(event).tagName == 'INPUT' || Event.element(event).tagName == 'IMG') { staying_in_site = true; } }); window.onbeforeunload = popup; function popup() { if (staying_in_site) { return; } if (popup_displayed) { return; } popup_displayed = true; //popup displayed here } The popup is not displayed when the user clicks on a link or submits a form (correct behavior) and it is displayed when the user types in a URL or tries to close the browser (also correct behavior). The problem is when the user clicks the back or forward buttons, the popup is displayed which is not the desired behavior. Anyone here have a solution for this? Hello, I need some script to force the browser to reload/refresh when a page is reached from the back button. EG You're on page A -> You click a link onto page B -> You Press Browser back to go onto Page A, it has old content that requires a reload. Now, my page is currently php so I won't bother with my code here as I am looking for any solution (I have also posted in php forum). Any JS solution that will trigger a reload on browser back is appreciated. I have tried a few ideas, most work in Chrome, IE always works, Firefox 4 and Opera 11 wont reload, simply fetching from cache I believe. Thanks. I guess this case applies to both popup windows opened by window.open() and by showModalWindow(). I have two buttons in popup window, "Cancel" and "Save". If the user clicks either button, there is a "process" at parent window before close() at popup being called. The problem now is, if the user click the "X" sign at top right corner of that popup window, how to trigger the "process"? I think I can do nothing in popup window since the closure is unexpected programmatically. Can I put some kind of listener in parent window to detect if popup is closed? Hello to all and thank you for any help beforehand. I have an issue with the script below, Select the top dropdown and the second gets populated, this is a nice piece of script, the only problem is that when the information is posted and presented on the process page I click page back to the form to rectify some other field but the ajax resets so I have to select Country & City each time even if thease fields are correct. I know that back button as well as bookmark is a problem with ajax but i think there is a solution the only thing is I don't know how to apply it to this script. Source of the script: http://www.dhtmlgoodies.com/index.ht...chained_select Ajax file: http://www.dhtmlgoodies.com/AJAX/ajax.js test.html Code: <!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" xml:lang="en" lang="en"> <head> <title></title> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <meta name="description" content="" /> <meta name="keywords" content="" /> <script type="text/javascript" src="ajax.js"></script> <script type="text/javascript"> var ajax = new Array(); function getCityList(sel) { var countryCode = sel.options[sel.selectedIndex].value; document.getElementById('dhtmlgoodies_city').options.length = 0; // Empty city select box if(countryCode.length>0){ var index = ajax.length; ajax[index] = new sack(); ajax[index].requestFile = 'getCities.php?countryCode='+countryCode; // Specifying which file to get ajax[index].onCompletion = function(){ createCities(index) }; // Specify function that will be executed after file has been found ajax[index].runAJAX(); // Execute AJAX function } } function createCities(index) { var obj = document.getElementById('dhtmlgoodies_city'); eval(ajax[index].response); // Executing the response from Ajax as Javascript code } function getSubCategoryList(sel) { var category = sel.options[sel.selectedIndex].value; document.getElementById('dhtmlgoodies_subcategory').options.length = 0; // Empty city select box if(category.length>0){ var index = ajax.length; ajax[index] = new sack(); ajax[index].requestFile = 'getSubCategories.php?category='+category; // Specifying which file to get ajax[index].onCompletion = function(){ createSubCategories(index) }; // Specify function that will be executed after file has been found ajax[index].runAJAX(); // Execute AJAX function } } function createSubCategories(index) { var obj = document.getElementById('dhtmlgoodies_subcategory'); eval(ajax[index].response); // Executing the response from Ajax as Javascript code } </script> </head> <body> <form action="" method="post"> <table> <tr> <td>Country: </td> <td><select id="dhtmlgoodies_country" name="dhtmlgoodies_country" onchange="getCityList(this)"> <option value="">Select a country</option> <option value="dk">Denmark</option> <option value="no">Norway</option> <option value="us">US</option> </select> </td> </tr> <tr> <td>City: </td> <td><select id="dhtmlgoodies_city" name="dhtmlgoodies_city"> </select> </td> </tr> </table> </form> </body> </html> Here's the content of getCities.php Code: <?php if(isset($_GET['countryCode'])){ switch($_GET['countryCode']){ case "no": echo "obj.options[obj.options.length] = new Option('Bergen','1');\n"; echo "obj.options[obj.options.length] = new Option('Haugesund','2');\n"; echo "obj.options[obj.options.length] = new Option('Oslo','3');\n"; echo "obj.options[obj.options.length] = new Option('Stavanger','4');\n"; break; case "dk": echo "obj.options[obj.options.length] = new Option('Aalborg','11');\n"; echo "obj.options[obj.options.length] = new Option('Copenhagen','12');\n"; echo "obj.options[obj.options.length] = new Option('Odense','13');\n"; break; case "us": echo "obj.options[obj.options.length] = new Option('Atlanta','21');\n"; echo "obj.options[obj.options.length] = new Option('Chicago','22');\n"; echo "obj.options[obj.options.length] = new Option('Denver','23');\n"; echo "obj.options[obj.options.length] = new Option('Los Angeles','24');\n"; echo "obj.options[obj.options.length] = new Option('New York','25');\n"; echo "obj.options[obj.options.length] = new Option('San Fransisco','26');\n"; echo "obj.options[obj.options.length] = new Option('Seattle','27');\n"; break; } } ?> Hi All, I am using a loop slider to scroll 4 pages. When I am on any page and click through the product on that. I go to the product but when I click the back button, it goes to the start of the slider rather then the page where I left it. How to go back in loop slider from a back button to the page where we left the scroller. Instead of going to the start of the scroller. It is annoying to go back again to start of the page and scroll all pages. Any help, Highly appreciated. Regards, Meenakshi. The question is on iframes/bookmarkablity and back button functionality. This issue I am facing is how to create iframes with bookmarkable url's without loosing the back button functionality.Lets say all the pages are in the same domain and the child pages inform parent of the child page load for updating the window.location.hash property to modify the current browser address bar. The updation of the url works fine on IE/FF/webkit. But the back button works as expected in IE-8 but the browser back-button does not work in FF/webkit (just the url changes the previous page is not loaded). If we don't update the window.location.hash property the back button works but the window url is not meaningful. Is there a way to get this functionality accross browsers, or is there an easier better way to do it (any other js libs). All pages are served from the same server to get around the permission issue. Gmail and other sites looks like they does something like this. I am trying to write script that allows a user to select a new page using a select menu. But if a user changes mind and clicks Back button. i want a use to see again "Select a New Page" as a first option in the select menu. instead i see the page that was chosen before. in firefox, even when i click Refresh button, the select menu does not go back to its initial format. I tried to use the principle that each time window is loaded, the selected Index would be 0. it is not working. Could anyone give me a hint on how to fix this problem? my script is below. <html> <head> <title>Jump Menu 2</title> <script type="text/javascript"> function new_page() { var selectmenu=document.getElementById("states_form").states_select; selectmenu.onchange=function new_state() { var i=selectmenu.selectedIndex; var state=selectmenu.options[i].value; var new_page="http://www.50states.com/"+state+".htm"; location.href=new_page; window.onload=function select_reload() { i=0; } } } window.onload=new_page; </script> </head> <body> <form id="states_form"> <select name="states_select"> <option value="0"> -- Select a New State--</option> <option value="nebraska"> Nebraska</option> <option value="texas"> Texas</option> <option value="florida">Florida </option> <option value="oregon"> Oregon</option> <option value="wisconsi"> Wisconsin</option> </select> </form> </body> </html> It's a well documented issue- when you have a page that contains an iframe, and then navigate inside the iframe, hitting the browsers back button will only affect the contents of the iframe and not the entire page. I've been searching all over for solutions and cant find one that works for my current implementation. Anyone have any suggestions? Here is my code: js Code: function ShowPage(frame) { frames[0].location = frame+'.html' frame.contentWindow.location.replace(newUrl); } Buttons that change the contents of the iframe Code: <div id="thumb1"><a onmouseover="ShowPage('frame1')"onclick="ShowPage('frame1')" rel="nofollow" target="mainbox"></a></div> <div id="thumb2"><a onmouseover="ShowPage('frame2')"onclick="ShowPage('frame2')" rel="nofollow" target="mainbox"></a></div> <div id="thumb3"><a onmouseover="ShowPage('frame3')"onclick="ShowPage('frame3')" rel="nofollow" target="mainbox"></a></div> and then the iframe itself Code: <iframe src="frame1.html" type="text/html" style="border-width:0; border-style:hidden;" transparency="true" name="mainbox" frameborder="0" scrolling="no" width="700" height="807"> </iframe> |