With <rich:tabPanel>, some times on tab change, two ajax requests are being sent to server instead of one - jsf-2

I have an application running in production. Some times when clicked on tab to switch, observed that instead of 1 ajax request, 2 ajax requests are being fired.
1) First ajax went through the JSF life cycle and loaded the data by calling the itemChangeListener method(dataBean.tabChangeListener) for tab and rendered in browser.
2) Second ajax request fired internally from browser without any user action. Observed that in this second request also, jsf life cycle executed successfully. But here tab change listener method not executed.
It looks like strange behavior. Why its firing 2 ajax requests instead of one ?. We have used jstl,facelets tags as well in the code.
Thanks in advance for any help.
I have tired by enabling the <a4j:log/> in the jsf file to check the ajax events logs.
Even checked in the browser network tab by filtering the xhr(ajax) request types.
<rich:tabPanel switchType="ajax" id="tabPanel"
itemChangeListener="#{dataBean.tabChangeListener}" >
Expected is only one ajax request should be fired on click of tab change.
but actually here its firing 2 ajax requests.

Related

How to stop rails processing when ajax has been aborted at front end?

We have a search bar and pagination on the page, using jquery to make ajax request
As one start searching for particular record many ajax request is being fired , though we added ajax abort to the previous request but in rails query is still happening for all,
How to stop the rails processing when previous ajax request is aborted
If the Rails server has received the AJAX request, .abort will not stop the server from executing it. This stackoverflow answer describes how you could use readyState to check if the last request was completed or not.
However, I believe what you're looking for is a debounce function. A debounce function limits the rate at which a function gets fired. You could use that to make sure that the search bar fires a backend request only after certain seconds have passed since it last received an input. That would greatly reduce the number of queries that get sent to the Rails server.

"ajax:complete" not firing on Heroku

I'm using featherlight to pop up a form generated by an ajax call to my Rails server. The form submits data with remote => true and the server responds with json. In my javascript I have
$(document).on('ajax:complete', handleAjaxComplete)
When the form gets submitted I close the form's featherlight box and open a new one with a spinner and wait until ajax:complete fires.
The weird thing is that in my local dev environment it fires and I can handle the response. On heroku it doesn't (even though the json gets sent through with status 200 and looking good.
My only theory was that it was because I was closing the featherlight box but then it shouldn't work on my local machine either right? Why would I receive a response and yet not have handleAjaxComplete called - there are no errors in the console (in fact I even get an "XHR finished loading: POST <url>" log)?
The problem is discussed here https://github.com/rails/jquery-ujs/issues/223
It boils down to the fact that my form is in a lightbox. The lightbox fades out when you submit the form. On my local machine webrick responded fast enough for the form to still trigger ajax:complete while it was fading out. On heroku, however, the form had been removed from the DOM by the time $.ajax received a response so nothing happened. I could have resolved this by using jquery's own:
$.ajaxComplete()
(Or binding to that event) but I ended up just leaving the form open with a modal spinner above it until there was a response from the server.

Why would my MC3 Web application be making two gets with just the one action method?

When I check with fiddler I can see the following. That appear immediately after each other.
GET /C01C/Page1?_=1346588295451 HTTP/1.1
GET /C01C/Page1?_=1346588295613 HTTP/1.1
When I step through with the debug it only stops once at the breakpoint in my razor page.
Yet I see two requests and there are numbers after the URL. Does anyone have any clues. I can see this in fiddler and also in network tab of the IE debug panel.
I realize now that I was using an Ajax get and I had set up a ().on event. There were two of these events hanging off the same ID so it got called twice.

How can I display a "waiting" indicator on a web page whilst the http request is being fulfilled by the webserver?

Background - I have a web application for which a request takes several seconds.
Question - How could I display a "waiting" type indicator (e.g. spinner) to the user after they initiate the request, until the actual HTTP request response comes back from the server?
Notes - I'm assuming this to be a generic web development question, however my web application is a "Ruby on Rails" application.
thanks
Typically, you'd add a new DOM object (or show an existing one) to the page, potentially via jQuery or some other library, that displays the spinner, and then in whatever callback is fired when the AJAX request completes; you'd have hide the spinner object again.
The previous posters are correct, you can show an animation, but this isn't ideal for all cases. If you just want to change the cursor, in javascript, you can do this at the start of the request:
document.body.style.cursor = "wait";
and after the request completes:
document.body.style.cursor = "default";
hope that helps...
scott.
First of all, you have a hidden div along with spinner image, when you send the http request, make the div visible and when you receive the response, make it hidden again.

Is there a way to trigger a server event with jQuery or ASP.NET MVC?

I have this situation: I have a page where I have a list of events of a day. And these events can be changed theirs status to 'Confirmed' or 'Cancelled'.
But, when I, for instance, click on 'Confirmed', this status is saved on SQL Server and this status is shown 'Confirmed'. But, if another person has this same page opened at the time I changed the event status, this person WILL NOT see the new status. He only will see if reloads the page.
I know that there is a Ajax set TimeOut that refreshes page after every 5... 10... 15 seconds. But I was thinking if there's a jQuery or ASP.NET MVC trigger that when I change the event status, the server responds with a browser refresh.
Is there any solution for that??
Thanks!!
Option 1: Use jQuery Timer and update your control on page every X seconds. (You don't have to reload the whole page, just states of your controls with confirmed/cancelled statuses, and change them only if server has returned new values).
Option 2: You can tigger an event on page from your server by using Silverlight 2+.
Hint: When you update control's state (confirmed/cancelled) pass initial state as well. Thus if one user has updated status from confirmed to cancelled, another user who will try update this status from confirm to cancelled will recieve a friendly error message.
In short: no.
The server does not remember where it sent pages to. Once the server sends a page to the browser, it ends the connection. Due to this, the server would have no idea where to send refresh instructions or a new page. To do "real time" updates on a web page, the browser needs to initiate the call.
You can use asynchronous handlers in ASP .NET to implement that. Which means, you can subscribe to an update event on the server, and the server holds the request (which does not consume any worker threads in the meantime), and when the status is updated the request is ended and the response with the new status is sent to the client.

Resources