The Paragraph field: Have list numbers in parentheses.

  • ottawajoshkorn
    Asked on October 15, 2021 at 5:28 PM

    What I have at the moment is a list with items numbered:

    A. ....

    B. ......

    C. ....

    D. ....

    Is there a way I can change the customization so that the items appear like this?

    (a) ....

    (b) ......

    (c) ....

    (d) ....


    TIA

    Josh

  • Anthony_Evans
    Replied on October 15, 2021 at 7:25 PM

    Howdy Josh,

    Please inject this CSS:

    .form-html ol {
      counter-reset: list;
    }
    .form-html ol > li {
      list-style: none;
    }
    .form-html ol > li:before {
      content: " (" counter(list, lower-alpha) ") ";
      counter-increment: list;
    }

    Thank you for your patience and understanding!

  • ottawajoshkorn
    Replied on October 15, 2021 at 8:46 PM

    It doesn't work. The indents get lost.

    I get

    (a) asdfasd flk fas;lkfs lsk s;lfk s;dlfjkasd;lfjksad ;fl sd;lksdf;lsadkf;lsadkfas;ldfk s;dlfk sd;lfks;lfksf;lksdf;lsakdf;aslfksad;lfksd;flksdf;lasdkf;lsdfk

    (b) kljadfsjlkfsdljkfsd sd sd f ;lsd flksfj sklf slkfj slksj dlskjf slkfj slkj flksjflksj sdlkjf aslkfj lkf jslkfj slkdj slkfj lskdjf slkdfjslkdjfslkdfjslkfj

    etc.

    At least I had those before.

  • Lorenz JotForm Support
    Replied on October 15, 2021 at 9:59 PM

    Hi there,

    I checked your form, and I assume you are referring to the paragraph element, and it seems like you've already applied what you're trying to accomplish.

    1634349506 616a31c2c6328 The Easiest Onl Screenshot 10

    Should you need any further assistance, please let us know.

  • ottawajoshkorn
    Replied on October 15, 2021 at 11:21 PM

    Surely you can see that it’s improper paragraph alignment.

    The bullet is supposed to be outdented.

    Take out the custom CSS and see what the paragraphs should look like.

    1634354510 616a454ed1a02  Screenshot 10

  • Kenneth JotForm Support
    Replied on October 16, 2021 at 2:39 AM

    Hi there,

    Is this how you want it to look?

    1634366226 616a73124d118 h1 Screenshot 10

    If so, then please add this code into your Inject Custom CSS Area, along with the codes my colleague provided earlier: https://www.jotform.com/help/117-how-to-inject-custom-css-codes/

    .form-html ol > li:before {

      padding-right: 10px;

    }

    I hope that helps.

    Best.

  • ottawajoshkorn
    Replied on October 16, 2021 at 11:19 AM

    No. I want it to look the way most bulleted-point lists look (the dashed line is just for your benefit):

    1634397368 616aecb88acaf  Screenshot 10

    Word, for example, correctly formatted this text from a copy-and-paste without batting an eyelid.

  • Gaetan_B
    Replied on October 16, 2021 at 11:45 AM

    Hello,

    This is possible but you would need to edit the source code of that element to wrap each paragraph with the following:

    <li><p style="padding-left: 33px;">conduct affairs in compliance with applicable laws and adhere to the highest principles of business ethics and transparency;</p><br/><br/></li>

    1634399138 616af3a2e1a5b  Screenshot 10


    Best regards

  • ottawajoshkorn
    Replied on October 16, 2021 at 1:17 PM
    .form-html ol > li {
     list-style-type: lower-alpha;
    }

    This gets pretty close, is a lot simpler, and works. If you can find a way to include the parentheses into the mix, then by all means, go ahead.

  • Gaetan_B
    Replied on October 16, 2021 at 2:33 PM

    Hello,

    To add the parentheses one of my colleagues already provided you with the code:

    .form-html ol > li:before {
      content" (" counter(list, lower-alpha) ") ";
      counter-increment: list;
    }


    Also please note that what you are asking for is not a web standard (you can find all the list-style-type here: https://www.w3schools.com/css/tryit.asp?filename=trycss_list-style-type_all), so it will very certainly require custom code and certain types of workarounds to make it possible according to web standards.


    Your list is considered as a single block, and we cannot add the parentheses dynamically as it is not a standard.

    So the workaround, as the whole list is considered one big block, is to put some p tags so that we can shift the rest of the text as a separate entity and thus reach the effect you are looking for.


    Best regards

  • ottawajoshkorn
    Replied on October 17, 2021 at 6:36 PM

    What you're proposing is short-sighted. It would require a programmer to modify it, and that's just not practical. Parentheses around item numbers is something you should be providing, out of the box, just like Microsoft Word.

    Thanks, I'll go for the low-maintenance solution.


  • Amin JotForm Support
    Replied on October 17, 2021 at 6:52 PM

    We sincerely apologize for any inconvenience you may have encountered.

    Kindly be informed that, unfortunately, it's not possible to have list numbers in parentheses in the Paragraph field.

    However, I've successfully escalated this as a feature request to our developers. Also, please note that we can not provide you with when or if this will be implemented. If there is any update, we will inform you via this support ticket.   

    Your understanding is most appreciated.