dhis2-users team mailing list archive
-
dhis2-users team
-
Mailing list archive
-
Message #15141
Re: Dataset Custom Forms (CSS & JS)
Hello Makhate,
Couple things!
So first of all, *if* the CSS is for the custom form and the custom form
only, putting them in the source tab like you described *should* work, but
it can be finicky, as DHIS 2 does alter the HTML as it is being displayed.
Best figure out what works in the chrome console and put that in your
custom form.
<style>
/*
CSS code here
*/
</style>
Second, if you want css to work on all pages,
https://docs.dhis2.org/master/en/developer/html/webapi_ui_customization.html
*isn't
the safest place* to keep custom css and js as you have found it does not
work on all pages. There is no way besides forking core to put your own
custom CSS on the react apps unfortunately:
https://jira.dhis2.org/browse/DHIS2-2065
https://jira.dhis2.org/browse/DHIS2-1299
https://jira.dhis2.org/browse/DHIS2-2624
*Timothy Harding*
Sr. Systems Analyst, BAO Systems
+1 202-536-1541 | tharding@xxxxxxxxxxxxxx | http://www.baosystems.com | Skype:
hardingt@xxxxxxxxx | 2900 K Street, Suite 406, Washington D.C. 20007
On Wed, Feb 7, 2018 at 4:48 AM, Makhate Makhate <makhatemakhate@xxxxxxxxx>
wrote:
> Thanks,
>
> I ran the POST-request and it looks like it ran successfully because i can
> see the CSS file when i run /api/28/files/style.
>
> One last thing, how do i link/reference that css file? I'm asking this
> because the styling is not working on my forms.
>
> Warmest regards,
> Makhate, ICAP Lesotho
>
> On Wed, Feb 7, 2018 at 7:49 AM, Jason Pickering <
> jason.p.pickering@xxxxxxxxx> wrote:
>
>> Did you have a look at our developer documentation on the use of custom
>> CSS/JS?
>>
>> https://docs.dhis2.org/master/en/developer/html/webapi_ui_cu
>> stomization.html
>>
>> This should also work for inline JS in the form.
>>
>> <script type="text/javascript">
>> <!--
>> JS CODE HERE
>> -->
>> </script>
>>
>>
>>
>> On Wed, Feb 7, 2018 at 6:38 AM, Makhate Makhate <makhatemakhate@xxxxxxxxx
>> > wrote:
>>
>>> Hi Diao,
>>>
>>> Thanks for helping out.
>>>
>>> What do you mean when you say "*it maybe possible to use files*" what
>>> do you mean by files.
>>>
>>> The only trick that I could come up with is doing it like this but it
>>> doesn't quite work:
>>>
>>> <style>
>>> /*
>>> CSS code here
>>> */
>>> </style>
>>>
>>> <table>
>>> <!---- table markup in here ----->
>>> </table>
>>>
>>> Well, doing it like this, when i hit Preview i can see basic
>>> interactivity but when i load the actuall dataset, it doesn't work.
>>>
>>> Does anyone know exactly where to put JS and CSS code.
>>>
>>> Kind regards,
>>> Makhate,
>>> ICAP Lesotho
>>>
>>> On Tue, Feb 6, 2018 at 5:54 PM, Mamadou Diao Diallo <
>>> diao_diallo@xxxxxxxxxx> wrote:
>>>
>>>> Hi Makhate,
>>>>
>>>> It maybe possible to use files but I used to paste Javascript code in
>>>> the Source window at the custom form editor, following this link
>>>> https://docs.dhis2.org/master/en/user/html/database_design.h
>>>> tml#d0e36608 see the section *30.5.3.1.2. Custom Forms.*
>>>>
>>>> Best
>>>>
>>>> *Diao*
>>>>
>>>> 30.5.3.1.2. Custom Forms
>>>>
>>>> On Tue, Feb 6, 2018 at 2:30 PM, Makhate Makhate <
>>>> makhatemakhate@xxxxxxxxx> wrote:
>>>>
>>>>> Hello Community,
>>>>>
>>>>> I am customizing the UI form of our datasets here. We need help on
>>>>> where to put CSS and Javascript files.
>>>>>
>>>>> Kind regards,
>>>>> Makhate Makhate
>>>>> ICAP, Lesotho
>>>>>
>>>>> _______________________________________________
>>>>> Mailing list: https://launchpad.net/~dhis2-users
>>>>> Post to : dhis2-users@xxxxxxxxxxxxxxxxxxx
>>>>> Unsubscribe : https://launchpad.net/~dhis2-users
>>>>> More help : https://help.launchpad.net/ListHelp
>>>>>
>>>>>
>>>>
>>>>
>>>> --
>>>> *DIALLO Mamadou Diao Conseiller IT, Specialiste de DHIS 2 **( District
>>>> Health Information Software )*
>>>>
>>>>
>>>> *Projet de Renforcement du Système d'Information Sanitaire en Guinée*
>>>> *Phone : 623909413 | 662256106*
>>>> *Skype : diawwdiallo*
>>>> www.jsi.com
>>>>
>>>
>>>
>>> _______________________________________________
>>> Mailing list: https://launchpad.net/~dhis2-users
>>> Post to : dhis2-users@xxxxxxxxxxxxxxxxxxx
>>> Unsubscribe : https://launchpad.net/~dhis2-users
>>> More help : https://help.launchpad.net/ListHelp
>>>
>>>
>>
>>
>> --
>> Jason P. Pickering
>> email: jason.p.pickering@xxxxxxxxx
>> tel:+46764147049 <+46%2076%20414%2070%2049>
>>
>
>
> _______________________________________________
> Mailing list: https://launchpad.net/~dhis2-users
> Post to : dhis2-users@xxxxxxxxxxxxxxxxxxx
> Unsubscribe : https://launchpad.net/~dhis2-users
> More help : https://help.launchpad.net/ListHelp
>
>
References