How to show popup while uploading file using inputfile adf

Question

I am working with adf in jdeveloper. I have an af:inputfile which use valuechangelistener to check the file type and then upload to server.

I need to show popup (with loading image) while these processes happen.

I already tried the code below but the popup always shows after the process has finished and it won't hide:

This is inputfile code:

<af:inputFile label="Invoice Document" id="if1" 
                    valueChangeListener="#{invoiceBatchManagedBean.onAddInvoiceDocument}"
                    showRequired="true" required="true" immediate="false"  autoSubmit="true"
                    readOnly="#{pageFlowScope.uploadPageStateViewBean.inReadOnlyState}" />

This is the popup code:

<f:view>
<af:document id="d1" title="#{ipmPortalResource['supplierInvoice.title']}">
  <af:resource type="javascript" source="../../../../js/pop-up.js"/>
  <af:form id="f1" usesUpload="true">
       <af:popup id="p1" contentDelivery="immediate" clientComponent="true" binding="#{pageFlowScope.InvoiceBatchManagedBean.myGlassPane}">
    <af:dialog id="d2" type="none" title="" closeIconVisible="false"> 
      <af:panelGroupLayout id="pgl1" layout="vertical">
        <af:image source="../../../../images/loading0.png" inlineStyle="width:130px;height:45px;border:none;" id="i3"/>
        <af:image source="../../../../images/loading1.gif" id="i2" inlineStyle="margin-left:42.5px;margin-right:auto;margin-bottom:15px;width:50px;height:50px;border:none;"/>
        <af:outputText value="please wait ..." id="ot11z"/> 
      </af:panelGroupLayout> 
    </af:dialog>
  </af:popup>
....

This is the javascript code:

function enforcePreventUserInput(evt){ 
    var popup = AdfPage.PAGE.findComponentByAbsoluteId('p1');
    if (popup != null){ 
      AdfPage.PAGE.addBusyStateListener(popup,handleBusyState); 
      evt.preventUserInput(); 
    } 
  } 
  //JavaScript call back handler 
  function handleBusyState(evt){ 
    var popup = AdfPage.PAGE.findComponentByAbsoluteId('p1'); 
    if(popup!=null){ 
      if (evt.isBusy()){ 
        popup.show(); 
      } else if (popup.isPopupVisible()) { 
        popup.hide(); 
        AdfPage.PAGE.removeBusyStateListener(popup, handleBusyState); 
      } 
    } 
  }

This is the function called by inputfile's valuechangelistener in managedbean:

    public void onAddInvoiceDocument(ValueChangeEvent valueChangeEvent) {

this.showPopup(getMyGlassPane());
    try{
        UploadedFile file = (UploadedFile) valueChangeEvent.getNewValue();
        this.onAddDocument(file, INVOICE_DOCUMENT_TYPE,true);
    }catch(Exception ex){
        RichInputFile comp = (RichInputFile) valueChangeEvent.getComponent();
        comp.setValid(false);
        comp.setValue(null);
        JSFUtils.addFacesErrorMessage(ex.getMessage());
    }
    this.hidePopup(getMyGlassPane());
}

    public void showPopup(RichPopup popup) {
    FacesContext fct = FacesContext.getCurrentInstance();
    ExtendedRenderKitService service = Service.getRenderKitService(fct, ExtendedRenderKitService.class);
    service.addScript(fct,"AdfPage.PAGE.findComponent('p1').show();");

}
//method to hide the glass pane component
public void hidePopup(RichPopup popup) {
    FacesContext fct = FacesContext.getCurrentInstance();
    ExtendedRenderKitService service = Service.getRenderKitService(fct,ExtendedRenderKitService.class);
    service.addScript(fct, "AdfPage.PAGE.findComponent('p1').hide();");
}

Can someone please help?

possible duplicate of [JavaScript: detect uploading form image finished](http://stackoverflow.com/questions/16412930/javascript-detect-uploading-form-image-finished) — Liam, Apr 25 '14 at 08:16

score -1 · Answer 1 · answered Apr 25 '14 at 09:42

-1

You made a long explanation and I could not detect what is your real problem. However I think what you want to achieve is explained here:

http://www.oracle.com/technetwork/developer-tools/adf/learnmore/27-long-running-queries-169166.pdf

http://tamanmohamed.blogspot.com/2012/06/adf-how-to-use-afpopup-during-long.html

answered Apr 25 '14 at 09:42

Noah Martin

1,708
9
35
73

The links you gave are worked for inputfile with commandbutton to upload. My inputfile doesn't need a commandbutton to upload since it upload file using valuechangelistener (means it uploads directly after you browse for a file). So what I want to achieve is showing the popup while the uploading process happens but without commandbutton. – Irene Apr 25 '14 at 09:48
1

I putted the links just as a help, if you want to achieve something different you should do some workarounds. This forum is about helping each other as much as anyone can but not doing the others work. For your case, you may fire a client event from your bean or just add a small button, or make the button clicked (programmatically) when the listener detects something etc etc. The answer to "How to show popup while uploading file using inputfile adf" is in those links. – Noah Martin Apr 25 '14 at 10:08
Well the thing is I shouldn't add any button. I already tried some examples and also from your links and they didn't work out. But anyway thanks. – Irene May 07 '14 at 02:43

How to show popup while uploading file using inputfile adf

1 Answers1