Browser dependent problem rendering WMD with Showdown.js?
- by CMPalmer
This should be easy (at least no one else seems to be having a similar problem), but I can't see where it is breaking.
I'm storing Markdown'ed text in a database that is entered on a page in my app. The text is entered using WMD and the live preview looks correct.
On another page, I'm retrieving the markdown text and using Showdown.js to convert it back to HTML client-side for display.
Let's say I have this text:
The quick **brown** fox jumped over the *lazy* dogs.
1. one
1. two
4. three
17. four
I'm using this snippet of Javascript in my jQuery document ready event to convert it:
var sd = new Attacklab.showdown.converter();
$(".ClassOfThingsIWantConverted").each(function() {
this.innerHTML = sd.makeHtml($(this).html());
}
I suspect this is where my problem is, but it almost works.
In FireFox, I get what I expected:
The quick brown fox jumped over the lazy dogs.
one
two
three
four
But in IE (7 and 6), I get this:
The quick brown fox jumped over the lazy dogs. 1. one 1. two 4. three 17. four
So apparently, IE is stripping the breaks in my markdown code and just converting them to spaces. When I do a view source of the original code (prior to the script running), the breaks are there inside the container DIV.
What am I doing wrong?
UPDATE
It is caused by the IE innerHTML/innerText "quirk" and I should have mentioned before that this one on an ASP.Net page using data bound controls - there are obviously a lot of different workarounds otherwise.
