disable command button during ajax

[tszpinda]

Hi, I must disable submit button while using converter with ajax.

Can anyone please tell me why this doesn't work, why button isn't disabled after onblur event occur:

<h:inputText id="qtyBox"       
    value="#{cart.stockQuantity}" 
    required="true">
    <f:converter converterId="quantityConverter"/>
    <f:validator validatorId="quantityValidator"/>
    <a4j:support event="onblur" 
     ajaxSingle="true" 
     reRender="qtyBox" 
     bypassUpdates="false" 
     eventsQueue="validation"
        onsubmit="document.getElementById('mainForm:addButtonId').disable=true;"     
     />
  </h:inputText>

  <h:commandButton id="addButtonId"
     action="#{cart.addLine(stockHome.instance)}" 
     value="#{messages['stock.page.button.add']}"
     onclick="Richfaces.showModalPanel('mainForm:orderProgressId');">                         
   </h:commandButton>

Thanks in advance,
Tomek

[gjeudy]

I think you have it mostly right, have you checked the resulting HTML page? JSF appends numeric ids to the id provided in your JSF xhtml therefore

document.getElementById('mainForm:addButtonId')

will never return anything.

See this post it outlines possible solutions to tackle this problem:

http://www.seamframework.org/Community/JavascriptProblemRetrievingElement

[david.spark]

I not that you have specified the attribute disable, I think it should be disabled.

[tszpinda]

I'm gonna kill myself!

Thanks mate!

[gjeudy]

so

document.getElementById('mainForm:addButtonId')

works fine in your case Tomek ?

[tszpinda]

yes it does, I think if I set the 'static' id for the element as I did for the button it works fine,

Here is generated html:

<input id="mainForm:qtyBox" type="text" name="mainForm:qtyBox" value="0" class="quantity_box" 
       onblur="document.getElementById('mainForm:addButtonId').disabled=true;
      A4J.AJAX.Submit('_viewRoot','mainForm',event,{'oncomplete':function(request,event,data){document.getElementById('mainForm:addButtonId').disabled=false;},
      'parameters':{'mainForm:j_id108':'mainForm:j_id108'} ,
      'eventsQueue':'validation','actionUrl':'/webshop/stock.seam?javax.portlet.faces.DirectLink=true'} )" size="5" />

<input id="mainForm:addButtonId" 
       type="image" 
       src="/webshop/img/Add.png" 
       name="mainForm:addButtonId" 
       class="button, icon_button" />

Thank you,