Drupal view sing a different template on every page load - view

I have a view
It used to be called 'page_1'
It is now called 'c_page'
I have created a template called 
'node--view--branch-list--c-page.html' to render this view
This worked perfectly for many weeks. Until now
Sometimes when i load a page created by this view it is very very glitched.
And sometimes when i load a page created by this view it is fine.
After much investigating i discovered that this is happening because the template suggestions are different on each page load
sometimes the first two template suggestions are
   * node--view--branch-list--page-1.html.twig
   x node--view--branch-list.html.twig
and sometimes they are
   * node--view--branch-list--c-page.html.twig
   x node--view--branch-list.html.twig
If 'node--view--branch-list--c-page.html' is in the list it works fine
If 'node--view--branch-list--page-1.html.twig' is in the list it uses 'node--view--branch-list.html.twig' because ' node--view--branch-list--page-1.html.twig' does not exist/
Sometimes the exact same page (the view generates many pages) is fine sometimes it isnt.
This happens on multiple different servers.
Clearing the drupal cache makes no difference
Turning the view cache off makes no difference.
What could be causing this

I guess, probably there is a preprocess_node or theme_suggestions function that generates the theme suggestion.
Please check your .theme file inside of your theme folder.

Related

Previously working (in 1.4.7) Apache Wicket 6 DataView not updating when data source SortableDataProvider is updated from a ModalWindow

As the title says, I am trying to update a web app to a more recent Apache Wicket version. The problem is very like this one here, albeit the link is very old (and an ancient version of Wicket, which is not what I'm using)
http://users.wicket.apache.narkive.com/tG6XOAUM/refresh-page-after-form-submit-within-modalwindow
So what I do is:
- display a DataView in a regular page, populated using a SortableDataProvider
- create a panel inside a ModalWindow to make some data changes;
- on onSubmit (using an AjaxFallbackButton) inside this panel, insert a new item into the same SortableDataProvider which I use to populate my DataView
- I then call "target.add(wmc)" on the WebMarkupContainer surrounding my DataView
- my DataView.populateItem registers the change when I add trace code, but the change is not actually displayed ie the screen is apparently not being refreshed.
If I do the same thing from an AjaxFallbackButton.onSubmit() NOT inside a ModalWindow, but in the same WebPage as my DataView, then all is well and I see the change on the page immediately.
I started to upgrade to Wicket 8 but there is so much else to change that I'd rather not do this right now.
I can post code if needs be but I wondered if anyone had come across this problem. As I say, fine in Wicket 1.4.7. Next step would be to create a mini-app to demonstrate this, I guess, which might well lead me to a solution anyway but hoping for some good input from that Wicket community out there ;-)
You're holding a reference from one page to another:
public class TestBugInsertItemPage extends WebPage {
private TestBugPage parent;
This not allowed in Wicket, and I wonder how this has worked in 1.4.
Your trying to update components from another window, that cannot work:
#Override
protected void onSubmit(AjaxRequestTarget target, Form<?> form) {
TestBugInsertItemPage.this.parent.dp.addLine();
target.add(TestBugInsertItemPage.this.parent.wmc);
TestBugInsertItemPage.this.parent.modal.close(target);
}
An AjaxRequestTarget is valid for a single request for a single page only.
You should use a ModelWindow with a panel instead.
Update for your second example:
Passing a panel to a different page won't make a difference. Wicket serializes pages to disk, thus you cannot share any state between them.
You should use a modal dialog with a panel instead:
TestBugPage.this.modal.setContent(TestBugPage.this.myPanel);
Now TestBugPage and your panel reside in the same component hierarchy, they communicate with each other and both can be updated on the same Ajax request.

browser stuck on ajax request

i developed a simple web site which uses ajax to load content and while the content is loading, i'm displaying a progress. Everything works as expected on 1st ajax call but after that, it becomes a mess
page gets stuck on ajax call
i've written a function to listen to ajax call and show loading message, it doesn't work too and the page becomes very laggy and slow after the 1st ajax call.
Here is my ajax function.
function loadPage(path) {
$.ajax({
type: "POST",
context: document.body,
dataType: "html",
timeout: 10000,
url: path
});}
i tried to async to true but its true by default. still it didn't help. a demo of the problem can be seen at : REMOVED SINCE PROBLEM SOLVED
This works perfectly fine on the localhost but as soon as i uploaded it to my remote server,problems started to occur. can an expert please be kind point out what have i done wrong ? i tried removing all little the animations from this, non helped.
the problem was me loading javascript files on each ajax cal causing too many get and post requests and unnecessary dom changes.
your page seems to be slow with every click, because you are constantly loading JavaScript files on every click instead of just loaded the JavaScript once when the page loads, since you are grabbing the whole HTML page
like for instance.. every time you click on HOME .. these files are loaded in the page again..
POST http://3rsmj.com/new/home.html
GET http://3rsmj.com/new/js/liquid/jquery.easing.1.3.js?_=1382114556389
GET http://3rsmj.com/new/js/liquid/jquery.touchSwipe.min.js?_=1382114556390
GET http://3rsmj.com/new/js/liquid/jquery.liquid-slider-custom.min.js?_=1382114556391
if using AJAX its best to just load the content in or in fragments so not having to load all the scripts on every menu click .. or load the data and populate the data in the content
have you tried looking into the jQuery load() method for loading in HTML fragments so to not have to load in the whole HTML DOM again
http://api.jquery.com/load/
like this:
$("#load_area").load("portfolio_item.html #ID_of_content_to_grab");
the above would go to portfolio_item.html and grab the html fragment from the id #ID_of_content_to_grab and insert it into #load_area
UPDATE:
you can also try to empty the #load_area before you insert new content
$("#load_area").html("");
$("#load_area").load("portfolio_item.html #ID_of_content_to_grab");
or you can use jquery empty() .. or test both out
..

chrome-app won't recognize id's that work fine when run by the chrome browser

I'm converting a standard browser based app that's working fine to a chrome-app.
Once the page loads up, it has already hit an error - Uncaught TypeError: Cannot call method 'appendChild' of null. This occurs after several hundred lines of JS have done their job but its the first time the code makes a reference to the document object, specifically document.getElementById('mainDiv').appendChild(...).
I can clearly see the div with the id="mainDiv" in the debuggers elements tab. Yet, document.getElementById('mainDiv') must be returning a null. Any attempt at putting in breakpoints fails as they are ignored. I've added them to the line that fails as well as to lines that lead up to it and breakpoints are never triggered. I've read some of the threads on SO and I'm certain the breakpoints issue is just a bug in the debugger, but not recognizing an id when I can clearly see it and the code when run in the browser works fine leaves me wondering what's going on. Is document in the browser different from document in the app version?
Any ideas?
If I choose "inspect background page", the breakpoints work but it still fails but in a different way. The elements tab does NOT show my html page, but the pseudo generated background one and I can't get the debugger to show my page at all.
Any enlightenment would be appreciated. I've searched and read what I could find, but much of the docs are clearly out of date.
You seem to be accessing the document object of the background page, instead of that of your POS.html file.
Try this:
chrome.app.window.create('POS.html',{
'bounds': {
'width': screen.availWidth,
'height': screen.availHeight
}
}, function(appWin) {
var pageWindow = appWin.contentWindow;
var pageDocument = pageWindow.document;
pageWindow.addEventListener('load',function() {
// now use
pageDocument.getElementById('yourid');
// instead of
document.getElementById('yourid');
},false);
});
Also to inspect elements in your page right-click anywhere in the app window and select Inspect Element (this works only when the app was loaded as an 'unpacked extension')
Alternatively you can navigate to chrome://extensions and click the page link next to your app entry.
As lostsource mentioned, you're probably accessing the wrong DOM's document. You should think about the javascript in your app running in different global contexts, one for each page. There is (at a minimum) a page for the background page, and a page for each window.
Each of these pages runs in its own global context. This means global variables like document and window are different.
In the background page will be scripts which you load via the background manifest tag. When you open a window, it can also load its own script via script tags (make sure you do not use inline or block script tags, but use script src="foo.js". See http://developer.chrome.com/apps/contentSecurityPolicy.html).
The code that runs in the callback to chrome.app.window.create runs in the background page's context, so its document variable is for the background page's DOM, which is usually empty. Instead you can make it refer to the window's DOM using win.contentWindow as lostsource suggested, or add a page.js file with the script in it, and include it from the page via a script src='page.js' tag.
Is your call occurring after the load event, e.g. the JS called in a function set on window.onload?

Can I delay loading of some controls on an xPage to after page loaded

is it possible to delay loading of some controls on an xpage?
This is the problem: let's say you have a control that does a fultextsearch and displays the result in a repeat control. this ft search might take a long time and will hold the webpage loading in a waiting state until the search result is ready.
I want my page to load most of the data initally, and some "time consuming" controls should be loaded in to the page as a sperate request after the inital load.
this way the user will immediatly see the webpage, but some of the data on the page will load a little bit later without holding the webpage in a waiting state from the server.
possible?
The downside to using rendered is that all the value bindings will still evaluate, even if the corresponding markup isn't sent to the page. So the trick here is making sure the components don't even exist until you want them to.
Every component has a getChildren() method. This returns a mutable List of components, which has a add() method. This allows you to add components to the page on the fly, either while the page is loading, or later during an event. For the purposes of what you're trying to do, you would want to defer adding the "expensive" components until a subsequent event.
Create an event handler attached directly to the view root (), give it a unique ID (e.g. "loadExpensiveComponentsEvent", set its refresh mode to partial, set a refresh ID to whatever div or panel will contain the search results, and set its event name to an arbitrary event (e.g. "loadExpensiveComponents"). This prevents your event from being triggered by actual user behavior. Set the event's code to SSJS that will inject your components.
Then add a script block () to trigger the event after the page has loaded:
XSP.addOnLoad(function(){
XSP.firePartial(null, "#{id:loadExpensiveComponentsEvent}");
});
Your page will load without the search result components. Once the page has fully loaded, it will trigger the component injection event automatically.
For guidance on how to code the injection event, open the Java file that has been generated from your existing page to see what components need to be injected and what to set their values to.
You can pack them into a panel and set their rendered status to rendered=#{viewScope.pageFullyLoaded}. Then in the onLoad event have a XSP. partialRefresh request where you set viewScope.pageFullyLoaded=true
A little ugly but doable. Now you can wrap that code into your own custom control, so you could have a "lazyGrid", "lazyPanel" etc.
Not sure why I did not think of this before. the dynamic content control in extlib actually solves this problem. the dcc can be triggered onClientLoad both using javascript and ssjs afer the page has loaded.
one problem I am facing now is that I am already using the dcc on my site so I need to put another dcc within my dcc. and this seem to be a bit buggy. I have reported it to the extlib team on openNTF.

onLoad or similar for Ajax?

Good day,
I was wondering if there is a way to make Ajax move on to the next code segment only when all the elements included in the server-side code page are fully loaded. When the retrieved data is text-only there’s no problem, but sometimes there are photos included.
This is part of the code I have been using:
xajx.onreadystatechange = function(){
if(xajx.readyState==4){
document.all.div1.innerHTML = xajx.responseText;
document.all.div1.style.display = “”;
}
}
The thing is that when the response is retrieved (readyState set to 4) and div1 is displayed, the Photo has not been completely loaded yet, so actually the user can see the process of the picture slowly appearing, as he would in any other “normal” case. What I want to do is making div1 available for display only once all the components are fully loaded while meanwhile the system does its stuff in the background. Before Ajax I used hidden iframes like everybody, so I could enclose an onload event handler within the iframe tag (or in an external script), so div1 would appear only after the iframe has fully loaded, photos included.
Any idea?
You can use the 'onload' event on images themselves. You'll need to work out how to attach that event when you are downloading the code dynamically as in your case.

Resources