Monospace output from Zen
Hi,
I have a problem which i think has a simple solution but which i and others haven't yet cracked. I want to display text output to a text box in monospaced font. At the moment the style sheet is shown below, I have tried various other options such as specifying a specific font such as Courier New. None of the browsers I have tried (Safari, Firefox on OSX, IE) display as monospace, although the last 2 come close. I wonder whether I need a <pre> tag, but I can't see how to do that in Zen.
Suggestions?
XData Style
{
<style type="text/css">
/* style for title bar */
/* style for text box, non proportional (although in practice doesnt work)*/
#txaSPRINT {
background: #C5D6D6;
color: black;
font-family: monospace, monospace;
font-size: 1em;
padding: 5px;
}
</style>
}
Hi Ray,
You can use the
<html>Zen component to insert raw HTML content into your page. There are a number of different approaches that use this component to display monospaced text, but I'll highlight just one.First, add an
<html>component to your XData Contents block, as follows:The id of the component is "txaSPRINT" which matches the CSS in your XData Style block. This means the contents of the
<html>component will be monospaced text; you do not necessarily need a<pre>tag. The only thing left is to insert the text, which you could do with the following javascript method:ClientMethod updateMonospaceTextbox(content) [ Language = javascript ] { zen('txaSPRINT').setContent(content) }You can also update the text from the server, using this ZenMethod:
Method UpdateTextbox(content As %String) [ ZenMethod ] { Set textbox = ..%GetComponentById("txaSPRINT") Set textbox.content = content }