We hope you'll join us for our 4/23 webinar on using data tables to apply reference ranges and AE codes in OC4. For more information and to register, visit https://register.gotowebinar.com/register/2882170018956684555

Wikibooks: Styling with jQuery

Hi,
Gerben Rienk and I have created a page on wikibooks that shows you how to style items on an OpenClinica page. You can find it here:
http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingWithJQuery
This wiki provides methods for styling ordinary items, items in a group and items arranged horizontally (with COLUMN_NUMBER in the crf definition sheet).
Also take a look at _this_ page about styling: http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingACRF, which was an inspiration. Unfortunately the example Excel file can not be downloaded from this page anymore. Can someone put it up again?
Enjoy,
Gerben Rienk and Robert
«13

Comments

  • kristiakkristiak Posts: 1,334 ✭✭✭
    Hi Robert And Gerben,
    I have been trying to use your method to improve on the AE page, which is to
    wide. I do not like users to scroll to complete everything: To get a feeling
    for how it works I tries to copy your example to the letter. It failed on
    all accounts but one. All it succeeded to do was to modify the font color in
    the heading of column "small one". Example attached. I have spent all day
    trying to figure out what I wrong but this one beats me. I also attach the
    Excel sheet.
    Regards
    Krister
    -----Original Message-----
    On Behalf Of Robert Meester
    Sent: 27 July 2011 13:45
    To: [email protected]
    Subject: [Users] Wikibooks: Styling with jQuery
    Hi,
    Gerben Rienk and I have created a page on wikibooks that shows you how to
    style items on an OpenClinica page. You can find it here:
    http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingWithJQuery
    This wiki provides methods for styling ordinary items, items in a group and
    items arranged horizontally (with COLUMN_NUMBER in the crf definition
    sheet).
    Also take a look at _this_ page about styling:
    http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingACRF, which was
    an inspiration. Unfortunately the example Excel file can not be downloaded
    from this page anymore. Can someone put it up again?
    Enjoy,
    Gerben Rienk and Robert
  • r.meesterr.meester Posts: 14
    Hi Krister,
    Most of the times when the formatting is not working, it is because a syntax error crashes the javascript. I can't see a problem with the javascript in your excel sheet, I do notice that the span element is not closed. In stead of this: small one
    please try: small one
    It is not strictly necessary to put 'small one' inside the span, but I do think it is cleaner.
    Another thing: the last column (geik of the month) is defined as a 'select' in the javascript (styleGroupColumnN('.colclass3','5','select',{'width':'120px','font-size':'120%','color':'green','background-color':'black'});
    ) but in the OC definition it is a 'text' field.
    I have not tested the above suggestions, maybe later.
    Just for completeness: please be aware that jQuery is used by OC from v3.1, if you are using an older version the styling will not work because jQuery is not included in those versions. I have not tried the styling with v3.1.2, but I expect it should work, until the user interface overhaul in one of the next releases anyway (https://issuetracker.openclinica.com/view.php?id=12251).
    I hope this helps,
    Robert

    Robert Meester
    Clinical Database Developer, AIGHD Foundation
    T +31 (0)20 566 7800
    F +31 (0)20 566 9557
    E [email protected]; www.aighd.org
    On Dec 13, 2011, at 1:01 PM, Krister Kristianson wrote:
    > Hi Robert And Gerben,
    >
    > I have been trying to use your method to improve on the AE page, which is to
    > wide. I do not like users to scroll to complete everything: To get a feeling
    > for how it works I tries to copy your example to the letter. It failed on
    > all accounts but one. All it succeeded to do was to modify the font color in
    > the heading of column "small one". Example attached. I have spent all day
    > trying to figure out what I wrong but this one beats me. I also attach the
    > Excel sheet.
    >
    > Regards
    >
    > Krister
    >
    > -----Original Message-----
    >
    > On Behalf Of Robert Meester
    > Sent: 27 July 2011 13:45
    > To: [email protected]
    > Subject: [Users] Wikibooks: Styling with jQuery
    >
    > Hi,
    >
    > Gerben Rienk and I have created a page on wikibooks that shows you how to
    > style items on an OpenClinica page. You can find it here:
    > http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingWithJQuery
    > This wiki provides methods for styling ordinary items, items in a group and
    > items arranged horizontally (with COLUMN_NUMBER in the crf definition
    > sheet).
    >
    > Also take a look at _this_ page about styling:
    > http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingACRF, which was
    > an inspiration. Unfortunately the example Excel file can not be downloaded
    > from this page anymore. Can someone put it up again?
    >
    > Enjoy,
    > Gerben Rienk and Robert
    >
  • kristiakkristiak Posts: 1,334 ✭✭✭
    Thanks Robert I will test this. I am using 3.1.1 so I should have jQuery already!

    Regards

    Krister

    From: Robert Meester [mailto:[email protected]]
    Sent: 13 December 2011 14:00
    To: Krister Kristianson
    Cc: [email protected]; [email protected]; Gerben Rienk
    Subject: Re: [Users] Wikibooks: Styling with jQuery

    Hi Krister,

    Most of the times when the formatting is not working, it is because a syntax error crashes the javascript. I can't see a problem with the javascript in your excel sheet, I do notice that the span element is not closed. In stead of this: small one
    please try: small one
    It is not strictly necessary to put 'small one' inside the span, but I do think it is cleaner.
    Another thing: the last column (geik of the month) is defined as a 'select' in the javascript (styleGroupColumnN('.colclass3','5','select',{'width':'120px','font-size':'120%','color':'green','background-color':'black'});
    ) but in the OC definition it is a 'text' field.
    I have not tested the above suggestions, maybe later.

    Just for completeness: please be aware that jQuery is used by OC from v3.1, if you are using an older version the styling will not work because jQuery is not included in those versions. I have not tried the styling with v3.1.2, but I expect it should work, until the user interface overhaul in one of the next releases anyway (https://issuetracker.openclinica.com/view.php?id=12251).

    I hope this helps,
    Robert

    Robert Meester
    Clinical Database Developer, AIGHD Foundation
    T +31 (0)20 566 7800
    F +31 (0)20 566 9557
    E [email protected]; www.aighd.org

    On Dec 13, 2011, at 1:01 PM, Krister Kristianson wrote:
    Hi Robert And Gerben,
    I have been trying to use your method to improve on the AE page, which is to
    wide. I do not like users to scroll to complete everything: To get a feeling
    for how it works I tries to copy your example to the letter. It failed on
    all accounts but one. All it succeeded to do was to modify the font color in
    the heading of column "small one". Example attached. I have spent all day
    trying to figure out what I wrong but this one beats me. I also attach the
    Excel sheet.
    Regards
    Krister
    -----Original Message-----
    On Behalf Of Robert Meester
    Sent: 27 July 2011 13:45
    To: [email protected]
    Subject: [Users] Wikibooks: Styling with jQuery
    Hi,
    Gerben Rienk and I have created a page on wikibooks that shows you how to
    style items on an OpenClinica page. You can find it here:
    http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingWithJQuery
    This wiki provides methods for styling ordinary items, items in a group and
    items arranged horizontally (with COLUMN_NUMBER in the crf definition
    sheet).
    Also take a look at _this_ page about styling:
    http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingACRF, which was
    an inspiration. Unfortunately the example Excel file can not be downloaded
    from this page anymore. Can someone put it up again?
    Enjoy,
    Gerben Rienk and Robert
  • kristiakkristiak Posts: 1,334 ✭✭✭
    Hi Robert,

    I have done the modification as you suggested. Nothing happened same results. I have also tried to figure out your code from the jQuery documentation, but that did make me any wiser. Actually I copied the code verbatim from the your WIKI page but that did not help. Any other ideas?

    Regards

    Krister

    From: Robert Meester [mailto:[email protected]]
    Sent: 13 December 2011 14:00
    To: Krister Kristianson
    Cc: [email protected]; [email protected]; Gerben Rienk
    Subject: Re: [Users] Wikibooks: Styling with jQuery

    Hi Krister,

    Most of the times when the formatting is not working, it is because a syntax error crashes the javascript. I can't see a problem with the javascript in your excel sheet, I do notice that the span element is not closed. In stead of this: small one
    please try: small one
    It is not strictly necessary to put 'small one' inside the span, but I do think it is cleaner.
    Another thing: the last column (geik of the month) is defined as a 'select' in the javascript (styleGroupColumnN('.colclass3','5','select',{'width':'120px','font-size':'120%','color':'green','background-color':'black'});
    ) but in the OC definition it is a 'text' field.
    I have not tested the above suggestions, maybe later.

    Just for completeness: please be aware that jQuery is used by OC from v3.1, if you are using an older version the styling will not work because jQuery is not included in those versions. I have not tried the styling with v3.1.2, but I expect it should work, until the user interface overhaul in one of the next releases anyway (https://issuetracker.openclinica.com/view.php?id=12251).

    I hope this helps,
    Robert

    Robert Meester
    Clinical Database Developer, AIGHD Foundation
    T +31 (0)20 566 7800
    F +31 (0)20 566 9557
    E [email protected]; www.aighd.org

    On Dec 13, 2011, at 1:01 PM, Krister Kristianson wrote:
    Hi Robert And Gerben,
    I have been trying to use your method to improve on the AE page, which is to
    wide. I do not like users to scroll to complete everything: To get a feeling
    for how it works I tries to copy your example to the letter. It failed on
    all accounts but one. All it succeeded to do was to modify the font color in
    the heading of column "small one". Example attached. I have spent all day
    trying to figure out what I wrong but this one beats me. I also attach the
    Excel sheet.
    Regards
    Krister
    -----Original Message-----
    On Behalf Of Robert Meester
    Sent: 27 July 2011 13:45
    To: [email protected]
    Subject: [Users] Wikibooks: Styling with jQuery
    Hi,
    Gerben Rienk and I have created a page on wikibooks that shows you how to
    style items on an OpenClinica page. You can find it here:
    http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingWithJQuery
    This wiki provides methods for styling ordinary items, items in a group and
    items arranged horizontally (with COLUMN_NUMBER in the crf definition
    sheet).
    Also take a look at _this_ page about styling:
    http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingACRF, which was
    an inspiration. Unfortunately the example Excel file can not be downloaded
    from this page anymore. Can someone put it up again?
    Enjoy,
    Gerben Rienk and Robert
  • r.meesterr.meester Posts: 14
    Hi Krister,
    Another question: have you saved the form and tried to enter some data? From the wiki:
    Remark: since jQuery is not loaded during CRF preview, you can only see the results in the saved CRF version during data entry/review.
    Best,
    Robert
    On Dec 13, 2011, at 4:06 PM, Krister Kristianson wrote:
    > Hi Robert,
    >
    > I have done the modification as you suggested. Nothing happened same results. I have also tried to figure out your code from the jQuery documentation, but that did make me any wiser. Actually I copied the code verbatim from the your WIKI page but that did not help. Any other ideas?
    >
    > Regards
    >
    > Krister
    >
    > From: Robert Meester [mailto:[email protected]]
    > Sent: 13 December 2011 14:00
    > To: Krister Kristianson
    > Cc: [email protected]; [email protected]; Gerben Rienk
    > Subject: Re: [Users] Wikibooks: Styling with jQuery
    >
    > Hi Krister,
    >
    > Most of the times when the formatting is not working, it is because a syntax error crashes the javascript. I can't see a problem with the javascript in your excel sheet, I do notice that the span element is not closed. In stead of this: small one
    > please try: small one
    > It is not strictly necessary to put 'small one' inside the span, but I do think it is cleaner.
    > Another thing: the last column (geik of the month) is defined as a 'select' in the javascript (styleGroupColumnN('.colclass3','5','select',{'width':'120px','font-size':'120%','color':'green','background-color':'black'});
    > ) but in the OC definition it is a 'text' field.
    > I have not tested the above suggestions, maybe later.
    >
    > Just for completeness: please be aware that jQuery is used by OC from v3.1, if you are using an older version the styling will not work because jQuery is not included in those versions. I have not tried the styling with v3.1.2, but I expect it should work, until the user interface overhaul in one of the next releases anyway (https://issuetracker.openclinica.com/view.php?id=12251).
    >
    > I hope this helps,
    > Robert
    >
    >
    >
    > Robert Meester
    > Clinical Database Developer, AIGHD Foundation
    > T +31 (0)20 566 7800
    > F +31 (0)20 566 9557
    > E [email protected]; www.aighd.org
    >
    > On Dec 13, 2011, at 1:01 PM, Krister Kristianson wrote:
    >
    >
    > Hi Robert And Gerben,
    >
    > I have been trying to use your method to improve on the AE page, which is to
    > wide. I do not like users to scroll to complete everything: To get a feeling
    > for how it works I tries to copy your example to the letter. It failed on
    > all accounts but one. All it succeeded to do was to modify the font color in
    > the heading of column "small one". Example attached. I have spent all day
    > trying to figure out what I wrong but this one beats me. I also attach the
    > Excel sheet.
    >
    > Regards
    >
    > Krister
    >
    > -----Original Message-----
    >
    > On Behalf Of Robert Meester
    > Sent: 27 July 2011 13:45
    > To: [email protected]
    > Subject: [Users] Wikibooks: Styling with jQuery
    >
    > Hi,
    >
    > Gerben Rienk and I have created a page on wikibooks that shows you how to
    > style items on an OpenClinica page. You can find it here:
    > http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingWithJQuery
    > This wiki provides methods for styling ordinary items, items in a group and
    > items arranged horizontally (with COLUMN_NUMBER in the crf definition
    > sheet).
    >
    > Also take a look at _this_ page about styling:
    > http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingACRF, which was
    > an inspiration. Unfortunately the example Excel file can not be downloaded
    > from this page anymore. Can someone put it up again?
    >
    > Enjoy,
    > Gerben Rienk and Robert
    >
  • kristiakkristiak Posts: 1,334 ✭✭✭
    Indeed I have, the only thing that was visible was white fonts in the second of the 5 columns!! So obviously something must have worked!

    Regards

    Krister



    From: Robert Meester [mailto:[email protected]]
    Sent: 13 December 2011 16:27
    To: Krister Kristianson
    Cc: Robert Meester; [email protected]; [email protected]; Gerben Rienk
    Subject: Re: [Users] Wikibooks: Styling with jQuery

    Hi Krister,

    Another question: have you saved the form and tried to enter some data? From the wiki:
    Remark: since jQuery is not loaded during CRF preview, you can only see the results in the saved CRF version during data entry/review.
    Best,
    Robert

    On Dec 13, 2011, at 4:06 PM, Krister Kristianson wrote:
    Hi Robert,

    I have done the modification as you suggested. Nothing happened same results. I have also tried to figure out your code from the jQuery documentation, but that did make me any wiser. Actually I copied the code verbatim from the your WIKI page but that did not help. Any other ideas?

    Regards

    Krister

    From: Robert Meester [mailto:[email protected]]
    Sent: 13 December 2011 14:00
    To: Krister Kristianson
    Cc: [email protected]; [email protected]; Gerben Rienk
    Subject: Re: [Users] Wikibooks: Styling with jQuery

    Hi Krister,

    Most of the times when the formatting is not working, it is because a syntax error crashes the javascript. I can't see a problem with the javascript in your excel sheet, I do notice that the span element is not closed. In stead of this: small one
    please try: small one
    It is not strictly necessary to put 'small one' inside the span, but I do think it is cleaner.
    Another thing: the last column (geik of the month) is defined as a 'select' in the javascript (styleGroupColumnN('.colclass3','5','select',{'width':'120px','font-size':'120%','color':'green','background-color':'black'});
    ) but in the OC definition it is a 'text' field.
    I have not tested the above suggestions, maybe later.

    Just for completeness: please be aware that jQuery is used by OC from v3.1, if you are using an older version the styling will not work because jQuery is not included in those versions. I have not tried the styling with v3.1.2, but I expect it should work, until the user interface overhaul in one of the next releases anyway (https://issuetracker.openclinica.com/view.php?id=12251).

    I hope this helps,
    Robert


    Robert Meester
    Clinical Database Developer, AIGHD Foundation
    T +31 (0)20 566 7800
    F +31 (0)20 566 9557
    E [email protected]; www.aighd.org

    On Dec 13, 2011, at 1:01 PM, Krister Kristianson wrote:
    Hi Robert And Gerben,
    I have been trying to use your method to improve on the AE page, which is to
    wide. I do not like users to scroll to complete everything: To get a feeling
    for how it works I tries to copy your example to the letter. It failed on
    all accounts but one. All it succeeded to do was to modify the font color in
    the heading of column "small one". Example attached. I have spent all day
    trying to figure out what I wrong but this one beats me. I also attach the
    Excel sheet.
    Regards
    Krister
    -----Original Message-----
    On Behalf Of Robert Meester
    Sent: 27 July 2011 13:45
    To: [email protected]
    Subject: [Users] Wikibooks: Styling with jQuery
    Hi,
    Gerben Rienk and I have created a page on wikibooks that shows you how to
    style items on an OpenClinica page. You can find it here:
    http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingWithJQuery
    This wiki provides methods for styling ordinary items, items in a group and
    items arranged horizontally (with COLUMN_NUMBER in the crf definition
    sheet).
    Also take a look at _this_ page about styling:
    http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingACRF, which was
    an inspiration. Unfortunately the example Excel file can not be downloaded
    from this page anymore. Can someone put it up again?
    Enjoy,
    Gerben Rienk and Robert
  • r.meesterr.meester Posts: 14
    Hi Krister,
    I am afraid the structure of the generated html has changed. We are not using 3.1 yet, because of export problems in that version. When I tried to upload your excel file I stumbled upon a the item 'GROUP_LAYOUT' that is not available in 3.0.4.1. I am suspecting that this option changes the page structure and renders the items unfindable for the jQuery script. At this moment I do not have an 3.1 installation. Can you send me the source of the generated html file? I'll have a look at it.
    The idea of the script is that we provide a hook (the classname) in the html DOM as a starting point for the jQuery styling function. This function traverses the DOM under the assumption that the page is always structured the same. This is not very robust, hence my enhancement request (https://issuetracker.openclinica.com/view.php?id=10431)
    regards,
    Robert
    Robert Meester
    Clinical Database Developer, AIGHD Foundation
    T +31 (0)20 566 7800
    F +31 (0)20 566 9557
    E [email protected]; www.aighd.org
    On Dec 13, 2011, at 4:53 PM, Krister Kristianson wrote:
    > Indeed I have, the only thing that was visible was white fonts in the second of the 5 columns!! So obviously something must have worked!
    >
    > Regards
    >
    > Krister
    >
    >
    >
    > From: Robert Meester [mailto:[email protected]]
    > Sent: 13 December 2011 16:27
    > To: Krister Kristianson
    > Cc: Robert Meester; [email protected]; [email protected]; Gerben Rienk
    > Subject: Re: [Users] Wikibooks: Styling with jQuery
    >
    > Hi Krister,
    >
    > Another question: have you saved the form and tried to enter some data? From the wiki:
    > Remark: since jQuery is not loaded during CRF preview, you can only see the results in the saved CRF version during data entry/review.
    > Best,
    > Robert
    >
    > On Dec 13, 2011, at 4:06 PM, Krister Kristianson wrote:
    >
    >
    > Hi Robert,
    >
    > I have done the modification as you suggested. Nothing happened same results. I have also tried to figure out your code from the jQuery documentation, but that did make me any wiser. Actually I copied the code verbatim from the your WIKI page but that did not help. Any other ideas?
    >
    > Regards
    >
    > Krister
    >
    > From: Robert Meester [mailto:[email protected]]
    > Sent: 13 December 2011 14:00
    > To: Krister Kristianson
    > Cc: [email protected]; [email protected]; Gerben Rienk
    > Subject: Re: [Users] Wikibooks: Styling with jQuery
    >
    > Hi Krister,
    >
    > Most of the times when the formatting is not working, it is because a syntax error crashes the javascript. I can't see a problem with the javascript in your excel sheet, I do notice that the span element is not closed. In stead of this: small one
    > please try: small one
    > It is not strictly necessary to put 'small one' inside the span, but I do think it is cleaner.
    > Another thing: the last column (geik of the month) is defined as a 'select' in the javascript (styleGroupColumnN('.colclass3','5','select',{'width':'120px','font-size':'120%','color':'green','background-color':'black'});
    > ) but in the OC definition it is a 'text' field.
    > I have not tested the above suggestions, maybe later.
    >
    > Just for completeness: please be aware that jQuery is used by OC from v3.1, if you are using an older version the styling will not work because jQuery is not included in those versions. I have not tried the styling with v3.1.2, but I expect it should work, until the user interface overhaul in one of the next releases anyway (https://issuetracker.openclinica.com/view.php?id=12251).
    >
    > I hope this helps,
    > Robert
    >
    >
    >
    > Robert Meester
    > Clinical Database Developer, AIGHD Foundation
    > T +31 (0)20 566 7800
    > F +31 (0)20 566 9557
    > E [email protected]; www.aighd.org
    >
    > On Dec 13, 2011, at 1:01 PM, Krister Kristianson wrote:
    >
    >
    >
    > Hi Robert And Gerben,
    >
    > I have been trying to use your method to improve on the AE page, which is to
    > wide. I do not like users to scroll to complete everything: To get a feeling
    > for how it works I tries to copy your example to the letter. It failed on
    > all accounts but one. All it succeeded to do was to modify the font color in
    > the heading of column "small one". Example attached. I have spent all day
    > trying to figure out what I wrong but this one beats me. I also attach the
    > Excel sheet.
    >
    > Regards
    >
    > Krister
    >
    > -----Original Message-----
    >
    > On Behalf Of Robert Meester
    > Sent: 27 July 2011 13:45
    > To: [email protected]
    > Subject: [Users] Wikibooks: Styling with jQuery
    >
    > Hi,
    >
    > Gerben Rienk and I have created a page on wikibooks that shows you how to
    > style items on an OpenClinica page. You can find it here:
    > http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingWithJQuery
    > This wiki provides methods for styling ordinary items, items in a group and
    > items arranged horizontally (with COLUMN_NUMBER in the crf definition
    > sheet).
    >
    > Also take a look at _this_ page about styling:
    > http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingACRF, which was
    > an inspiration. Unfortunately the example Excel file can not be downloaded
    > from this page anymore. Can someone put it up again?
    >
    > Enjoy,
    > Gerben Rienk and Robert
    >
  • kristiakkristiak Posts: 1,334 ✭✭✭
    PS I'm using 3.1.1
    Regards
    Krister
    -----Original Message-----
    From: Krister Kristianson [mailto:[email protected]]
    Sent: 13 December 2011 19:36
    To: 'Gerben Rienk'; 'Robert Meester'
    Cc: '[email protected]'
    Subject: RE: [Users] Wikibooks: Styling with jQuery
    Hi Gerben and Robert,
    This is really getting spooky. I have tested on a different computer with
    Maximum memory pool = 1280 and MaxPermSize=180m. I have tried exactly the
    same file that I sent to you with the same results as earlier.
    The system is IBM with a 3Gghz DualCore processor and 2 Gb RAM running
    Widows 7 Professional.
    I'm at loss and hope that you Gurus can come up with something. I attach the
    OpenClinica LOG file
    Regards
    Krister
    -----Original Message-----
    From: Gerben Rienk [mailto:[email protected]]
    Sent: 13 December 2011 17:39
    To: Robert Meester; Krister Kristianson
    Cc: [email protected]
    Subject: Re: [Users] Wikibooks: Styling with jQuery
    Hi Krister and Robert,
    I uploaded Krister's XL to my 3.1.1. test environment and it's OK (see
    screenshot).
    I checked at the time of writing of the wiki-page the script against a 3.1
    installation and that also worked fine.
    >From the look of Krister's screenshot I would say there's definitely
    something wrong, for example the Save / Cancel buttons are not visible
    anymore ;-) This could point to something quite different, such as a
    memory-problem.
    I've seen examples where a page would not load completely, unless PermGen
    was set. Now this would also explain why the styling script is not run,
    because the "document" is never "ready".
    So my 2 questions would be:
    - anything funny in the logs? and
    - what's the size of PermGen?
    Kind regards,
    Gerben Rienk
    > > Hi Krister,
    > >
    > > I am afraid the structure of the generated html has changed. We are
    > > not using 3.1 yet, because of export problems in that version. When I
    > > tried to upload your excel file I stumbled upon a the item
    > > 'GROUP_LAYOUT' that is not available in 3.0.4.1. I am suspecting that
    > > this option changes the page structure and renders the items
    > > unfindable for the jQuery script. At this moment I do not have an 3.1
    > > installation. Can you send me the source of the generated html file? I'll
    have a look at it.
    > >
    > > The idea of the script is that we provide a hook (the classname) in
    > > the html DOM as a starting point for the jQuery styling function. This
    > > function traverses the DOM under the assumption that the page is
    > > always structured the same. This is not very robust, hence my
    > > enhancement request
    > > (https://issuetracker.openclinica.com/view.php?id=10431)
    > >
    > > regards,
    > > Robert
    > >
    > > [cid:[email protected]]
    > >
    > > Robert Meester
    > > Clinical Database Developer, AIGHD Foundation
    > > T +31 (0)20 566 7800
    > > F +31 (0)20 566 9557
    > > E [email protected];
    > > www.aighd.org
    > >
    > > On Dec 13, 2011, at 4:53 PM, Krister Kristianson wrote:
    > >
    > > Indeed I have, the only thing that was visible was white fonts in the
    > > second of the 5 columns!! So obviously something must have worked!
    > >
    > > Regards
    > >
    > > Krister
    > >
    > >
    > >
    > > From: Robert Meester [mailto:[email protected]]
    > > Sent: 13 December 2011 16:27
    > > To: Krister Kristianson
    > > Cc: Robert Meester;
    > > [email protected];
    > > [email protected]; Gerben
    > > Rienk
    > > Subject: Re: [Users] Wikibooks: Styling with jQuery
    > >
    > > Hi Krister,
    > >
    > > Another question: have you saved the form and tried to enter some data?
    > > From the wiki:
    > >
    > > Remark: since jQuery is not loaded during CRF preview, you can only
    > > see the results in the saved CRF version during data entry/review.
    > >
    > > Best,
    > > Robert
    > >
    > > On Dec 13, 2011, at 4:06 PM, Krister Kristianson wrote:
    > >
    > >
    > > Hi Robert,
    > >
    > > I have done the modification as you suggested. Nothing happened same
    > > results. I have also tried to figure out your code from the jQuery
    > > documentation, but that did make me any wiser. Actually I copied the
    > > code verbatim from the your WIKI page but that did not help. Any other
    ideas?
    > >
    > > Regards
    > >
    > > Krister
    > >
    > > From: Robert Meester
    > > [mailto:[email protected]]
    > > Sent: 13 December 2011 14:00
    > > To: Krister Kristianson
    > > Cc: [email protected];
    > > [email protected]; Gerben
    > > Rienk
    > > Subject: Re: [Users] Wikibooks: Styling with jQuery
    > >
    > > Hi Krister,
    > >
    > > Most of the times when the formatting is not working, it is because a
    > > syntax error crashes the javascript. I can't see a problem with the
    > > javascript in your excel sheet, I do notice that the span element is
    > > not closed. In stead of this: small one
    > > please try: small one It is not
    > > strictly necessary to put 'small one' inside the span, but I do think
    > > it is cleaner.
    > > Another thing: the last column (geik of
    > > the
    > > month) is defined as a 'select' in the javascript
    > > (styleGroupColumnN('.colclass3','5','select',{'width':'120px','font-si
    > > ze':'120%','color':'green','background-color':'black'});
    > > ) but in the OC definition it is a 'text' field.
    > > I have not tested the above suggestions, maybe later.
    > >
    > > Just for completeness: please be aware that jQuery is used by OC from
    > > v3.1, if you are using an older version the styling will not work
    > > because jQuery is not included in those versions. I have not tried the
    > > styling with v3.1.2, but I expect it should work, until the user
    > > interface overhaul in one of the next releases anyway
    > > (https://issuetracker.openclinica.com/view.php?id=12251).
    > >
    > > I hope this helps,
    > > Robert
    > >
    > >
    > >
    > > Robert Meester
    > > Clinical Database Developer, AIGHD Foundation
    > > T +31 (0)20 566 7800
    > > F +31 (0)20 566 9557
    > > E [email protected];
    > > www.aighd.org
    > >
    > > On Dec 13, 2011, at 1:01 PM, Krister Kristianson wrote:
    > >
    > >
    > >
    > > Hi Robert And Gerben,
    > >
    > > I have been trying to use your method to improve on the AE page, which
    > > is to wide. I do not like users to scroll to complete everything: To
    > > get a feeling for how it works I tries to copy your example to the
    > > letter. It failed on all accounts but one. All it succeeded to do was
    > > to modify the font color in the heading of column "small one".
    > > Example attached. I have spent all day trying to figure out what I
    > > wrong but this one beats me. I also attach the Excel sheet.
    > >
    > > Regards
    > >
    > > Krister
    > >
    > > -----Original Message-----
    > > From:
    > > [email protected]
    > > [mailto:[email protected]] > enclinica.org]>
    > > On Behalf Of Robert Meester
    > > Sent: 27 July 2011 13:45
    > > To: [email protected]
    > > Subject: [Users] Wikibooks: Styling with jQuery
    > >
    > > Hi,
    > >
    > > Gerben Rienk and I have created a page on wikibooks that shows you how
    > > to style items on an OpenClinica page. You can find it here:
    > > http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingWithJQuery
    > > This wiki provides methods for styling ordinary items, items in a
    > > group and items arranged horizontally (with COLUMN_NUMBER in the crf
    > > definition sheet).
    > >
    > > Also take a look at _this_ page about styling:
    > > http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingACRF,
    > > which was an inspiration. Unfortunately the example Excel file can not
    > > be downloaded from this page anymore. Can someone put it up again?
    > >
    > > Enjoy,
    > > Gerben Rienk and Robert
    > >
  • r.meesterr.meester Posts: 14
    Excellent! Have fun styling your screens!
    I can't tell what the problem is, but most of the time it is IE that makes live hard for web developers...
    I will put a warning in the wiki about IE9.
    Robert
    On Dec 14, 2011, at 4:09 PM, Krister Kristianson wrote:
    > You got it!!
    >
    > I loaded Firefox and Eureka!! It worked like a charm!!!
    >
    > Now, is this a problem for OpenClinica and jQuery or is it a problem for Microsoft?? Should I report this in Mantis? Or do you put in a warning in the Wikie?
    >
    > Regards and thanks for your help. The good thing is that I added lots of experience!
    >
    > Krister
    >
    >
    >
    >
    >
    > From: Robert Meester [mailto:[email protected]]
    > Sent: 14 December 2011 15:18
    > To: Krister Kristianson
    > Cc: Gerben Rienk
    > Subject: Re: [Users] Wikibooks: Styling with jQuery
    >
    > Hi Krister,
    >
    > It is a Internet Explorer 9 problem. When I test your XLS sheet against my OC 3.0.4.1 (removed the extra column in groups and added an jQuery explicitly) I get exactly the same results with IE9. Firefox works like a charm. So I guess that warning when you try to login to OC with IE9 is there for a reason. :)
    >
    > Best,
    > Robert
    >
    >
    >
    >
    >
    > Robert Meester
    > Clinical Database Developer, AIGHD Foundation
    > T +31 (0)20 566 7800
    > F +31 (0)20 566 9557
    > E [email protected]; www.aighd.org
    >
    > On Dec 14, 2011, at 2:20 PM, Krister Kristianson wrote:
    >
    >
    > Obviously just saving the file did not work. Now I copied and pasted into Wordpad The format statements start around line number 1118
    >
    > Hope this works better
    >
    > Regards
    >
    > Krister
    >
    > From: Robert Meester [mailto:[email protected]]
    > Sent: 14 December 2011 13:24
    > To: Krister Kristianson
    > Cc: Gerben Rienk
    > Subject: Re: [Users] Wikibooks: Styling with jQuery
    >
    > Krister, no worries!
    >
    > This screenshot that you send, is it it actual screen?? It has no styling at all… Not even the regular OC styling.
    >
    > Is there a difference if you open the page with Firefox?
    >
    > Robert
    >
    >
    >
    >
    > Robert Meester
    > Clinical Database Developer, AIGHD Foundation
    > T +31 (0)20 566 7800
    > F +31 (0)20 566 9557
    > E [email protected]; www.aighd.org
    >
    > On Dec 14, 2011, at 12:38 PM, Krister Kristianson wrote:
    >
    >
    >
    > I’m sorry, I did not notice that part last night, was probably too exhausted after having tried all day to get it to work.
    >
    > Here is the HTML! Sorry for not getting it right away.
    >
    > I’m using Explorer 9 and Windows 7 SP1
    >
    > I’m really not an expert in this field, I’m PhD Pharmacist and Clinical Pharmacologist. What I know about JAVA and other geek stuf is what have rubbed off from experts like you guys.
    >
    > Regards
    >
    > Krister
    >
    > From: Robert Meester [mailto:[email protected]]
    > Sent: 14 December 2011 10:49
    > To: Krister Kristianson
    > Cc: Robert Meester; Gerben Rienk
    > Subject: Re: [Users] Wikibooks: Styling with jQuery
    >
    > Ah, I am confused because Gerben Rienk used your sloppy copying to conclude that the page was not completely loaded and you did not object…
    > No, I am not referring to the meta data but to the actual html. Please do the following: open the page in your browser, choose view -> source (or equivalent) from the menu (right-click "view page source" in FF), and send what you see to me.
    > What browser are you using?
    >
    > Robert
    >
    >
    > Robert Meester
    > Clinical Database Developer, AIGHD Foundation
    > T +31 (0)20 566 7800
    > F +31 (0)20 566 9557
    > E [email protected]; www.aighd.org
    >
    > On Dec 14, 2011, at 10:28 AM, Krister Kristianson wrote:
    >
    >
    >
    >
    > Are you referring to the meta-data? The reason you did not see the save buttons was my sloppy copying of the image. The save button etc was there all the time. The page looks like a perfectly normal group page!
    >
    > I tried your “long shot” same results
    >
    > Regards
    >
    > Krister
    >
    > From: Robert Meester [mailto:[email protected]]
    > Sent: 14 December 2011 09:55
    > To: Gerben Rienk
    > Cc: Krister Kristianson
    > Subject: Re: [Users] Wikibooks: Styling with jQuery
    >
    > Hi Krister,
    >
    > Does the page look good when you upload it without the javascript? Does it have the save buttons etc?
    > Can you send me the source of page (with the javascript)?
    > A long shot: maybe the ! in the crf name, or the G for group label are not ok/too short for your set up?
    >
    > Robert
    >
    >
    >
    >
    >
    >
    > On Dec 14, 2011, at 8:54 AM, Gerben Rienk wrote:
    >
    >
    >
    >
    >
    > Hi Krister,
    >
    > I did not succeed in installing a flawlessly working 64 java, although it
    > is said to be possible. Not only windows, but also linux (debian). I
    > switched back to 32.
    > All the best in your hunt for the style-script.
    >
    > Gerben Rienk
    >
    >
    >
    >
    >
    > Hi Gerben, I'll get to this thing first thing in the morning, too tired
    >
    > now!
    >
    > I run Java 64 bit!
    >
    >
    >
    > Regards
    >
    >
    >
    > Krister
    >
    >
    >
    > -----Original Message-----
    >
    > From: Gerben Rienk [mailto:[email protected]]
    >
    > Sent: 13 December 2011 22:24
    >
    > To: Krister Kristianson
    >
    > Cc: 'Gerben Rienk'; 'Robert Meester'; [email protected]
    >
    > Subject: RE: [Users] Wikibooks: Styling with jQuery
    >
    >
    >
    > Hi Krister,
    >
    >
    >
    > Thank you for sending the log.
    >
    > Let's try to find the 7 differences.
    >
    > I attach a screenshot of my setting of Tomcat on Windows Vista, 4 Gb.
    >
    > My settings for memory are smaller than yours (128/256), but you set the
    >
    > MaxPermGen and I set the PermGen to 200: could you change that?
    >
    > And delete all tomcat-log-files start tomcat and send the tomcat logs as
    >
    > well? We're looking for more info around the line "we have errors; number
    >
    > of
    >
    > this; 1", as in your openclinica.2011-12-11.log Strangely enough this is a
    >
    > standard message, the only difference being that on my instances it says
    >
    > "we
    >
    > have errors; number of this; 0"
    >
    >
    >
    > And one last question: do you run the 64 or 32 version of java?
    >
    >
    >
    > Kind regards,
    >
    >
    >
    > Gerben Rienk
    >
    >
    >
    > Hi Gerben and Robert,
    >
    >
    >
    > This is really getting spooky. I have tested on a different computer
    >
    > with Maximum memory pool = 1280 and MaxPermSize=180m. I have tried
    >
    > exactly the same file that I sent to you with the same results as
    >
    > earlier.
    >
    > The system is IBM with a 3Gghz DualCore processor and 2 Gb RAM running
    >
    > Widows 7 Professional.
    >
    >
    >
    > I'm at loss and hope that you Gurus can come up with something. I
    >
    > attach the OpenClinica LOG file
    >
    >
    >
    > Regards
    >
    >
    >
    > Krister
    >
    >
    >
    > -----Original Message-----
    >
    > From: Gerben Rienk [mailto:[email protected]]
    >
    > Sent: 13 December 2011 17:39
    >
    > To: Robert Meester; Krister Kristianson
    >
    > Cc: [email protected]
    >
    > Subject: Re: [Users] Wikibooks: Styling with jQuery
    >
    >
    >
    > Hi Krister and Robert,
    >
    >
    >
    > I uploaded Krister's XL to my 3.1.1. test environment and it's OK (see
    >
    > screenshot).
    >
    > I checked at the time of writing of the wiki-page the script against a
    >
    > 3.1 installation and that also worked fine.
    >
    >
    >
    > From the look of Krister's screenshot I would say there's definitely
    >
    > something wrong, for example the Save / Cancel buttons are not visible
    >
    > anymore ;-) This could point to something quite different, such as a
    >
    > memory-problem.
    >
    > I've seen examples where a page would not load completely, unless
    >
    > PermGen was set. Now this would also explain why the styling script is
    >
    > not run, because the "document" is never "ready".
    >
    >
    >
    > So my 2 questions would be:
    >
    > - anything funny in the logs? and
    >
    > - what's the size of PermGen?
    >
    >
    >
    > Kind regards,
    >
    >
    >
    > Gerben Rienk
    >
    >
    >
    >
    >
    > Hi Krister,
    >
    >
    >
    > I am afraid the structure of the generated html has changed. We are
    >
    > not using 3.1 yet, because of export problems in that version. When I
    >
    > tried to upload your excel file I stumbled upon a the item
    >
    > 'GROUP_LAYOUT' that is not available in 3.0.4.1. I am suspecting that
    >
    > this option changes the page structure and renders the items
    >
    > unfindable for the jQuery script. At this moment I do not have an 3.1
    >
    > installation. Can you send me the source of the generated html file?
    >
    > I'll
    >
    > have a look at it.
    >
    >
    >
    > The idea of the script is that we provide a hook (the classname) in
    >
    > the html DOM as a starting point for the jQuery styling function.
    >
    > This function traverses the DOM under the assumption that the page is
    >
    > always structured the same. This is not very robust, hence my
    >
    > enhancement request
    >
    > (https://issuetracker.openclinica.com/view.php?id=10431)
    >
    >
    >
    > regards,
    >
    > Robert
    >
    >
    >
    > [cid:[email protected]]
    >
    >
    >
    > Robert Meester
    >
    > Clinical Database Developer, AIGHD Foundation
    >
    > T +31 (0)20 566 7800
    >
    > F +31 (0)20 566 9557
    >
    > E [email protected];
    >
    > www.aighd.org
    >
    >
    >
    > On Dec 13, 2011, at 4:53 PM, Krister Kristianson wrote:
    >
    >
    >
    > Indeed I have, the only thing that was visible was white fonts in the
    >
    > second of the 5 columns!! So obviously something must have worked!
    >
    >
    >
    > Regards
    >
    >
    >
    > Krister
    >
    >
    >
    >
    >
    >
    >
    > From: Robert Meester [mailto:[email protected]]
    >
    > Sent: 13 December 2011 16:27
    >
    > To: Krister Kristianson
    >
    > Cc: Robert Meester;
    >
    > [email protected];
    >
    > [email protected]; Gerben
    >
    > Rienk
    >
    > Subject: Re: [Users] Wikibooks: Styling with jQuery
    >
    >
    >
    > Hi Krister,
    >
    >
    >
    > Another question: have you saved the form and tried to enter some data?
    >
    > From the wiki:
    >
    >
    >
    > Remark: since jQuery is not loaded during CRF preview, you can only
    >
    > see the results in the saved CRF version during data entry/review.
    >
    >
    >
    > Best,
    >
    > Robert
    >
    >
    >
    > On Dec 13, 2011, at 4:06 PM, Krister Kristianson wrote:
    >
    >
    >
    >
    >
    > Hi Robert,
    >
    >
    >
    > I have done the modification as you suggested. Nothing happened same
    >
    > results. I have also tried to figure out your code from the jQuery
    >
    > documentation, but that did make me any wiser. Actually I copied the
    >
    > code verbatim from the your WIKI page but that did not help. Any
    >
    > other
    >
    > ideas?
    >
    >
    >
    > Regards
    >
    >
    >
    > Krister
    >
    >
    >
    > From: Robert Meester
    >
    > [mailto:[email protected]]
    >
    > Sent: 13 December 2011 14:00
    >
    > To: Krister Kristianson
    >
    > Cc: [email protected];
    >
    > [email protected]; Gerben
    >
    > Rienk
    >
    > Subject: Re: [Users] Wikibooks: Styling with jQuery
    >
    >
    >
    > Hi Krister,
    >
    >
    >
    > Most of the times when the formatting is not working, it is because a
    >
    > syntax error crashes the javascript. I can't see a problem with the
    >
    > javascript in your excel sheet, I do notice that the span element is
    >
    > not closed. In stead of this: small one
    >
    > please try: small one It is not
    >
    > strictly necessary to put 'small one' inside the span, but I do think
    >
    > it is cleaner.
    >
    > Another thing: the last column (geik of
    >
    > the
    >
    > month) is defined as a 'select' in the javascript
    >
    > (styleGroupColumnN('.colclass3','5','select',{'width':'120px','font-s
    >
    > i ze':'120%','color':'green','background-color':'black'});
    >
    > ) but in the OC definition it is a 'text' field.
    >
    > I have not tested the above suggestions, maybe later.
    >
    >
    >
    > Just for completeness: please be aware that jQuery is used by OC from
    >
    > v3.1, if you are using an older version the styling will not work
    >
    > because jQuery is not included in those versions. I have not tried
    >
    > the styling with v3.1.2, but I expect it should work, until the user
    >
    > interface overhaul in one of the next releases anyway
    >
    > (https://issuetracker.openclinica.com/view.php?id=12251).
    >
    >
    >
    > I hope this helps,
    >
    > Robert
    >
    >
    >
    >
    >
    >
    >
    > Robert Meester
    >
    > Clinical Database Developer, AIGHD Foundation
    >
    > T +31 (0)20 566 7800
    >
    > F +31 (0)20 566 9557
    >
    > E [email protected];
    >
    > www.aighd.org
    >
    >
    >
    > On Dec 13, 2011, at 1:01 PM, Krister Kristianson wrote:
    >
    >
    >
    >
    >
    >
    >
    > Hi Robert And Gerben,
    >
    >
    >
    > I have been trying to use your method to improve on the AE page,
    >
    > which is to wide. I do not like users to scroll to complete
    >
    > everything: To get a feeling for how it works I tries to copy your
    >
    > example to the letter. It failed on all accounts but one. All it
    >
    > succeeded to do was to modify the font color in the heading of column
    >
    > "small one".
    >
    > Example attached. I have spent all day trying to figure out what I
    >
    > wrong but this one beats me. I also attach the Excel sheet.
    >
    >
    >
    > Regards
    >
    >
    >
    > Krister
    >
    >
    >
    > -----Original Message-----
    >
    > From:
    >
    > [email protected]
    >
    > [mailto:[email protected]]
    > p
    >
    > enclinica.org]>
    >
    > On Behalf Of Robert Meester
    >
    > Sent: 27 July 2011 13:45
    >
    > To: [email protected]
    >
    > Subject: [Users] Wikibooks: Styling with jQuery
    >
    >
    >
    > Hi,
    >
    >
    >
    > Gerben Rienk and I have created a page on wikibooks that shows you
    >
    > how to style items on an OpenClinica page. You can find it here:
    >
    > http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingWithJQuer
    >
    > y This wiki provides methods for styling ordinary items, items in a
    >
    > group and items arranged horizontally (with COLUMN_NUMBER in the crf
    >
    > definition sheet).
    >
    >
    >
    > Also take a look at _this_ page about styling:
    >
    > http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingACRF,
    >
    > which was an inspiration. Unfortunately the example Excel file can
    >
    > not be downloaded from this page anymore. Can someone put it up again?
    >
    >
    >
    > Enjoy,
    >
    > Gerben Rienk and Robert
    >
    >
  • kristiakkristiak Posts: 1,334 ✭✭✭
    Well, I ‘ll share with everyone the AE screen I intend to develop!

    Regards

    Krister

    From: Robert Meester [mailto:[email protected]]
    Sent: 14 December 2011 16:40
    To: [email protected]
    Cc: Gerben Rienk; Krister Kristianson
    Subject: Re: [Users] Wikibooks: Styling with jQuery

    Excellent! Have fun styling your screens!

    I can't tell what the problem is, but most of the time it is IE that makes live hard for web developers...

    I will put a warning in the wiki about IE9.

    Robert
    On Dec 14, 2011, at 4:09 PM, Krister Kristianson wrote:
    You got it!!

    I loaded Firefox and Eureka!! It worked like a charm!!!

    Now, is this a problem for OpenClinica and jQuery or is it a problem for Microsoft?? Should I report this in Mantis? Or do you put in a warning in the Wikie?

    Regards and thanks for your help. The good thing is that I added lots of experience!

    Krister





    From: Robert Meester [mailto:[email protected]]
    Sent: 14 December 2011 15:18
    To: Krister Kristianson
    Cc: Gerben Rienk
    Subject: Re: [Users] Wikibooks: Styling with jQuery

    Hi Krister,

    It is a Internet Explorer 9 problem. When I test your XLS sheet against my OC 3.0.4.1 (removed the extra column in groups and added an jQuery explicitly) I get exactly the same results with IE9. Firefox works like a charm. So I guess that warning when you try to login to OC with IE9 is there for a reason. :)

    Best,
    Robert




    Robert Meester
    Clinical Database Developer, AIGHD Foundation
    T +31 (0)20 566 7800
    F +31 (0)20 566 9557
    E [email protected]; www.aighd.org

    On Dec 14, 2011, at 2:20 PM, Krister Kristianson wrote:
    Obviously just saving the file did not work. Now I copied and pasted into Wordpad The format statements start around line number 1118

    Hope this works better

    Regards

    Krister

    From: Robert Meester [mailto:[email protected]]
    Sent: 14 December 2011 13:24
    To: Krister Kristianson
    Cc: Gerben Rienk
    Subject: Re: [Users] Wikibooks: Styling with jQuery

    Krister, no worries!

    This screenshot that you send, is it it actual screen?? It has no styling at all… Not even the regular OC styling.

    Is there a difference if you open the page with Firefox?

    Robert



    Robert Meester
    Clinical Database Developer, AIGHD Foundation
    T +31 (0)20 566 7800
    F +31 (0)20 566 9557
    E [email protected]; www.aighd.org

    On Dec 14, 2011, at 12:38 PM, Krister Kristianson wrote:
    I’m sorry, I did not notice that part last night, was probably too exhausted after having tried all day to get it to work.

    Here is the HTML! Sorry for not getting it right away.

    I’m using Explorer 9 and Windows 7 SP1

    I’m really not an expert in this field, I’m PhD Pharmacist and Clinical Pharmacologist. What I know about JAVA and other geek stuf is what have rubbed off from experts like you guys.

    Regards

    Krister

    From: Robert Meester [mailto:[email protected]]
    Sent: 14 December 2011 10:49
    To: Krister Kristianson
    Cc: Robert Meester; Gerben Rienk
    Subject: Re: [Users] Wikibooks: Styling with jQuery

    Ah, I am confused because Gerben Rienk used your sloppy copying to conclude that the page was not completely loaded and you did not object…
    No, I am not referring to the meta data but to the actual html. Please do the following: open the page in your browser, choose view -> source (or equivalent) from the menu (right-click "view page source" in FF), and send what you see to me.
    What browser are you using?

    Robert

    Robert Meester
    Clinical Database Developer, AIGHD Foundation
    T +31 (0)20 566 7800
    F +31 (0)20 566 9557
    E [email protected]; www.aighd.org

    On Dec 14, 2011, at 10:28 AM, Krister Kristianson wrote:
    Are you referring to the meta-data? The reason you did not see the save buttons was my sloppy copying of the image. The save button etc was there all the time. The page looks like a perfectly normal group page!

    I tried your “long shot” same results

    Regards

    Krister

    From: Robert Meester [mailto:[email protected]]
    Sent: 14 December 2011 09:55
    To: Gerben Rienk
    Cc: Krister Kristianson
    Subject: Re: [Users] Wikibooks: Styling with jQuery

    Hi Krister,

    Does the page look good when you upload it without the javascript? Does it have the save buttons etc?
    Can you send me the source of page (with the javascript)?
    A long shot: maybe the ! in the crf name, or the G for group label are not ok/too short for your set up?

    Robert

    On Dec 14, 2011, at 8:54 AM, Gerben Rienk wrote:
    Hi Krister,
    I did not succeed in installing a flawlessly working 64 java, although it
    is said to be possible. Not only windows, but also linux (debian). I
    switched back to 32.
    All the best in your hunt for the style-script.
    Gerben Rienk
    Hi Gerben, I'll get to this thing first thing in the morning, too tired
    now!
    I run Java 64 bit!

    Regards

    Krister

    -----Original Message-----
    From: Gerben Rienk [mailto:[email protected]]
    Sent: 13 December 2011 22:24
    To: Krister Kristianson
    Cc: 'Gerben Rienk'; 'Robert Meester'; [email protected]
    Subject: RE: [Users] Wikibooks: Styling with jQuery

    Hi Krister,

    Thank you for sending the log.
    Let's try to find the 7 differences.
    I attach a screenshot of my setting of Tomcat on Windows Vista, 4 Gb.
    My settings for memory are smaller than yours (128/256), but you set the
    MaxPermGen and I set the PermGen to 200: could you change that?
    And delete all tomcat-log-files start tomcat and send the tomcat logs as
    well? We're looking for more info around the line "we have errors; number
    of
    this; 1", as in your openclinica.2011-12-11.log Strangely enough this is a
    standard message, the only difference being that on my instances it says
    "we
    have errors; number of this; 0"

    And one last question: do you run the 64 or 32 version of java?

    Kind regards,

    Gerben Rienk

    Hi Gerben and Robert,

    This is really getting spooky. I have tested on a different computer
    with Maximum memory pool = 1280 and MaxPermSize=180m. I have tried
    exactly the same file that I sent to you with the same results as
    earlier.
    The system is IBM with a 3Gghz DualCore processor and 2 Gb RAM running
    Widows 7 Professional.

    I'm at loss and hope that you Gurus can come up with something. I
    attach the OpenClinica LOG file

    Regards

    Krister

    -----Original Message-----
    From: Gerben Rienk [mailto:[email protected]]
    Sent: 13 December 2011 17:39
    To: Robert Meester; Krister Kristianson
    Cc: [email protected]
    Subject: Re: [Users] Wikibooks: Styling with jQuery

    Hi Krister and Robert,

    I uploaded Krister's XL to my 3.1.1. test environment and it's OK (see
    screenshot).
    I checked at the time of writing of the wiki-page the script against a
    3.1 installation and that also worked fine.

    From the look of Krister's screenshot I would say there's definitely
    something wrong, for example the Save / Cancel buttons are not visible
    anymore ;-) This could point to something quite different, such as a
    memory-problem.
    I've seen examples where a page would not load completely, unless
    PermGen was set. Now this would also explain why the styling script is
    not run, because the "document" is never "ready".

    So my 2 questions would be:
    - anything funny in the logs? and
    - what's the size of PermGen?

    Kind regards,

    Gerben Rienk


    Hi Krister,

    I am afraid the structure of the generated html has changed. We are
    not using 3.1 yet, because of export problems in that version. When I
    tried to upload your excel file I stumbled upon a the item
    'GROUP_LAYOUT' that is not available in 3.0.4.1. I am suspecting that
    this option changes the page structure and renders the items
    unfindable for the jQuery script. At this moment I do not have an 3.1
    installation. Can you send me the source of the generated html file?
    I'll
    have a look at it.

    The idea of the script is that we provide a hook (the classname) in
    the html DOM as a starting point for the jQuery styling function.
    This function traverses the DOM under the assumption that the page is
    always structured the same. This is not very robust, hence my
    enhancement request
    (https://issuetracker.openclinica.com/view.php?id=10431)

    regards,
    Robert

    [cid:[email protected]]

    Robert Meester
    Clinical Database Developer, AIGHD Foundation
    T +31 (0)20 566 7800
    F +31 (0)20 566 9557
    E [email protected];
    www.aighd.org

    On Dec 13, 2011, at 4:53 PM, Krister Kristianson wrote:

    Indeed I have, the only thing that was visible was white fonts in the
    second of the 5 columns!! So obviously something must have worked!

    Regards

    Krister



    From: Robert Meester [mailto:[email protected]]
    Sent: 13 December 2011 16:27
    To: Krister Kristianson
    Cc: Robert Meester;
    [email protected];
    [email protected]; Gerben
    Rienk
    Subject: Re: [Users] Wikibooks: Styling with jQuery

    Hi Krister,

    Another question: have you saved the form and tried to enter some data?
    From the wiki:

    Remark: since jQuery is not loaded during CRF preview, you can only
    see the results in the saved CRF version during data entry/review.

    Best,
    Robert

    On Dec 13, 2011, at 4:06 PM, Krister Kristianson wrote:


    Hi Robert,

    I have done the modification as you suggested. Nothing happened same
    results. I have also tried to figure out your code from the jQuery
    documentation, but that did make me any wiser. Actually I copied the
    code verbatim from the your WIKI page but that did not help. Any
    other
    ideas?

    Regards

    Krister

    From: Robert Meester
    [mailto:[email protected]]
    Sent: 13 December 2011 14:00
    To: Krister Kristianson
    Cc: [email protected];
    [email protected]; Gerben
    Rienk
    Subject: Re: [Users] Wikibooks: Styling with jQuery

    Hi Krister,

    Most of the times when the formatting is not working, it is because a
    syntax error crashes the javascript. I can't see a problem with the
    javascript in your excel sheet, I do notice that the span element is
    not closed. In stead of this: small one
    please try: small one It is not
    strictly necessary to put 'small one' inside the span, but I do think
    it is cleaner.
    Another thing: the last column (geik of
    the
    month) is defined as a 'select' in the javascript
    (styleGroupColumnN('.colclass3','5','select',{'width':'120px','font-s
    i ze':'120%','color':'green','background-color':'black'});
    ) but in the OC definition it is a 'text' field.
    I have not tested the above suggestions, maybe later.

    Just for completeness: please be aware that jQuery is used by OC from
    v3.1, if you are using an older version the styling will not work
    because jQuery is not included in those versions. I have not tried
    the styling with v3.1.2, but I expect it should work, until the user
    interface overhaul in one of the next releases anyway
    (https://issuetracker.openclinica.com/view.php?id=12251).

    I hope this helps,
    Robert



    Robert Meester
    Clinical Database Developer, AIGHD Foundation
    T +31 (0)20 566 7800
    F +31 (0)20 566 9557
    E [email protected];
    www.aighd.org

    On Dec 13, 2011, at 1:01 PM, Krister Kristianson wrote:



    Hi Robert And Gerben,

    I have been trying to use your method to improve on the AE page,
    which is to wide. I do not like users to scroll to complete
    everything: To get a feeling for how it works I tries to copy your
    example to the letter. It failed on all accounts but one. All it
    succeeded to do was to modify the font color in the heading of column
    "small one".
    Example attached. I have spent all day trying to figure out what I
    wrong but this one beats me. I also attach the Excel sheet.

    Regards

    Krister

    -----Original Message-----
    From:
    [email protected]
    [mailto:[email protected]]
    On Behalf Of Robert Meester
    Sent: 27 July 2011 13:45
    To: [email protected]
    Subject: [Users] Wikibooks: Styling with jQuery

    Hi,

    Gerben Rienk and I have created a page on wikibooks that shows you
    how to style items on an OpenClinica page. You can find it here:
    http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingWithJQuer
    y This wiki provides methods for styling ordinary items, items in a
    group and items arranged horizontally (with COLUMN_NUMBER in the crf
    definition sheet).

    Also take a look at _this_ page about styling:
    http://en.wikibooks.org/wiki/OpenClinica_User_Manual/StylingACRF,
    which was an inspiration. Unfortunately the example Excel file can
    not be downloaded from this page anymore. Can someone put it up again?

    Enjoy,
    Gerben Rienk and Robert
This discussion has been closed.