So I've been playing around with quill for a day or two. Currently building a website to learn more about javascript and ajax. But the formatting using quill isn't really working that smooth..
I started to read a little here but those solutions didn't get me that far.
I'm appending the result to a hidden textarea. Here I got 2 options. Taking the entire "#editor" element - Which works the best. It gives me the correct formatting and everything.
Problem is that I'm getting "Everything" - Including the tooltip div, so the posted information comes with an input box as well as the "ql classes".
So I tried to add "ql-editor" as well and if I do that, I get the correct text without the divs - But the formatting is lost instead..
Anyone know what I'm doing wrong?
Code:
<div class="content-div">
<div class="article_div">
<h2>Add new article</h2>
<form action="test.php" method="post" id="news_box">
<div id="editor"></div>
<textarea name="test" style="display:none" id="hiddenArea"></textarea>
<input type="submit" value="Done">
</form>
</div>
</div>
</div>
</div>
<script src="https://cdn.quilljs.com/1.3.6/quill.js"></script>
<script>
var quill = new Quill('#editor', {
theme: 'snow'
});
</script>
<script>
$("#news_box").on("submit",function(){
$("#hiddenArea").val($("#editor .ql-editor").html());
})
</script>
I'm soooo sorry for taking up anyone's time..
Found a solution..
After posting the info to the php page - I added a variable.
<?php
$news_text = "<pre>";
$news_text .= $_POST['test'];
$news_text .= "</pre>";
echo $news_text;
?>
Related
I have a form that originally I decided to wrap using a div:
<div class="formWrap">
<input class="desc" name="newdescription[]" value="" />
</div>
And I add some fields dynamically:
newDesc = $('.desc:first').clone();
$(newDesc).appendTo('.formWrap');
Up to here, everything was working like a charm, but later I changed my mind and decided to make it a form as I won't be using AJAX anymore but instead I'll have the form submit to a next page.
<form class="formWrap" type="post" action="nextpage.php">
<!-- Some inputs -->
</form >
As soon as I changed the div into a form, I couldn't append anymore, if I put it back to a div it works.
A solution that I found was leaving the div and wrap everything into a form. But even if it is a solution I am still curious as for why I can't get it to work directly with a form.
<form type="post" action="nextpage.php">
<div class="formWrap">
<!-- Some inputs -->
</div>
</form >
I've been reading and I don't find any restrictions as to not being able to append to a form, so I am a bit lost now. Any Ideas?
If anybody gets the same error, this might help.
It took a while to find the answer, but I found the error. I realized that the form was inside a form, obviously a huge error!
I guess Jquery prevents from appending into a form that is inside another form.
<form>
.
.
.
<form class="formWrap" type="post" action="nextpage.php">
<!-- Some inputs -->
</form >
.
.
.
</form >
If you can't append into a form, most probably it is a child of another form.
Here is a fiddle showing how it doesn't work:
https://jsfiddle.net/uaeh1kjr/1/
And as #Eddie mentioned in his comment, this one works, with only one form: https://jsfiddle.net/uaeh1kjr/
Well, i'm very new to Javascript and PHP, and I have a problem.
The idea: I want to do some post area, where in a single PHP page people will fill a form and it will create a little bootstrap panel. Don't worry about multiple pages, it's like a... wall.
Example:
<div class="col-sm-6">
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title">My message</h3>
</div>
<div class="panel-body">
<h6>This is a test!</h6>
</div>
</div>
</div>
I don't know exactly how to do this. What i think is that in another page, there will be a form receiving the html contents for the panel title and body and then the PHP code will create html code [not a file] using this text and will put them in another file.
EDIT: As you can see in the comments, i'll have to use PHP and mySQL. I'm still not sure on how to do that.
Okay, i made this for you. The following is just for give you a start, the code is not correctly written, but it will give you a way to start your "project".
Firstly, create your database for storage your post, as follow :
TABLE_POST
title
content
date
autor
Then wall.php :
Start your file by getting with a query, all existing post in your database :
var post_list = "select id, pseudo, title, date, autor from table_post";
Once you have it, display it as you want :
<div>
foreach (post in post_list) {
echo "<div>";
echo "<h1>".post["title"]."</h1>";
echo "<p>".post["content"]."</p>";
...
echo "</div>";
}
</div>
In an other page, you can have your form :
form.php
<form id='myform' method='post' action='add_post.php'>
<input type='text' id='title'/>
<input type='text id='content' />
<input type='text' id='autor' />
<input type='submit' value='Post it !'>
</form>
And in an other page, you can have the function to insert in the database :
add_post.php
insert into table_post VALUES ($_POST["title"], $_POST["content"], NOW(), $_POST["autor"]);
I repeat, i just give a structure for your achievement, i didn't provide a correct syntaxe of the code.
Hope it can help you
I'm testing a page I made in PHP for HTML injections, but it's not working the way I expected.
I'm trying to insert
<div onmouseover="alert(1)" style="position:fixed;left:0;top:0;width:9999px;height:9999px;">
</div>
inside a textarea. Server-side, I just want to display $_GET with a var_dump for now but it doesn't even get to that: when I click the button it just brings me back to the homepage and #3377832596384266514 is added to the URL. I don't get any error in PHP so maybe it's a server issue (Apache 2.4).
I'm guessing some part of the stack is being defensive, like when you add javascript: to a URL and the browser gets rid of it, but I don't know where to look. I've also tried
<script>alert(foo);</script>
and other variations but then the < and some other characters are stripped.
test.php
<!doctype html>
<head>
<meta charset="utf-8">
<title>Test</title>
</head>
<body>
<form method="get" action="select.php">
<p>
<label for="select">Words
<textarea id="select"
name="select"
cols="50"
rows="1"
maxlength="100"
required
autofocus></textarea>
</label>
</p>
<p>
<button>Send</button>
</p>
</form>
</body>
</html>
select.php
<?php
var_dump($_GET);
Edit: textarea instead of input.
Edit: added all the code.
Change the form method from GET to POST.
GET is possibly causing an issue with how the server handles certain markup in the URL.
OP verified this resolved the issue.
Input tags can't have any content, that's why you can set it as an self-closing element <input />
maybe you need another approach
I've been trying to integrate ckeditor in my php website, and I've encountered the following issue.
Essentially, the content in ckeditor wouldn't appear in the $_POST variable after submitting the form.
I looked the issue up and apparently one has to update the form field with a small piece of code.
So I wrote the corresponding script and linked it to the submit button in order to get the result I want, but $_POST still shows up as empty.
I'm inexperienced with Javascript so the error probably lies there. Any ideas?
cktest.php:
<!DOCTYPE html>
<html>
<head>
<title>A Simple Page with CKEditor</title>
<!-- Make sure the path to CKEditor is correct. -->
<script src="http://localhost/ECLIPSEPHP/ckeditor/ckeditor.js"></script>
</head>
<body>
<form action = <?php echo $_SERVER['PHP_SELF']
?>>
<textarea name="test" id="test" rows="10" cols="80">
This is my textarea to be replaced with CKEditor.
</textarea>
<input type = "submit" name = 'submitButton' id = 'submitButton' value = 'Submit'>
<script>
// Replace the <textarea id="test"> with a CKEditor
// instance, using default configuration.
CKEDITOR.replace( 'test' );
</script>
<script type = "text/javascript" src = "http://localhost/ECLIPSEPHP/js/update.js"></script>
</form>
</body>
</html>
<?php
var_dump($_POST);
//echo $_POST['test'];
?>
The javascript supposed to handle the onclick event :
function updateAllMessageForms()
{
for (instance in CKEDITOR.instances) {
CKEDITOR.instances[instance].updateElement();
}
}
var submitButton = document.getElementById('submitButton');
submitButton.onclick = updateAllMessageForms;
There are quite a lot of problems with that code. The first thing to check is to add a method to that form tag: method="post".
See what <form action = <?php echo $_SERVER['PHP_SELF'] ?>> renders. It looks like it could be a wrong. I'm guessing it should be more like <form action="<?php echo $_SERVER['PHP_SELF'] ?>">.
Don't use ' for HTML attribute delimiters, use " instead: 'submitButton' --> "submitButton".
If you edit the updateElement a little: CKEDITOR.instances[instance].updateElement(); alert(1); - do you see the alert? If not, that code is not being called and you need to edit it so that it is.
Don't add spaces between your attribute name, the equals symbol and the value. That looks very strange and could be interpreted wrong or it could send Internet Explorer into quirks mode. Try to change this style: type = "submit" to type="submit" and keep up with that style.
Remember that it's often a good idea to look at the Rendered source in the browser to see what the browser actually gets. Happy coding!
I am using TinyMce html editor for make my posts body...with a hard try I finally could to setup the tinimce.init() function and apear the editor face ..
Now my serious problem is getting the tinymce textarea content(words , sentences , symbols ,...) . I am newbie in javascript so if it is possible with php I will appreciate you to help me in that way.
and if there is no way so how can I get it in javascript .
it's my tinymce textarea:
<form action='post.php' class = 'form-group' name = 'myform' id = 'myform'>
<textarea class='tinymce' id='tinyContent' name='tinyContent' ></textarea>
<input type='submit' value='create post'>
</form>
and in my post.php page:
$body=$_POST['tinyContent'];
print_r(stripslashes_deep($body));
but there is nothing