This discussion is archived
5 Replies Latest reply: Nov 15, 2012 5:27 AM by AnthonyRayner RSS

Display Label of Radio options in Mobile Template(Theme50) on APEX 4.2.

Phil in Sydney Newbie
Currently Being Moderated
Hi Guys,

I am using Apex 4.2+db11g. In a new mobile template application.
I am working on a page for data entry. There is a radio option inside.

Weekday: (radio option) Saturday
(radio option) Sunday

As I create it, the label Weekday is not displayed, I can only see Saturday and Sunday.
Even I add style equals "display:inline" or "display:block", it is still not showing.

Do you guys met this issue before?

Could you please give me any hints on it?

Thanks.

Phil

Edited by: Phil in Sydney on Nov 14, 2012 2:40 PM
  • 1. Re: Display Label of Radio options in Mobile Template(Theme50) on APEX 4.2.
    evrm Pro
    Currently Being Moderated
    Hi Phil,

    what label template do you use?
    Could it be that you selected "No label" as template?

    regards,
    Erik-jan
  • 2. Re: Display Label of Radio options in Mobile Template(Theme50) on APEX 4.2.
    AnthonyRayner Pro
    Currently Being Moderated
    Hi Phil,

    Thanks for your post. This is a known bug #14767963 and can be worked around by adding the following CSS to the 'Page' page template in the jQuery Mobile Smartphone theme > Cascading Style Sheet > Inline attribute:
    .ui-controlgroup-label {  
      visibility: visible; 
    }
    I will also follow up with our product manager and request this to be added to our [url http://www.oracle.com/technetwork/developer-tools/apex/application-express/apex-42-known-issues-1863578.html]Known Issues page, sorry it wasn't there already.

    Regards,
    Anthony.

    Edited by: Anthony Rayner on Nov 14, 2012 12:56 PM
  • 3. Re: Display Label of Radio options in Mobile Template(Theme50) on APEX 4.2.
    Phil in Sydney Newbie
    Currently Being Moderated
    Thanks Anthony.

    I pasted your code in the section you mentioned.
    The label is stil not showing.

    I pasted the source code as following. You will see I have two parts.
    The first part is a display-only field, the second one is the radio group.
    In my web page, I can see the first part correctly, but I cannot see the
    lable of the second part. You can see the label of WEEKDAY is there.
    I doubt that hideMeButHearMe might cause the trouble.
    <div data-role="fieldcontain">
      <label for="P7_SITE">Site Name:      </label>
      <span id="P7_SITE" class="display_only" readonly="readonly" >XEROX</span>
    </div>
    
    <div data-role="fieldcontain">
      <label for="P7_WD">Weekday</label>
      <input type="hidden" name="p_arg_names" value="2966016211153052" />
      <fieldset tabindex="-1" data-role="controlgroup" data-type="horizontal" id="P7_WD" class="radio_group"  >
        <legend class="hideMeButHearMe">Weekday</legend>
        <input type="radio" id="P7_WD_0" name="p_t02" value="SAT" checked="checked" ><label for="P7_WD_0" >SAT</label>
        <input type="radio" id="P7_WD_1" name="p_t02" value="SUN"  ><label for="P7_WD_1" >SUN</label>
      </fieldset>
    </div>  
    Regards,

    Phil
  • 4. Re: Display Label of Radio options in Mobile Template(Theme50) on APEX 4.2.
    Phil in Sydney Newbie
    Currently Being Moderated
    Hi Anthony,

    I find the solution, but get the hint from your code.
    I put
    <span style="visibility:visible'>Weekday</span>
    in Edit Page Item->Label.

    *Please replace the last single-quote as double-quote in above code.(I cannot make it display properly without '.).*

    Now I can see the label of Radio Group. :-)

    I still appreciate your help Anthony!!

    Regards,
    Phil
  • 5. Re: Display Label of Radio options in Mobile Template(Theme50) on APEX 4.2.
    AnthonyRayner Pro
    Currently Being Moderated
    Hi Phil,

    It's interesting that this didn't work for you. I created a [url http://apex.oracle.com/pls/apex/f?p=24163:1]simple example on apex.oracle.com, and was able to fix this by adding the proposed CSS page temlate. Are you able to put an example up on apex.oracle.com where you can reproduce the proposed fix not working? I would appreciate it, if we can try and pin down exactly why this wasn't working for you (and possibly others).

    Also, the code you pasted looks to be taken from the static Page Source for the page. It's worth noting, jQuery Mobile (which is the library we use to power our mobile support) does a great deal of enhancement on the served HTML after is has loaded, so a more accurate way to examine what's going on on the page (not that we want you to have to do that!), would be to use a browser HTML inspector (as included with Firefox with the Firebug add-on, Chrome with it's native developer tools, etc.).

    Regards,
    Anthony

Legend

  • Correct Answers - 10 points
  • Helpful Answers - 5 points