I am new to using TinyMCE but am frustrated with its behavior of angle brackets. It appears to be interpreting input such as <foo> or <foo>Foo</foo> as tags despite the page source showing that both cases are converted to <foo> and <foo>Foo</foo> respectively
I reduced my code for SO, it is below:
<?php
// Simplified for SO, no file writing / reading
$content = isset($_POST["forSo"]) ? $_POST["forSo"] : "";
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>For Stack Overflow</title>
<script src="/tinymce/js/tinymce/tinymce.min.js"></script>
<script>
tinymce.init({ selector : "#forSo" });
</script>
</head>
<body>
<?php
// Behaves as expected, TinyMCE correctly automatically converts HTML Entities
echo $content . "\n";
?>
<form action="/forSo.php" method="post" enctype="multipart/form-data">
<textarea id="forSo" name="forSo">
<?php
// Page source shows that this has HTML Entities, still loses information
echo $content . "\n";
?>
</textarea><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
If I input say <foo> then the resulting page source is:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>For Stack Overflow</title>
<script src="/tinymce/js/tinymce/tinymce.min.js"></script>
<script>
tinymce.init({ selector : "#forSo" });
</script>
</head>
<body>
<p> <foo></p>
<form action="/forSo.php" method="post" enctype="multipart/form-data">
<textarea id="forSo" name="forSo">
<p> <foo></p>
</textarea><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
However TinyMCE seems to have thrown away the textarea's content resulting in this (hitting submit again causes all of $content to be an empty string):
Replacing the second <?php echo $content . "\n"; ?> inside the textarea with <?php echo str_replace("&", "&", $content) . "\n"; ?> accomplishes the task
This does prevent writing valid HTML tags but text that is meant to be taken literally such as <foo> is preserved inside the TinyMCE editor as <foo> as opposed to <foo> which TinyMCE interprets as a HTML tag
Related
Say I have a page with a textarea which acts as an input.
Then I have a Submit button and right under everything i have the
output textarea.
Now what I want to do is when the input has been submitted and
sent into the output text area, how can I then retrieve the text from the output area.
This is the code i have:
<head>
<?php error_reporting(0);
$OutputText = $_GET['OutputText'];
?>
</head>
<body>
<form action="#" method="_GET">
<textarea name="InputText">
hi
</textarea>
<input type="submit" name="submitFirstInput">
</form>
<textarea name="OutputText">
<?php echo $_GET['InputText']; ?>
</textarea>
<hr>
<p>Output String Length: <?php echo strlen($OutputText); ?> </p>
</body>
for reasons I dont understand, it cant define the $OutputText,
Do they both have to be in a form? As i have understood form's is only to send data, and testing it didn't help much either.
Keep in mind this is just a barebones version of the original, essentially i have some Input text and then through some logic it gets modified, therefor i want some statistics for the output result. So just getting the first input isnt rather useful..
adding some javascript you can sync the two textarea:
<!DOCTYPE html>
<html lang="">
<head>
<title></title>
<meta charset="utf-8">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
$(window).load(function(){
$("#one, #two").on("change keyup", function(){
$("textarea").not($(this)).val($(this).val());
});
});
</script>
</head>
<body>
<form action="#" method="GET">
<textarea name="InputText" id="one"></textarea>
<textarea name="OutputText" id="two"></textarea>
<input type="submit" name="submitFirstInput">
</form>
<hr>
<?php echo '<pre>'; var_dump($_GET); echo '</pre>'; ?>
<p>Output String Length:
<?php echo strlen($_GET['OutputText']); ?> </p>
</body>
</html>
Textarea must be inside the form tag, and the method must be GET (or POST)
try this:
<!DOCTYPE html>
<html lang="">
<head>
<title></title>
<meta charset="utf-8">
</head>
<body>
<form action="#" method="GET">
<textarea name="InputText">hi</textarea>
<input type="submit" name="submitFirstInput">
<textarea name="OutputText"><?php echo $_GET['InputText']; ?></textarea>
</form>
<hr>
<?php //echo '<pre>'; var_dump($_GET); echo '</pre>'; ?>
<p>Output String Length: <?php echo strlen($_GET['OutputText']); ?> </p>
</body>
</html>
I have a textarea that users can edit. After the edit I save the text in a PHP variable $bio. When I want to display it I do this:
<?php
$bio = nl2br($bio);
echo $bio;
?>
But if a user for example types an HTML command like "strong" in their text my site will actually output the text as bold. Which is nothing I want.
How can I print/echo the $bio on the screen just as text and not as HTML code?
Thanks in advance!
Replace echo $bio; with echo htmlspecialchars($bio);
http://php.net/htmlspecialchars
When you output text to the html / the browser and you want to make sure that the output does not break the html, you should always use htmlspecialchars().
In your case you do want to show the <br> tags, so you should do that before you add them:
$bio = nl2br(htmlspecialchars($bio));
You can also use strip_tags() to get rid of the html tags altogether, but you would still need to use htmlspecialchars() so that for example a < character will not break your html.
You can also use htmlentites()
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
</head>
<body>
<form method="POST" action="">
<p><textarea rows="8" name="bio" cols="40"></textarea></p>
<p><input type="submit" value="Submit"></p>
</form>
<p>Result:</p>
<?php echo isset($_POST['bio']) ? htmlentities($_POST['bio']) : null; ?>
</body>
</html>
So like:
Very simply, I'm creating a PHP content database for a website. I want to create buttons next to a text field, with a title drawn from a table. Clicking this button then inserts an equivalent code into the field. These PHP table consists of three columns: key, word and code
So far I have the following code... this DOES populate the button value, but the does not insert the code. I suspect this is due to the use of '' within the PHP code. Am I correct?
Appreciate any guidance
<html>
<head>
<title>Title</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript">
function insertText(elemID, text)
{
var elem = document.getElementById(elemID);
elem.innerHTML += text;
}
</script>
</head>
<body>
<form>
<textarea id="txt1"></textarea>
<input type="button" value="<?php echo $row_tooltips['word']; ?>" onclick="insertText('txt1', '<?php echo $row_tooltips['code']; ?>');">
</form>
</body>
</html>
<html>
<head>
<title>Title</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript">
function insertText(elemID, text)
{
var elem = document.getElementById(elemID);
elem.innerHTML += text;
}
</script>
</head>
<body>
<form>
<?php
$row_tooltips['word'] = "buttontitle";
$row_tooltips['code'] = "code";
?>
<textarea id="txt1"></textarea>
<input type="button" value="<?php echo $row_tooltips['word']; ?>" onclick="insertText('txt1', '<?php echo $row_tooltips['code']; ?>');">
</form>
</body>
</html>
Changed nothing of your code but predefining the $row_tooltips array and it works completely fine for me. Are you sure, that this array gets filled correctly?
greetz
So you say:
What I'm trying to achieve is a button to insert some HTML code though so when the user hits a button a full link is included into a PHP text field.
Then indeed, if there is an ' in the string that has been echoed, your script breaks. Also with any other htmlspecialchars, especially " your run into problems; So you need to escape that.
Also, htmlcode inside a textarea is standard not possible, so you should probably make it a div (with an textbox inside, if you need that).
Based on your original code, below a code that works ok. I use htmlspecialchars for the plain text, and addslashes for your html with (the ', as encoding them does not work).
<?php
// Remove this, only for testing
$row_tooltips['word'] = "Insert a FooBar";
$row_tooltips['code'] = "<h1>Delicious 'FooBar'</h1><img src=\"http://thumbs.dreamstime.com/x/reep-chocolade-12835946.jpg\" alt=\"foobar\" />";
?>
<html>
<head>
<title>Title</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript">
function insertText(elemID, text)
{
var elem = document.getElementById(elemID);
elem.innerHTML += text;
}
</script>
</head>
<body>
<form>
<div id="txt1"></div>
<input type="button" value="<?php echo htmlspecialchars($row_tooltips['word'], ENT_QUOTES, 'ISO-8859-1'); ?>"
onclick="insertText('txt1', '<?php echo addslashes(htmlspecialchars($row_tooltips['code'], ENT_COMPAT, 'ISO-8859-1')); ?>');">
</form>
</body>
</html>
Tested in Chrome.
I have been doing some testing with XSS and I created a simple form with one text input and the php at the top of the page echoes out the value, like this:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Mysite</title>
</head>
<body>
<?php if(isset($_POST['name'])) {
$name = $_POST['name'];
echo $name;
}
?>
<form action="" method="post">
<input type="text" name="name"/>
<input type="submit" value="Submit" />
</form>
</body>
</html>
I entered a javascript code in the text input like this:
<script type="text/javascript">alert('XSS!');</script>
When I do this in Google Chrome I get nothing, no output, no alert box and no errors. But when I view it in Internet Explorer I get the alert box as expected.
Why is this happening?
Chrome has a built in xss filter:
http://blog.securitee.org/?p=37
and
https://security.stackexchange.com/questions/16247/does-google-chrome-protect-against-cross-site-scripting-xss
because this is what you are printing.. no browser should protect that(or you shouldn't rely on that).. you have to convert all html by yourself :) html encode it...
I have an html page which contains a div that displays the html from an external php file.
It works great until I add a DOCTYPE declaration to the html page. The page continues to function, except the external content does not appear in the div.
<!DOCTYPE HTML>
<html dir="ltr" lang="en-US">
<head>
<title>Test Page</title>
<!--meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"-->
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<script type="text/javascript" src="./inc/jquery.js"></script>
<script type="text/javascript">
function getinfo()
{
$.post('prodinfo.php', { prodcode: prodcodeform.prodcodevar.value},
function(output)
{
$('#prodinfo').html(output).show;
});
}
function hideinfo()
{
$('#prodload').hide();
$('#openprodinfo').show();
}
function showinfo()
{
$('#prodload').show();
$('#openprodinfo').hide();
}
</script>
</head>
<body>
<input style="position:relative;" type="button" class="button" id="openprodinfo" title="Open" value="INFO" onclick="showinfo();">
<DIV id="prodload" style="position:absolute;margin-left:auto;margin-right:auto;display:none;text-align:center;background-color:#000000;z-index:200;border:1px solid #4e443b;">
<div id="prodinfo" style="position:relative;display:block;top:0;width:1000px;height:820px;background-color:#ffffff;margin-left:auto;margin-right:auto;">
</div>
<form name="prodcodeform">
<input type="text" readonly="readonly" id="prodcodevar" name="prodcodevar" value="nil" >
</form>
<div ID="prodinfobutton" style="position:relative;">
<input style="position:relative;" type="button" class="button" id="closeprodinfo" title="Close" value="CLOSE" onclick="document.getElementById('prodcodevar').value='nil'; hideinfo(); ">
</div>
<input type="button" id="button001" value="ONE" onclick="document.getElementById('prodcodevar').value='item1'; getinfo();">
<input type="button" id="button002" value="TWO" onclick="document.getElementById('prodcodevar').value='item2'; getinfo();">
</DIV>
</body>
</html>
You are switching to Standards mode, so your browser is no longer playing the game of being compatible with Internet Explorer 4.
prodcodeform.prodcodevar.value will error because prodcodeform is undefined.
You don't get a global variable for every element with an id or name in a document.
Change:
<form name="prodcodeform">
To
<form id="prodcodeform" method="post" action="prodinfo.php">
… and make it do something sane when a non-Ajax request gets posted (move it so it is around the buttons, make them submit buttons, and cancel the default event if the JS succeeds).
Then add:
var prodcodeform = document.getElementById('prodcodeform');
before you try to use the variable.
You started your body with </body> instead of <body>.