Editing HTML by replacing text - parsing

I am trying to replace HTML text from one language to corresponding text in other language, without changing the markup and layout of the page. For parsing HTML I am using JSOUP Java library.
doc.title(MTClient.translate(doc.title()));
This would take up the title of the page and replace it with translated text string output received by MTClient.translate(Text To Be Translated). This is working fine and replacing the title.
But when I am doing the same on Elements of the HTML page, using the below code:
Elements Nodes = doc.children();
for(Element node : Nodes){
node.text(MTClient.translate(node.text()));
}
It is removing the whole layout of the page and only storing the translated text simply in the page.
I read the javadocs of JSOUP, which says:
public Element text(String text)
Set the text of this element. Any existing contents (text or elements) will be cleared.
And all the sub elements are removed.
I also tried HTMLPARSER lib in java, but it also doesn't seem to support this type of replacement.
How do i replace the text??
Thanks for help, in advance.

If you only want to modify the text, you should get the Element's textNodes() and set their text. TextNodes don't have child elements, so you won't be replacing them.
Elements nodes = doc.children();
for (Element node : nodes)
for (TextNode textNode : node.textNodes())
textNode.text(MTClient.translate(textNode.text()));

Related

Is there a way to dynamically insert a CSS/style fragment into the DOM using DART?

As with some of the other Dart questions that have been posed about loading and injecting HTML fragment into the DOM, I'm having trouble figuring out how to do something similar with CSS/style fragments that I download via AJAX.
Trying to insert it as a style tag in HTML just results in the message:
Removing disallowed element <STYLE> // note: original text is lower-case 'style'
After fiddling around with the above problem for a while, I came upon the solution myself. I post it here in case it helps others or in case someone has suggestions for better methods.
The problem I found was that I was injecting the CSS style element into the DOM container element as "innerHtml" - which was being rejected. I found that if I specifically created a style tag element I could then insert the CSS as "text", like this:
This code takes the HTML and CSS fragments that it downloads from the AJAX server and then inserts them into new elements on my master "screen" element. In this example, the HTML gets inserted into a basic container 'div' element as innerHtml, and the CSS gets injected into a style element as text. They then both get attached to the parent element and the stylized HTML instantly pops on screen.
var screen = querySelector('#myScreen');
var container = new DivElement();
container.innerHtml = html;
var styleElement = new Element.tag('style');
styleElement.text = css;
screen.children.add(styleElement);
screen.children.add(container);

render html in a rich text box in active reports software

I have a string with basic html markup which I want to put into a rich textbox
string ab = #"<b> a b </b>"
I want it to render as it would appear in a browser ie:
a b
how can I do this in active reports 7? According to http://www.datadynamics.com/forums/77664/ShowPost.aspx, a richtextbox supports these tags. Do I have to specify a property to allow it to render html? How should I approach this?
Thanks,
Sam
More information (Update 8/11):
I'm binding the data from a database field - an oracle nclob. The field repeats within the detail section (with different information each time).
If I bind the field directly to a textbox or label it renders the string, but doesnt encode the html
<b> a b </b>
but it encode the string.
Solution Summary
Solution (as suggested by #activescott)
Bind rtx directly to the datafield
'Reformat' the text into html in
the script
public void detail_Format()
{
rtxBox.Html = rtxBox.Text;
}
result: renders the html field with some degree of html formatting
notes:
binding directly in the script doesnt work,
ie. rtxBox.Html = pt.Fields["CONT_ID"].ToString(); yields some wierd meta data string
the Datafield only binding approach doesn't work
(it will yield it as text)
there are some extra spacing that occurs with p tags. It may be worth regexing them out or somehow providing some formatting control.
The actual property you are looking for is the Html Property. You can also load a file into that control using the step-by-step walkthrough here.
I am assuming you are using Section Reports and not Page Reports.
To use HTML from the database in a bound report, you should be able to use the DataField property of the RichTextBox control (set it to the name of the corresponding Data field at design time). However, I noticed this "Render HTML tags in DB in ActiveReport pdf or HTML" article which kind of implies that doesn't work since it loads the HTML from a database programatically. One of the two should work.

Changing text-alignment when keyboard is switched to a right-to-left language?

As per an user-request I'm trying to make my (PhoneGap) webapp work better with RTL languages, such as Hebrew. I want to make my inputs and textareas work better with these languages. When the user switches their keyboard to such a language, the input direction automatically switches to right-to-left, as intended. However, the text-alignment stays on the left side, which is unfortunate. I realize I can switch the text-alignment using the dir attribute like so:
<input dir="rtl" />
My plan is to use JavaScript to somehow detect an RTL input language and add this attribute to all inputs and textareas. However, this seems like a bit of a hassle. Is there an easier way I'm overlooking? I don't like the idea of adding more JavaScript for this simple task.
If the whole page is written in hebrew or arabic, you should add the dir attribute on the html element, along with a lang="he" / lang="ar" attribute (the latter is for VoiceOver not reading hebrew/arabic believing it's english. The alphabet and pronunciation are quite different :) ).
If only parts of the page are written in hebrew, then each element containing hebrew text should've these attributes (or its parent) and the other parts in english should've dir="ltr" lang="en" attributes so that no text is left without the appropriate lang and dir attributes. It's faster to add them on a single parent than on each individual HTML elements and if a parent has 5 nodes in english and 1 in hebrew, it only needs 2 attributes: 1 on parent for lang="en" dir="ltr", the other on the child element containing hebrew.
For styling problems caused by rtl writing, you can use one of these attributes as a giant switch for each CSS property like float that uses left or right values (and properties like right, border-right, margin-right, margin: t r b l;; please see the second part of one of my first answers here on UTF-8 and CSS. Note: iOS has no problem with advanced CSS selectors that were only dreams when we had to support IE6 ;) )

How to display XML string in IE

I created a control that gets an xml string, I am trying to figure out how to display the xml content well-formatted in IE, instead of a plain string.
IE is natively able to display xml document, so maybe just an iframe would do the job.
Or, if your string contains line breaks and is indented, you can wrap it in <pre></pre> tags.

How to get markitup editor, using markdown set, to send markdown instead of html

I'm using rails and have a markItUp editor in place, using the Markdown custom set. The only thing I can't figure out is how to get it to submit raw Markdown instead of converted html. I plan on storing both formats, but I haven't found anything capable of parsing html back to markdown. I've customized the markdown set set.js as we didn't want the entire set of formatting options. Here:
myMarkdownSettings = {
previewParserPath: '',
onShiftEnter: {keepDefault:false, openWith:'\n\n'},
markupSet: [
{name:'Bold', key:'B', openWith:'**', closeWith:'**'},
{name:'Italic', key:'I', openWith:'_', closeWith:'_'},
{name:'Bulleted List', openWith:'- ' },
{name:'Link', key:'L', openWith:'[', closeWith:']([![Url:!:http://]!] "[![Title]!]")', placeHolder:'Your text to link here...' }
]
}
And here's the onready code for the page where the markitup elements appear:
$.editable.addInputType('markitup', {
element : $.editable.types.textarea.element,
plugin : function(myMarkdownSettings, original) {
$('textarea', this).markItUp(myMarkdownSettings);
}
});
$('.editable').editable({type : 'markitup'});
This works, but it submits as html. I was trying to use wmd as there's an option for output which maintains the markdown text as is, but haven't been able to get that to fly. Thanks.
Assuming the textarea contains markdown formatted text, you should be able to grab the contents before form submit with $('.editable').text(), and store it in another hidden field, but you'd have to ensure that you get to the contents before markitup transforms them.
If you really just want to store markdown, you'd be better not to use markitup, and just leave it as simple markdown in a text view, then translate it yourself to html for display with one of the libraries available like rdiscount etc.

Resources