Forum Stats

  • 3,817,445 Users
  • 2,259,334 Discussions
  • 7,893,775 Comments

Discussions

Image field cannot refresh when navigate records in jsf page

BAO.SZ
BAO.SZ Member Posts: 422
edited Sep 14, 2014 6:01AM in JDeveloper and ADF

In jdev 12.1.2,

I have a formlayout in a jsf page, there is a af:image which bind to a url of picture file, the source code is like this:

("#{bindings.Headpicurl.inputValue}" )

                <f:facet name="tab3"> 
                    <af:panelFormLayout id="pfl1">
                        <af:inputText value="#{bindings.Id.inputValue}" label="#{bindings.Id.hints.label}"
                                      required="#{bindings.Id.hints.mandatory}" readOnly="true"
                                      columns="#{bindings.Id.hints.displayWidth}"
                                      maximumLength="#{bindings.Id.hints.precision}"
                                      shortDesc="#{bindings.Id.hints.tooltip}" id="it1">
                            <f:validator binding="#{bindings.Id.validator}"/>
                        </af:inputText>
                        <af:image shortDesc="#{bindings.Headpicurl.hints.tooltip}" id="it4"
                                  source="#{bindings.Headpicurl.inputValue}"/>
                        <f:facet name="footer">
                            <af:panelGroupLayout layout="horizontal" id="pgl1">
                                <af:button actionListener="#{bindings.First.execute}" text="First"
                                           disabled="#{!bindings.First.enabled}" partialSubmit="true" id="b1"/>
                                <af:button actionListener="#{bindings.Previous.execute}" text="Previous"
                                           disabled="#{!bindings.Previous.enabled}" partialSubmit="true" id="b2"/>
                                <af:button actionListener="#{bindings.Next.execute}" text="Next"
                                           disabled="#{!bindings.Next.enabled}" partialSubmit="true" id="b3"/>
                                <af:button actionListener="#{bindings.Last.execute}" text="Last"
                                           disabled="#{!bindings.Last.enabled}" partialSubmit="true" id="b4"/>
                            </af:panelGroupLayout>
                        </f:facet>
                    </af:panelFormLayout>
                </f:facet>

But, when I navigate records in the page, other fields will refresh correctly, except the image field--the image field displaying will not refresh.

Can anyone give some help?

Thanks.

Best Answer

  • kdario
    kdario Member Posts: 3,522 Silver Crown
    Answer ✓
    so I set PartialTriggers property of this image tag to the Navigation buttons. and update records to set null values of Headpicurl to some valid value.
    then, the page will be refreshed correctly for all fields including the image field when do the record navigation.
    
    But, after I cleared the PartialTriggers property of this image tag, and reload the page or even restart the jdev, It still works OK now!
    ---So, Is the setting of this PartialTriggers property  the real cause of  the previous issue of no refreshing for image field?
    

    Well, you also updated your null values to real URLs so maybe that was issue(in combination with browser caching)?

    General approach to prevent web resource caching is to append random string to resource url(like Cvele's suggestion) or you can write custom servlet which will act as proxy and add http headers(no-cache, no-store,must-revalidate, expires, ...) to prevent caching.

    Anyway, now I have get rid of the above issue. however a new issue related emerges:
    When I update and commit records attributes in the database. the fields in the jsf page will not display newly changed records from database even if I refreshed the browser or press F5,
    Only after I open the jsf page in a new browser window, the changes of database will be displayed.
    -- Is this caused by browser caching? and how to fix it?
    

    How you exactly "update and commit" records (in the same app or from some other app/session)?

    If you do this from different app or session then you must execute VO query again.

    Dario

    BAO.SZ
«1

Answers

  • Cvele_new_account
    Cvele_new_account Member Posts: 4,810 Bronze Crown

    What is the actual value of #{bindings.Headpicurl.inputValue} ? What commes from database

  • kdario
    kdario Member Posts: 3,522 Silver Crown

    This is probably some issue with caching in the browser.

    You can try to refresh af:image (with partialTrigger or programmatically) when you navigate between records.

    Dario

  • BAO.SZ
    BAO.SZ Member Posts: 422

    #{bindings.Headpicurl.inputValue}  comes from database to store url of the image.

    Thanks.

  • Cvele_new_account
    Cvele_new_account Member Posts: 4,810 Bronze Crown

    I know, but asked WHAT commes from database..is this regular image URL?

    If yes, then what youu can do, is to add another, dummy parameter, in order to disable browser image caching

      <af:image ... source="#{bindings.Headpicurl.inputValue}?dummy=#{generate_current_time_in_millisecond_somehow}"/>

    regarding #{generate_current_time_in_millisecond_somehow}, you can use backing bean method, in order to get current time in millisecond ...

    This will prevent browser image caching...

    :

    BAO.SZ
  • Cvele_new_account
    Cvele_new_account Member Posts: 4,810 Bronze Crown

    Apologize, the dummy value probably shuld be without #, so, correct value is:

    <af:image ... source="#{bindings.Headpicurl.inputValue}?dummy={generate_current_time_in_millisecond_somehow}"/>

  • kdario
    kdario Member Posts: 3,522 Silver Crown
    Apologize, the dummy value probably shuld be without #, so, correct value is:
    
    <af:image ... source="#{bindings.Headpicurl.inputValue}?dummy={generate_current_time_in_millisecond_somehow}"/>
    

    Actually, your first example is probably correct because {something} is not valid EL

    Dario

  • Cvele_new_account
    Cvele_new_account Member Posts: 4,810 Bronze Crown

    Hell, I am never sure what should to be, with or without ;-)

  • BAO.SZ
    BAO.SZ Member Posts: 422

    Thank you kdario and Cvele for your kind suggestions.

    ( I cannot login the OTN yesterday, I got error 500, or just a white blank page most of the time when I tried to login yesterday. )


    Back to this thread's topic, the issues of my adf application is this:

    1. I have a form layout component based on a BC data control, fields in the server side data base table were all text type,

        and I convert one of it (that is Hearpicurl field , which store url for pictures )into image type in this jsf page,

        and set the Source property of this image tag as the string from this field :#{bindings.Headpicurl.inputValue}

    2.So, data records fetched from database to display in jsf page will be like:

      id , Headpicurl

       1,  'http://www.**/image1.jpg'

       2,  null

       ....

    3. At the beginning, there are 5 records but with only one of them have a valid Headpicurl value, other records will have null value for this field.

    4.Then when I navigate through these records in the page, other fields will be refreshed accordingly. but the image field didn't fresh.

    After I read kdario's post,I think he is right that browser caching may be the cause,

    so I set PartialTriggers property of this image tag to the Navigation buttons. and update records to set null values of Headpicurl to some valid value.

    then, the page will be refreshed correctly for all fields including the image field when do the record navigation.

    But, after I cleared the PartialTriggers property of this image tag, and reload the page or even restart the jdev, It still works OK now!

    ---So, Is the setting of this PartialTriggers property  the real cause of  the previous issue of no refreshing for image field?

    Anyway, now I have get rid of the above issue. however a new issue related emerges:

    When I update and commit records attributes in the database. the fields in the jsf page will not display newly changed records from database even if I refreshed the browser or press F5,

    Only after I open the jsf page in a new browser window, the changes of database will be displayed.

    -- Is this caused by browser caching? and how to fix it?

    Thank you again.

  • kdario
    kdario Member Posts: 3,522 Silver Crown
    Answer ✓
    so I set PartialTriggers property of this image tag to the Navigation buttons. and update records to set null values of Headpicurl to some valid value.
    then, the page will be refreshed correctly for all fields including the image field when do the record navigation.
    
    But, after I cleared the PartialTriggers property of this image tag, and reload the page or even restart the jdev, It still works OK now!
    ---So, Is the setting of this PartialTriggers property  the real cause of  the previous issue of no refreshing for image field?
    

    Well, you also updated your null values to real URLs so maybe that was issue(in combination with browser caching)?

    General approach to prevent web resource caching is to append random string to resource url(like Cvele's suggestion) or you can write custom servlet which will act as proxy and add http headers(no-cache, no-store,must-revalidate, expires, ...) to prevent caching.

    Anyway, now I have get rid of the above issue. however a new issue related emerges:
    When I update and commit records attributes in the database. the fields in the jsf page will not display newly changed records from database even if I refreshed the browser or press F5,
    Only after I open the jsf page in a new browser window, the changes of database will be displayed.
    -- Is this caused by browser caching? and how to fix it?
    

    How you exactly "update and commit" records (in the same app or from some other app/session)?

    If you do this from different app or session then you must execute VO query again.

    Dario

    BAO.SZ
  • Cvele_new_account
    Cvele_new_account Member Posts: 4,810 Bronze Crown

    For new issue, please let conclude this thread, by making some answer as helpfull/correct, and open new one for new problem...

This discussion has been closed.