javascript - jQuery UI の「読み込み中...」エラー処理

Question

ユーザー管理用のデータを表示するために jQuery Grid を使用しています。「+」記号をクリックすると、ポップアップするダイアログ ボックスが表示され、そこで新しいユーザーを作成できます。サーバー側の呼び出しを使用してカスケード リストを設定します。

リクエストを送信すると、失敗した場合でも、成功した場合でも、[読み込み中...] ボタンが消えないようです。一部のリソースを開いたままにしておくか、さらに悪いことをしているのではないかと心配しています。私はこのアプリケーションを継承していて、jQuery の経験がまったくないので、あなたが私を助けてくれることを望んでいました. これが本当に単純なものである場合は、事前にお詫び申し上げます。しかし、この問題を解決するのに役立つ情報が Web 上に見つかりませんでした。

jQuery とともに Struts 2 を使用しています。ただし、jQuery Struts 2 プラグインは使用していないと思います。前もって感謝します。

コードは次のとおりです。

<%@ include file="/WEB-INF/jsp/fragments/directive.jsp" %>  

<s:if test="hasActionErrors()">
<div class="error">
    <s:actionerror/>
</div>
</s:if>
<s:form action="userAdminCreateSubmit" namespace="/ti/tmsportal/ga" onsubmit="return false;" >
<s:textfield key="user.username" required="true" />
<s:textfield key="user.firstName" required="true" />
<s:textfield key="user.middleInitial" />
<s:textfield key="user.lastName" required="true" />
<s:textfield key="user.email" required="true" />
<s:textfield key="user.phone" required="true" />            
<s:select key="user.organizationId" list="organizations" listKey="value" listValue="label" required="true" onchange="changeWorkgroups(this.value);changeRoles(this.value);" />
<s:select key="user.workgroupId" list="workgroups" listKey="value" listValue="label" onchange="changeLocations(this.value);" />
<s:select key="user.locationId" list="locations" listKey="value" listValue="label" />
<s:select key="user.portalRole" list="roles" listKey="value" listValue="label" emptyOption="true" required="true" onchange="changeLevels(this.value);" />
<s:select key="user.levelCode" list="levels" listKey="value" listValue="label" emptyOption="true" required="true" />

</s:form>   

<s:url action="lookup" var="workgroupLookupUrl" >
<s:param name="type">workgroupsInOrganization</s:param>
</s:url>

<s:url action="lookup" var="locationLookupUrl" >
<s:param name="type">locationsInWorkgroup</s:param>
</s:url>

<s:url action="lookup" var="roleLookupUrl" >
<s:param name="type">rolesForOrg</s:param>
</s:url>

<s:url action="lookup" var="levelLookupUrl" >
<s:param name="type">levelsForRole</s:param>
</s:url>


<script>
function changeWorkgroups(key)
{
    $('#userAdminCreateSubmit [name="user.workgroupId"]').load('<s:property value="#workgroupLookupUrl" />&key=' + key + ' option',
        function(responseText, textStatus, XMLHttpRequest) {
            changeLocations();
            setVisibility();
        }
    );      
}

function changeLocations(key)
{
    $('#userAdminCreateSubmit [name="user.locationId"]').load('<s:property value="#locationLookupUrl" />&key=' + key + ' option',
        function(responseText, textStatus, XMLHttpRequest) {
            setVisibility();
        }
    );
}

function changeRoles(key)
{
    $('#userAdminCreateSubmit [name="user.portalRole"]').load('<s:property value="#roleLookupUrl" />&key=' + key + ' option',
        function(responseText, textStatus, XMLHttpRequest) {
            changeLevels($('#userAdminCreateSubmit [name="user.portalRole"]').value());
        });
}

function changeLevels(key)
{
    $('#userAdminCreateSubmit [name="user.levelCode"]').load('<s:property value="#levelLookupUrl" />&key=' + key + ' option');
}   

function setVisibility()
{
    $('#userAdminCreateSubmit [name="user.workgroupId"]').parents('tr').toggle(
        $('#userAdminCreateSubmit [name="user.workgroupId"] option[value!=""]').size() > 0
    );

    $('#userAdminCreateSubmit [name="user.locationId"]').parents('tr').toggle(
        $('#userAdminCreateSubmit [name="user.locationId"] option[value!=""]').size() > 0
    );
}

$(function()
{
    $('.button').button();
    setVisibility();
    addFieldHint('user.receiveNotifications', '<s:text name="content.help.receiveNotifications" />');       
    addFieldHint('user.username', '<s:text name="content.help.username" />');
});

function submitUserAdminCreate()
{
    $.post('<s:url action="userAdminCreateSubmit" namespace="/ti/tmsportal/ga" />', $('#userAdminCreateSubmit').serialize(),
        function(data) {
            $('#userAdminDialog').empty().append(data);
        }
    );
}
</script>