How can I send wysiwyg editor code to php by ajax - javascript

I have nicEditor wysiwyg editor in my page (textarea tag) .
I want to send the output of the code editor to php page by ajax , this is my request .

You can do a php require to include any type of file:
textarea.html:
<textarea>
//htmlcode
</textare>
page.php:
<?php
//php code
require "textarea.html"
?>
is that what you are talking about?
Or are you refering to using javascript to get html code from the file?

i don't know exactly how nicEdit works, but according to nicedit.com, it just changes all <textarea>s to rich html editors. I'm guessing you can still refer to the textareas the same way, which would by to do what #atlavis said:
<textarea id='text1'></textarea>
<script>
var textarea document.getElementById('text1').value;
textarea = escape(textarea);
//now send textarea to the php with a XHR request
</script

Related

How to make "<" not interpreted in .html() using jQuery?

I have to generate a php file from the content of a div, this is working. But characters like < and > are blocking the generation.
For example :
<div id="test">
<p> I want to have this in my php file <?php echo "tatata" ?> </p>
</div>
I'm using the function $("#test").html() to get the content before to send it to a php file using ajax.
If I do an alert of this, I get the correct data but when I open the php file generated, I only have :
<div id="test">
<p> I want to have this in my php file
I've tried to use &#60 instead of <
I dont know if the problem comes from jQuery or the php code I call with ajax.
But I'm sure the problem is due to the < and > characters, because when I remove them, it works correctly.
Thanks for your help !
The suggestion of #treyBake is working perfectly.
As he suggested in the comments, the function str_replace solved the problem. I use it just before to create my php file and it's working.
Thank you #treyBake ! :)
Have you tried using htmlentities?
e.g.
echo htmlentities('<sometext>');

Dom Document - Scrape data

I have a jQuery script embed into a webpage that I am scraping with Tampbermonkey and It works well but it is posting back to my server the entire body of the html.
Embed into an html page that I am scraping has this code:
jQuery(document.body).append("<iframe id='somenewtab' name='somenewtab' />");
jQuery(document.body).append("
<form action='https://example.com/test.php' target='somenewtab' id='form_submit_data' method='post'>
<input type='hidden' name='data' id='submit_data'><input type='submit' value=''></form>
");
jQuery("#submit_data").val( btoa(unescape(encodeURIComponent(document.body.innerHTML) )));
jQuery("#form_submit_data").submit();
The script grabs all the html and then posts it to php script where it parses the data.
test.php
$data = base64_decode($_POST['data']);
$dom = new DOMDocument();
$dom->loadHTML($data);
$select = $dom->getElementById('portfolio');
My question is, is there a way to only post the body of the html without all of there head information or better yet only post back whats inside the getElementById('portfolio') tag? The data in the id tag is the only data I need to parse.
Currently it posts everything in the html webpage and the server is getting bogged down with the POST limit size.
you can use wrapper based on "simplehtmldom" project available on Sourceforge and get the text/html of the dom element, and can post it.
https://github.com/sachinsinghshekhawat/simple-html-dom-parser-php

Insert code with JS just like echo in php

I want to get some code snippets from a PHP server to be "injected" in HTML. Basically when I open page.php I get some text like "_off".
The injection works with this code, however I can't use php in this html since it is local.
<img src="images/test
<?php
{ echo "_off"; }
?>
.jpg">
JavaScript seems to be the logical step. But if I just enter this at the position where I want the text of course it doesn't work:
<script type="text/javascript"> $.get( "page.php", function( data ) { document.write(data); } ); </script>
Any ideas?
You need to use $('#someElement').html(data) or $('#someElement').text(data) if you want to write the data to a specific place on the page. You should avoid using document.write
Here is a fiddle to demonstrate: https://jsfiddle.net/yd9mx4d3/

Loading a HTML file into ACE Editor PRE Tag

There is a (on the server) locally stored HTML file which i need to show to user and allow use to make changes to it and save it. (Something like template file editor in wordpress).
For this I am using ACE Editor.
My javascript code:
$(document).ready(function() {
var editor = ace.edit("editor");
editor.getSession().setMode("ace/mode/html");
editor.setTheme("ace/theme/chrome");
editor.setValue("<?php echo addslashes(file_get_contents("abc.html")); ?>");
editor.gotoLine(1);
});
Code in file abc.html
My Problem: Although I have used addslashes, there are some characters that cause problem.
Isn't there a method to directly supply a file to ACE Editor?
Is there any other such editor which can directly be supplied a file name to open?
EDIT: SOLVED!
Instead of passing file text via setValue() function, I directly printed text within PRE tag
<pre id="editor"><?php echo htmlentities(file_get_contents($input_dir."abc.html")); ?></pre>
It worked.
the correct escaping is
htmlspecialchars(addslashes(file_get_contents("abc.html")));
editor.setValue("<?php echo addslashes(file_get_contents("abc.html")); ?>");
is wrong. abc.html is out of php code. syntax error
editor.setValue('<?php echo addslashes(file_get_contents("abc.html")); ?>');
this could work. have not tested

Populate input type textarea with static content (without ajax call)

I have a textarea in my html page and I wish I could do this:
<textarea id='myTextArea' src='data.txt' />
==============
Unfortunately I can't do that. "src" does not work for a textarea.
So I have to recur to some javascript to make an ajax call (http get for data.txt) and then populate myTextArea.
Is ajax the only way to resolve this ?
Many Thanks
A better option might be to output the content of that file via a server-sided language. Since the content in static, the extra HTTP request isn't really necessary.
In PHP, you could do it like this:
<textarea id='myTextArea'><?php include "data.txt" ?></textarea>
Edit: As Quentin noted, you may want to parse the included file before injecting it into the HTML, especially if the file included can easily be modified by a third party. Functions like htmlspecialchars can be used to validate the file content accordingly:
<textarea id='myTextArea'><?php htmlspecialchars(file_get_contents("data.txt")); ?></textarea>
This should work:
<script>
function loadFile()
{
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET","foo.txt",false);
xmlhttp.send();
var value = xmlhttp.responseText;
document.getElementById("myTextarea").value=value;
}
</script>
And html:
<body onload="loadFile()">
<textarea id="myTextarea" cols="20">
</textarea>
</body>

Categories

Resources