Wicket Panel not refreshed when swapped in via an AJAX request - ajax

I have a Panel that I initially replace with another panel (a spinning circle saying "loading") and after a while in an AJAX event replace back. So what I do is:
#Override
protected void onConfigure() {
if (!content.isLoaded()) {
tmp = new LoadingCircle(getId(), "Loading...");
this.replaceWith(tmp);
}
}
public void onLoaded(AjaxRequestTarget target) {
if (tmp != null) {
tmp.replaceWith(this);
tmp = null;
}
target.add(this);
}
This works, so the panel is shown back in the page. However, this panel has some subpanels with some labels and they are not refreshed. I see the updated labels when I reload the page but not immediately after showing the whole panel with AJAX.
I notice that the onConfigure and onBeforeRender methods are called only once - when the panel is created but not again when it is actually shown for the first time using AJAX. The same for the subpanels, so that would explain why they are not refreshed. But the question is - why is the panel not refreshed (the updated model values are not used) when it is added to the AJAX request target?
EDIT: I think this may be relevant: https://issues.apache.org/jira/browse/WICKET-5107. Still, I wonder what I should change in my code to make it work?

IMO it looks like you should use an AjaxCallDecorator instead to do what you are trying to do with the spinner.

Related

How to redirect to another page from within Xamarin Webviews Navigating event

I want to do a very simple thing: if a person goes to a specific page within my webview I want them to be redirected to a different page. I want to do this to prevent an errorpage from showing on session timeout. So this needs to happen from within Xamarin because I have to resend the user credentials.
To do that, I believe I have to catch the Navigating event, check if the webpage corresponds with the page I don't want to see. Cancel the Navigating event and set the browser URL to the page I want to redirect to.
private void Navigating(object sender, WebNavigatingEventArgs e)
{
String url = e.Url;
if (url.Contains("unauthenticated.xhtml"))
{
url = getURL();
e.Cancel = true;
browser.Source = url;
} else
{
e.Cancel = false;
}
LogService.log("navigating to " + url);
}
This doesn't work. I still get to see the ugly unauthenticated.xhtml page and no redirect. If I debug I run through the code correctly so I know the event is always caught well and the check for the website works. If I got to the new url in the browser the correct page is displayed.
Now, if I remove this line
e.Cancel = true;
I get closer to the result I want. Then I do get redirected to unauthenticated.xhtml, but within a second I am redirected again towards the correct page. So the warning flashes on the screen and disappears. (Makes sense: both Navigation events still go through)
I have also tried placing these two lines in this order:
browser.Source = url;
e.Cancel = true;
But the result didn't change.
How can I get a well working redirection from within the program?
Thank you for your help.

p5.js global and instance mode confusion

I have two p5 sketches, and I want to use them in the same space of a website. So that after clicking a button, the sketches switch. So I made three different files. The first two, are the sketches, and they are wrapped in a function (instance mode). The third sketch is a code written in global mode, because It has the information that loads a button right when the website is first accesed, and it has the information containing what the button is supposed to do: call the other sketches.
The code looks like this:
var playing = false;
var button;
function setup() {
var col = color(185,185,185,150);
button = createButton('Play');
button.position(20,20);
button.parent('black');
button.style("background-color", col);
button.style("padding", "10px 20px");
button.style("font-size", "14px");
button.mousePressed(toggleCanvas); // attach button listener
}
function mousePressed() {
}
function toggleCanvas() {
if (playing) {
if(myp5r){
myp5r.remove();
runSketch();
button.html('Stop');
}else{
runSketch();
button.html('Stop');
}
}else {
if(myp5){myp5.remove();
stopSketch();
button.html('Play');
}else{
stopSketch();
button.html('Play');}
}
playing = !playing;
}
I have been warned, to not mix global and instance mode, although my "common sense" says that it is ok to use a global mode for the button. Because I want it to be loading first, along with the page.
I noticed that weird things happen, though. Like, I get a blank space added beneath the footer, it looks horrible. And, even more worse, button is not appearing in the correct spot in the site. I already ckecked that css has position:relative for example. And the design works in localhost, but not in the site.

Back button causes naked partial view

Here's the scenario: I invoke an action method which returns PartialViewresult via ajax. The result is loaded into another view. Then I Navigate to another page and after this if I press browser back button the previously loaded PartialViewResult appears naked. By naked I mean no container view and layout is loaded, just plain html elements are rendered. Like this:
Has anyone faced and tackled this problem?
EDIT: To provide a better understanding of the situation here's my action method:
public ActionResult Inbox(int pageNumber = 1, int pageSize = 10, string filter = null)
{
var inboxItems = GetInboxItems(filter);
PagedList<InboxItem> pagedList = inboxItems.ToPagedList(pageNumber, pageSize);
pagedList.DisplayPage(pageNumber);
InboxViewModel vm = new InboxViewModel(pagedList);
if (!Request.IsAjaxRequest())
return View(vm);
return PartialView(vm);
}
In the Inbox.cshtml file I load layout based on if the request is ajax request:
#model Dokcentra.Models.InboxViewModel
#if (!Request.IsAjaxRequest())
{
Layout = "~/Views/Shared/_Cabinet.cshtml";
}
I think the last piece of code is what causes this problem because the layout file _Cabinet.cshtml has all the html, css and js and when I press browser back button that layout file doesn't load.
After lots of digging and hair pulling I realized that this only happens in Chrome. I found out that I need to provide a different url from the full html document. So when sending a reuest through AJAX to this action method I just append any arbitrary query string value to "?Cabinet/Inbox", like this:
var url= "/Cabinet/Inbox?anythingYouWant"

Back button not updating hash in iframe on IE

I have an application that uses a combination of the onhashchange event (for new browsers) and the hashchange plugin by Ben Alman (for old browsers) to track the history while making ajax calls or actions. Works like a charm in all browsers, back and forward buttons let the user navigate the actions that get recorded by changing the hash. So far so good. Now our page will be hosted in an iframe on a clients page in a diff domain(cross domain). Chrome kind of works but if you put to many changes in the history it stops working at some point (we can live with that). IE dosen't work at all. When I navigate our application by clicking on links and updating the hash new history items get created in the parent page but when I hit the back button the hash in the nested page is not updated therefore the hashchange event never fires. Anyone solved this problem before? Many thanks
Initialize the hash change event handling
if ("onhashchange" in window && !($j.browser.msie && $j.browser.version == '7.0')) {
window.onhashchange = function() {
var params = parseHash(location.hash)
if (params.tabId) {
if (getSelectedTabId() == params.tabId) return;
reloadPage(params.tabId);
}
};
}
else {// Plugin for older browsers
$j(window).bind('hashchange', function() {
var params = parseHash(location.hash)
if (params.tabId) {
if (getSelectedTabId() == params.tabId) return;
reloadPage(params.tabId);
}
});
}

How to test AjaxEventBehavior("onClick") for Apache Wicket radio button?

I'm using apache wicket and I run into trouble regarding testing the AjaxEventBehavior for a Radio button. Actually I want to test the "onClick" event like in my case when I select/click a radio button from a RadioGroup a specif page is rendered.
Code snippet:
RadioGroup<Boolean> selectPageRadioGroup =
new RadioGroup<Boolean>("selectPageRadioGroup", new Model<Boolean>(Boolean.TRUE));
selectPageRadioGroup.setDefaultModel(new Model<Boolean>(Boolean.TRUE));
final Radio<Boolean> radioButton1 =
new Radio<Boolean>("radioButton1", new Model<Boolean>(Boolean.FALSE));
radioButton1.add(new AjaxEventBehavior("onclick") {
#Override
protected void onEvent(AjaxRequestTarget target) {
setResponsePage(MyWebPage.class);
}
});
selectPageRadioGroup.add(radioButton1);
Assuming you have already done
WicketTester tester = new WicketTester();
tester.startPage(PageContainingRadioButton.class);
or a similar startPanel (Wicket 1.4) or startComponent (Wicket 1.5), so that your test has rendered a page containing the button at a known path you should be able to make WicketTester simulate the ajax behavior by something like
tester.executeAjaxEvent("blabla:form:selectPageRadioGroup:radioButton1", "onclick");
(You'll need to adjust that path of course.)
and then check that it did the right thing with
tester.assertRenderedPage(MyWebPage.class);

Resources