Skip to main content
Question

How to bold values in a Form?

  • February 8, 2018
  • 0 replies
  • 234 views

I want to make the value of my field (PO TOTAL) in bold to emphasize it. Is it possible?
Please see the image the I attached for reference.
This topic has been closed for replies.

  • Registered
  • February 8, 2018
A cheap way to do it is to create a formula rich text field with the following definition:
"<b>" & ToText([number]) & "</b>"
But you may need a more complicated formula if you need (1) to preserver commas and (2) are worried about having right justification in reports (string justify the the left).

  • Registered
  • February 8, 2018
You can also do it with IOL without any additional data fields and keep the original commas and justification. You of course have to use and IOL field but you should have this in every application so you can immediately implement new script solutions without delay.

Assuming the label is "number" this script finds the cell with the label, selects the next cell (which contains the value) and wraps in in bold tags.
$("td.label:has(label.fieldLabel b:contains(number))").next("td").wrapInner("<b></b>");
Reference the unmodified HTML:
<tr class="formRow ">
  <td id="tdl_0" class="label lc">
    <label class="fieldLabel">
      <b>number</b>
    </label>
  </td>
  <td id="tdf_0" class="cell cc nowrap" colspan="100">5,029.36</td>
</tr>
and the modified HTML:
<tr class="formRow ">
  <td id="tdl_0" class="label lc">
    <label class="fieldLabel">
      <b>number</b>
    </label>
  </td>
  <td id="tdf_0" class="cell cc nowrap" colspan="100"><b>5,029.36</b></td>
</tr>

  • Registered
  • February 8, 2018
That string inside quotes is called the selector. To use multiple selectors you list both using a comma:

$("td.label:has(label.fieldLabel b:contains(PO TOTAL)),
  td.label:has(label.fieldLabel b:contains(PO Currency)")
").next("td").wrapInner("<b></b>");

  • Registered
  • February 8, 2018
As to your other question about increasing the font you can add this:
$("td.label:has(label.fieldLabel b:contains(number))")
  .next("td")
  .wrapInner("<b></b>")
  .css({fontSize: 20});
But if you knowledgable of CSS you can just get rid of the <b> tag altogether (<b> is deprecated) and add the fontWeight property:
$("td.label:has(label.fieldLabel b:contains(number))")
  .next("td")
  .css({fontSize: 20, fontWeight: "bold"});

You will see <b> and <font> tags used in QuickBase formulas and in QuickBase's own HTML. They are considered deprecated by most of the web community today. But they still work and will continue to work for backward comparability. And the renegade in me sees the simplicity in their use - that's why it is called "markup" - like proofreader's marks that are inserted into the text of a manuscript to indicated formatting and layout:



Sometimes using CSS gets outrageous in its complexity to do simple things..