We Keep Coding

Wicket : How to refresh/redraw a wizard onSubmit?

I have a Wizard(org.apache.wicket.extensions.wizard.Wizard) that has an AjaxButton as its Next Button.
I am performing a long running operation on onSubmit() method of next button.
Before exiting from the method I am using ajaxTarget.appendJavascript(js) where ajaxTarget is AjaxRequestTarget and js is a JavaScript snippet that I want to be evaluated.
Now, as far as I know, this script won't get executed until `onSubmit()´ has returned and the response is send back to the browser.
How can I execute my JavaScript immediately without waiting for onSubmit to have finished?
Note: I am using Wicket-4

this script won't get executed until the wizard is redrawn/refreshed.
All appended JavaScript snippets are executed once the AjaxRequest has finished - the wizard itself does not need to be updated.
If you're executing a long running task from your Ajax request, the browser's Ajax request will eventually run into a timeout.
You should move your long running task onto a separate thread.

What happens if an alert window is shown during an ajax call?

I was just wondering what could happen if, while an ajax call is being executed, an alert is prompted to the user, in the browser window.
Let's say, for example, that I have an ajax call
$.ajax({
url: ...,
type: GET/POST,
...
success: function(data){
console.log(data);
},
error: ...
});
that takes long time to complete (10 sec). While the call is executed, a simple javascript alert is thrown
alert("hello!");
What happens for example if:
ajax call starts
ajax call fetching data
alert is shown
ajax call returns data (alert window is still open!)
Knowing that JS is single threaded I know that the script execution will halt, I was just wondering what happens to the ajax call/response if the alert window is not closed "in time".
I hope I was clear enough and that this is not a "dummy" question. Thank you

This isn't exactly hard to try and see... but the answer is that the alert will take priority and hold up the flow of execution.
Upon closing the alert, and assuming the AJAX request has completed while the alert was open, then the success function will be processed (or error function).
Note that the AJAX request will continue to run while the alert is shown (so a long running AJAX can process while the alert is open), but it is just that your script cannot continue handling the request until the alert is closed.
Here is a working example, notice that the data isn't written to the console until the alert is closed.
Another point to be aware of is that after the alert closes, the script will continue with the rest of the function (the code immediate after the alert) before the AJAX response is handled. This helps demonstrate what I mean

The HTTP request will continue to run and be processed in the background.
When the JS event loop becomes free, the readystatechange handler will fire.
Some intermediate ready states may be skipped because the event loop was busy while that state was true.

Browser refresh sends the last $http call made

AngularJS 1.2.13
var httpdelete = $http.delete("/api/categories/" + id);
httpdelete.success(function(data){
alert("Success");
});
httpdelete.error(function(data, status, header, config){
alert("Error!");
});
I do an asynchronous $http.delete request
The success callback function is executed and the alert box "success" appears.
I hit the browser refresh button
The $http.delete line is not executed (debugged with break points). Instead the error callback function is immedialy executed. The alert box "error" appears. No request made it to the server after clicking on the browser's refresh button
I was expecting the entire page to reload when I hit the browser's refresh button.
Instead, AngularJS seems to attempt to resend my last delete query without having to execute $http.delete and goes straight to the error callback.
How can I restore the natural behaviour of the browser's refresh button? I want it to reload the entire page and not attempt to resend the last asynchronous http request.

Open the network tab of the chrome dev tools. Load your page and hit F5. If you don't see a get to your index.html (or whatever your base url is), it's because angular handled it. If you do see the get, the you have rebooted the app for real.
Once you know which one it is, you can investigate further. Setting a breakpoint in the httpdelete callback and inspecting the callstack might also help.

Okay so here is what happened, my backend Nodejs+Express+MongoDB delete action was not returning anything to the client (browser). I didn't think it was necessary to return any information after deleting the document from mongodb.
The side effect of that is as I described in the original post. After deleting the document on the server, if a user refreshes the page using the browser refresh button then the page is not refreshed. Instead the $http.delete request is resent to the server and on top of it the error callback is executed.
After modifying my server side action and make it return a json document such as { success: true, message: "" } after a delete request, the browser's refresh button behaves as it should have which is to reload the entire single application page index.html.

how to check if AJAX request has been completed?

I need to add a sibling to certain HTML elements in the Vaadin application. I don't want to do this on the server side, because it's far too complicated in my case.
I wrote a javascript, that does the magic and it is executed after the page loads the first time. But then, when I click a certain button, some of the elements are loaded from backend using AJAX by Vaadin.
I subscribe for this button "click" event in the javascript. In the listener function I want to wait until Vaadin completes the request and makes the changes in the DOM. Then, I would run my function again.
Question is - how to detect when Vaadin completes its request? Setting timeout is not an answer for me.

Most AJAX library/routine provides you a callback when the AJAX is done. So basically you can set a flag before you start AJAX callback, and then call that flag when your callback is called. At other places you can then check that flag to see if your AJAX call has come back yet.
Some other AJAX library already does that for you and has something like "isInProgress()" that you can simply check anytime to see if it is has come back yet.

Timing Issue with AJAX,ASHX, and webform

I have an ASP.NET application and I think I am running into a timing issue. I have a control on a webform that will call some Javascript on the OnClientClick and also call code behind via server-side onClick.
I click the button (a print button in my instance) and I call Javascript prompt to enter a reason for the print. I enter whatever and then in the JS I call an ashx (handler) page via AJAX passing the results of the prompt.
The handler then places the Text from the prompt into a session variable. Once the JS is done the OnClick code behind is called calling a method that will grab the reason from the session variable (after the ashx has written it) and log the info and print.
What I am seeing is the very first time I do this I get an error my reason not found (ie. session variable is null). It works every time after that. So, what I believe is happening is the first time the ASHX page is being called, it is being compiled/loaded and not adding info to the session fast enough.
My question is there a clean way to slow down my print function and give the JS call time to complete?

I would remove the serverside onClick and have the onClientClick function post the user's input to where your serverside onClick was going before. Removing the ashx step completely.
If you need the ashx step then I would post the user to the next step in the onComplete event of the ashx ajax call. This will ensure that everything fires in the correct order.