I have a page where I some jQuery code for. After it has finished it goes to the next page.
I use this to go to the next page:
$("body").load(//url,function(){
//do your work
});
The pages loads correctly into the old page. With chrome I can see the new DOM.
The function is exactly the same for both pages
$('button').each(function() {
//start working
}
Only at the second or even third page it keeps working in the old DOM.
The first and second page are almost exactly the samen just other data they both exists from tables.
As an example I have a table in every page with a random number of rows but I only need the rows where there is a button in, there are no other buttons on the page so I for each button.
When i execute the code everything on the first page goes like it should but at the second page it uses the data from the first page again, so not the new data I loaded.
If I take out the load and paste the code in console in chrome then there are no problems and everything works like it should. This is no problem if there are only 2 or three pages but if the page count gets bigger it will be a problem..
Related
Introduction
I have a webpage with X elements. The webpage is built from a Javascript script. Each element changes the page to another page (although the entire website is a single page application)
For instance, if I have a page with 5 buttons and each button takes you to another 'page,' but a still single page application, and that other 'page' has a couple of buttons and sliders on that page itself
Question
Is there a way to automatically, check every element on my page (click every button and make sure every button does something) - and then if possible - check that every redirected action from the button, each button takes page to another part of the page, has a page where every button on that page works?
is there a way to have a python script that, using selenium, will check and make sure that all the elements on the page, and every page each element goes to, is working? Maybe a DFS/BFS or something?
I've been having this strange problem from the beginning of the project until now. When clicking through pages, it seems as though the new (or 'next') page loads the view before the DOM is cleared. So it sometimes stacks elements from the next page under the old page, then after a slight delay the old page gets cleared.
For example, the first screenshot is the login page:
And the second screenshot is if you click to 'sign up'.
To clarify, this happens when loading pages too. For example I have links in a nav bar:
ONE
TWO
And clicking through those pages I see stacked dom elements. Is it cause of this "#" situation?
I'm using http://instantclick.io which is a jQuery plugin for pjax, however I'm getting some strange problems with my scripts. I've moved bits around so that scripts which did run on $(document).ready(function(){ now run on InstantClick.on('change', function(){ but I still get random problems when I browse through my website.
I was starting to get a feeling that the code is being run more than once, for example when I click on a button, the code it should run was happening more than once. So I stuck this piece of code in my js file just to see what was going on:
$(document).click(function(){
console.log('click');
});
So whenever, I click on anything in the page, I'll get a console log. On initial load of a page, I get the console log once per click. Then when I navigate to a different page, I get two console logs per click, then three logs on the third page I visit etc. So it seems that the InstantClick is caching the js file and running the scripts every time a page is loaded.
I tried putting the data-no-instant attribute on the script tag where the js file is included, but this breaks my code completely.
Hope someone can help!
I have a php function that, after it did his computations, contains this code:
echo("<script> window.location.replace('index.php#login'); </script>");
meant to redirect the page to another, under certain circumstances. The function works, the javascript code works, but if fails in one case. If i write manually the address of the page the javascript part of the code seems not to be executed, while if i manually reload the page (for example using the reload button in firefox) works like a charm.
The php function is being executed, with his redirect code, at the beginning of the page index.php in the head section. The page index php is a jquery mobile page, that include every other page of the site, so if i want to call a page, i have to write an address like site.com/index.php#nameOfThePage. The problem happen when i am, for example on a page site.com/index.php#Page1 and i call another Page manually deleting from the address the part "Page1" and writing, for instance, "Page2". Instead, if i reload, the script is being correctly executed.
So the question is: when does a javascript function is being executed in a jquery mobile page? What i have to do to make the function works in every way, even manually, a page is called?
EDIT: the problem happens in firefox e safari, while with chrome the code works in every case...
Firefox 13.0.1 with Firebug 1.9.2.
I load a page with Firebug activated. I select the Script tab. This page loaded multiple script files, and the script tab shows the first one on the list (which happens to be JQuery). So far, so good. I go to the menu with all the scripts, and I select the one I want to look at. It shows this script for about half a second, then switches back to JQuery.
This happens every time, but only on the page that I'm working on right now, and only with one particular script file. There aren't any error messages.
Anybody have any ideas?
Update: The problem appears tied to one line in the script file.
$(document).ready(function() {
// ...
// If I remove this, the problem goes away:
setInterval("foo()", 1000)
})