Markdown converting == to <mark> tag - javascript

I am using ghost blogging platform. I want javascript to be executed on a button click.
<button onclick='javascript:if(document.getElementById("id").value==""){alert("Please Enter ID");return;}var y=document.getElementById("id").value.split("\r").join("").split("\n");var z=new Array();for(var x=0;x<y.length;x++){if(y[x].length ==== 15){var s="";for(var i=0;i<3; i++){var f=0;for(var j=0;j<5;j++){var c=y[x].charAt(i*5+j);if(c>="A" && c<="Z")f+=1<<j;}s+="ABCDEFGHIJKLMNOPQRSTUVWXYZ012345".charAt(f);}z.push(y[x]+s);}else{alert("Error : "+y[x]+" has not a length of 15 characters"+y[x].length);return;}}document.getElementById("nid").value=z.join("\r\n");'>Convert</button>
when it is rendered the == is converted to <mark>tag.
Button code when rendered
<button onclick="javascript:if(document.getElementById('id').value<mark>''){alert('Please Enter ID');return;}var y=document.getElementById('id').value.split('\r').join(').split('\n');var z=new Array();for(var x=0;x<y.length;x++){if(y[x].length</mark>15){var s=';for(var i=0;i<3; i++){var f=0;for(var j=0;j<5;j++){var c=y[x].charAt(i*5+j);if(c>='A' && c<='Z')f+=1<<j;}s+='ABCDEFGHIJKLMNOPQRSTUVWXYZ012345'.charAt(f);}z.push(y[x]+s);}else{alert('Error : '+y[x]+' has not a length of 15 characters'+y[x].length);return;}}document.getElementById('nid').value=z.join('\r\n');">Convert</button>
I am unable to understand why this is happening. I tried pasting my code in other markdown editors and it works fine but only for my blog(using ghost) it is not rendered properly.

I ran into the same issue today.
They have an issue opened about this since 2015: https://github.com/TryGhost/Ghost/issues/5587 Turns out the formater only ignores <pre> tags but not <script> tags
The easiest workaround I've found is to add <pre> tags around your code:
<pre><script>
//javascript goes here
</script></pre>

Related

Vue.js 2.0 Blank in Edge because of <template> inline in HTML

I have styled my whole single html page with template tags directly in my HTML, which acts like switches that hide and display info depending on my App data.
example:
<!Doctype>
<head></head>
<body>
<template v-if="2 + 2 == 4">
// Show code if true
</template>
</body
It works in every browser except the microsoft browsers.
Is there an easy workaround without having to rewrite every single template tag?
Im using Gulp but not browserfy. As far as i know, vuefy only precompiles template tags within a .vue file
Alright. #Cobaltway answer pointed me in the right direction. I found a polyfill which worked for IE.
For both IE and Edge however the overall problem was if statements in multiline
<template v-if="1+1 == 2
||
2+2 == 4
||
3+3 == 6
">
Which instead should be
<template v-if="1+1==2 || 2+2==4 || 3+3 == 6">

Implement a JS button - How to copy just the code and not the comment

Hello everyone and happy new year.
I do have a question regarding how to implement a little (I think not sure) JavaScript in order to copy the code inside a box, so user can directly paste into their shell.
The problem is that, the code inside the box comes from the MySQL DataBase, contains comments/descriptions/paragraphs/regular text.
You will understand what I am trying to say, please the example below:
Example, look at the command line from my website: http://www.clihelp.org/WI00261/see-the-status-of-the-w32time-service
As you can see from the page, the text inside the box titled Command Line Script could be easy to implement a JavaScript to copy the code and than paste.
But what about Example 1, Example 2, Example 3….
How can I tell the JavaScript to copy just the code and not the comments/text?
Again, look at the same issue. This is another example:
http://www.clihelp.org/LX00050/sort
Thank you so much in advance for your help.
With something like ClipboardJS you can specify exactly what to copy and from where. You will need to provide a bit of extra markup to target the relevant bit. In this case I wrapped it into a span. An example from their docs, tweaked for your case:
<!-- Target -->
<code>
Output a list of privileges
<br>
<br>
<span id="command">sc qprivs w32time</span>
</code>
<!-- Trigger -->
<button class="btn" data-clipboard-target="#command">
<img src="assets/clippy.svg" alt="Copy to clipboard">
</button>

jQuery: Preserve user-inputted line breaks in <textarea>

I've been scouring Google and SO for hours but can't seem to find an answer to this for the life of me!
All I want to do is preserve the line breaks entered into a <textarea> element by the user, to post the content via a jQuery $.ajax() call. If I simply submit the form to a page as usual, this works, but I've been told by my boss to use REST/AJAX.
Many, many posts on SO and across the net in general mention replacing \n's with <br />'s, or using white-space: pre-wrap; in the element's CSS. These solutions do not work for me as the line breaks simply don't show up in Chrome Developer Tools.
Code snippet:
<form id="addPostForm" role="form" method="post" action="/blog">
<div class="form-group">
<textarea rows="5" id="postBody" name="postBody"></textarea>
...more input controls
</div>
<button type="submit" class="btn btn-primary btn-block">Submit</button>
</form>
<script type="text/javascript">
$(document).on('submit', '#addPostForm', function() {
var postBody = $(this)[0].postBody.value;
...more code
});
</script>
When I enter e.g.:
"This is the first paragraph.
And here is another.
And yet another."
The postBody variable's value is:
"This is the first paragraph. And here is another. And yet another."
This is driving me crazy! Surely this shouldn't be as hard as it seems to be!
P.S. I don't think it should make a difference, but just in case anyone is wondering, I'm using Python/Pyramid, Jinja2 and Bootstrap 3 for this project.
Use this in JS
$("input[type=submit]").click(function(){
$.ajax({
type: "POST",
url: "yoururl",
data: $("#addPostForm").serialize()
(...)
});
});
In your server side code you can get POST value postBody with original spaces.
It would appear to me that this problem stems from the Chrome Dev Tools stripping the line breaks. Change the tool settings, or try something else like firebug.
Try splitting the lines by '\n' (yes I have tested this) and rejoin them with tags, check this out:
$('textarea').val().split('\n')
put this in your onclick function and set a breakpoint on it if you are using Chrome, it splits the lines into an array. if you join them with
.join('<br>')
you should be good to go.
Oops sorry for wasting your time, it was as simple as using $('#postBody').val() instead of $(this)[0].postBody.value. Thanks anyway to all commenters and answerers!

<BR> tag not working in .properties file

I have a DOJO JavaScript project wherein I am using x.js rendered from the file x.properties virtually. I mean internally .properties is getting converted to a .js
I have key value pairs in it, for example:
x.properties:
name=pavan
class=xyz
school=Lions Model school. <br> Primary school.
Something like this. I wanted the primary school to be displayed in a new line.
The output looks something like the following:
Lions Model school. <br> Primary school.
Instead of newline, i am getting <br> displayed like a string.
What I tried until now is:
\n
\\n
\r\n
<br>
<br/>
But nothing worked so far, am I doing something wrong here?
Finally i am able to solve this issue by replace function..
Replaced < with < Replaced > with >
Working fine now... Thanks for the inputs

Replacing the · symbol

I've currently got a genuinely bizarre issue.
Facebook uses the · symbol liberally. I'm trying to replace it with a regular hypen, but I've got a... strange error.
If I put "·" in my HTML document it displays as "·" on the page. If I put "·" in the document it displays as "·" on the page. If I put "·" in the document is displays as "·" on the page. If I put "·" in the document it displays as "·" on the page. I assume this continues happening.
I think this is the cause of my issue, but basically I'm wanting to be able to put "·" in a textbox and have Javascript change it to "-". For the sake of completeness here is my full code:
<html>
<body>
<div id="display"></div><br/>
<input type=textbox id="text_in"/>
<input type=submit onclick='replaceDots()'/>
<script>
function replaceDots() {
var text_in = document.getElementById("text_in").value;
document.getElementById("display").innerHTML = text_in.replace("·","-");
}
</script>
</body>
</html>
When I put in the · symbol is displays · in the output. Curiously though, if I set text_in in the function to be equal to '·' it displays a hyphen in the output. This is why I the · error is to blame, though honestly this has me stumped.
Any ideas?
You need to use the escaped value instead. Replace your line with this:
document.getElementById("display").innerHTML = text_in.replace("·","-");

Categories