JSF 2.2/Spring Custom Viewscope stops working

I have recently upgraded a JSF 1.2 and RF 3.3.3 Spring web application to JSF 2.2 and RF 4.5.7 and one of the changes was to use ajax to render records from a datatable, as well as introduce a custom view scope to allow multiple tabs for each record/link chosen from the datatable.

Each record in the datatable is visible via a link which is view scoped. This allows multiple browser tabs. Each record link view/page also has tabs which displays the message in various formats (ASCII, XML, JSON etc).

Once deployed, this seems to work fine for a while. After some time, things start to misbehave and I am struggling to see what is causing it. The symptoms are as follows:

• The search button remains disabled and records are not returned unless I refresh the page - this button is disabled during the ajax call and when working fine it re-enables after the datatable has returned results (or not) )
• The tabs on each record page work on one click and after that it gets stuck and the tabs stop working

Search button code:

<h:commandButton value="Search" style="margin-right: 2%;" eventsQueue="searchFormQueue">
    <f:ajax render="search-res-form" execute="@form" listener="#{searchBean.execute()}" onevent="handleDisableButton"/>
</h:commandButton>

Tab code on datatable record:

<h:form id="display-controls" styleClass="nav">
    <ul>
        <li class="#{messageDetailDisplayBean.viewType == 'ASCII' ? 'selected' : ''}">
            <a4j:commandLink value="ASCII" action="#{messageDetailDisplayBean.updateViewType}" render="display-controls" execute="@form">
                <a4j:param name="viewType" value="ASCII"/>
            </a4j:commandLink>
                </li>
        <li class="#{messageDetailDisplayBean.viewType == 'XML' ? 'selected' : ''}">
            <a4j:commandLink value="&lt;XML&gt;" action="#{messageDetailDisplayBean.updateViewType}" render="display-controls" execute="@form">
                <a4j:param name="viewType" value="XML"/>
            </a4j:commandLink>
                </li>
        <li class="#{messageDetailDisplayBean.viewType == 'JSON' ? 'selected' : ''}">
            <a4j:commandLink value="{JSON}" action="#{messageDetailDisplayBean.updateViewType}" render="display-controls" execute="@form">
                <a4j:param name="viewType" value="JSON"/>
            </a4j:commandLink>
        </li>
        <li class="#{messageDetailDisplayBean.viewType == 'EBCDIC' ? 'selected' : ''}">
            <a4j:commandLink value="EBCDIC" action="#{messageDetailDisplayBean.updateViewType}" render="display-controls" execute="@form">
                <a4j:param name="viewType" value="EBCDIC"/>
            </a4j:commandLink>
        </li>
        <li class="#{messageDetailDisplayBean.viewType == 'ESC' ? 'selected' : ''}">
            <a4j:commandLink value="Escaped" action="#{messageDetailDisplayBean.updateViewType}" render="display-controls" execute="@form">
                <a4j:param name="viewType" value="ESC"/>
            </a4j:commandLink>
        </li>
        <li class="#{messageDetailDisplayBean.viewType == 'VAR' ? 'selected' : ''}">
            <a4j:commandLink value="Variables" action="#{messageDetailDisplayBean.updateViewType}" render="display-controls" execute="@form">
                <a4j:param name="viewType" value="VAR"/>
            </a4j:commandLink>
        </li>
        <h:panelGroup rendered="#{messageDetailDisplayBean.hasCopyBooks}">
            <li class="#{messageDetailDisplayBean.viewType == 'CBL' ? 'selected' : ''}">
                <div>
                    <h:selectOneMenu id="copyBooks" value="#{messageDetailDisplayBean.copybookID}">
                        <f:selectItems value="#{messageDetailDisplayBean.copybooks}"/>
                        <a4j:ajax event="change" listener="#{messageDetailDisplayBean.copybookChanged}" render="message-cont-res"/>
                    </h:selectOneMenu>
                </div>
            </li>
        </h:panelGroup>
    </ul>
</h:form>

Disable/enable button JS: (from BallusC)

function handleDisableButton(data) {
        var buttonElement = data.source; // The HTML DOM element which invoked the ajax event.
            var ajaxStatus = data.status; // Can be "begin", "complete" and "success".

            switch (ajaxStatus) {
                case "begin": // This is called right before ajax request is been sent.
                    buttonElement.disabled = true;                      
                    break;

                case "complete": // This is called right after ajax response is received.
                    // We don't want to enable it yet here, right?
                    break;

                case "success": // This is called when ajax response is successfully processed.
                    buttonElement.disabled = false;
                    break;
        }
}   

The only way to fix the above issues is to restart the tomcat 8 service. After a while the symptoms above re-appear.

This is quite distressing as we cannot upgrade the application due to this issue. I'm not sure if the issue is related to ajax, view scope, or something I have missed when implementing the Spring custom view scope that is causing this. Or something totally different.

The other thing possibly worth noting my application now has Beans in either view, request or session scope (previously they were mostly session scoped). Not sure if issue is related to a bug involving the session and view scoped beans.

Any guidance on what the root cause could be would be really appreciated.