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>
}
Comments
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:
<html id="txaSPRINT"></html>
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
}