I newly tried to use TinyMCE in my website but the problem was that by very simple implementation of it in very basic page mentioned in the TinyMCE website I got unexpected result. With the following code the browser only display the large blank area with only a save button.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<head>
<title>TinyMCE Test</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<!-- OF COURSE YOU NEED TO ADAPT NEXT LINE TO YOUR tiny_mce.js PATH -->
<script type="text/javascript" src="../jscripts/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
mode : "textareas"
});
</script>
</head>
<body>
<!-- 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>
</body>
</html>
Could anyone help me what the problem is with the code and the page showed in browser. I can say that I got the same result with different browsers.
Please put all tiny mce library files
it will work when all files are there.
please download latest tiny mce here
http://www.tinymce.com/tryit/full.php
Related
I testing send and receive data to php file with jQuery and I have an issue with IE(Im using IE9 but I checked with IE8 and IE7)
when I click in on of my div I send to the server an "ID" and the PHP file return the answer back, its work and the jQuery is showing the result in other Div and in alert msg.
The issue start when i change the code in the received php file, if I click again in one of my divs, the jQuery showing the same msg even I change the code and the replay msg is different now.
This problem solved when I close and reopen the IE.
This issue doesn't happen with firefox and chrome, does anyone have any idea ?
html file:
<!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" xml:lang="en">
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$('.user').click(function(){
var id_value = $(this).data('friendid');
$.get('test1.php', {id: id_value}, function(data) {
$('#show').html(data);
alert(data);
});
})
})
</script>
</head>
<body>
<div class="user" data-friendid="1">
<img src='webimgs/nopf.jpg' alt="test" />
<h4> fullname</h4>
<br />
</div>
<div class="user" data-friendid="2">
<img src='webimgs/nopf.jpg' alt="test2"/>
<h4> fullname</h4>
<br />
</div>
<div id="show" style="color:red">
</div>
</body>
</html>
and the PHP file:
<?php
if ($_GET["id"]==1) { echo "you choose number is " . $_GET["id"].", thanks." ; }
?>
Thank to "Boaz" I use $.ajaxSetup({cache: false}) and its fix the issue
jQuery .get method can be cached depending on browser setup. If you use the .post method it will prevent caching of data on the browser side.
Referenced from http://www.sitepoint.com/key-differences-post/
Characteristics of GET:
Use GET for safe actions and POST for unsafe actions.
GET requests can be cached
GET requests can remain in the browser history
GET requests can be bookmarked
GET requests can be distributed & shared
GET requests can be hacked
iv downloaded a HTML 5 Lightbox from here: http://html5box.com/products.php to display a video within it. Im happy with the player but is a necessity for the player to open upon entry of the site instead of clicking the 'bg.jpg' picture (which it is at the moment).
The main html page code is here:
<!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>NBC Uni</title>
<script type="text/javascript" src="html5lightbox/jquery.js"></script>
<script type="text/javascript" src="html5lightbox/html5lightbox.js"></script>
</head>
<body>
<div align="center"><a href="video.mp4" class="html5lightbox" data-width="720" data-height="404" ><img src="bg.jpg" width="1023" height="820" /></a></div>
</body>
</html>
any help is much appreciated!
thanks
You can simulate the click on the img with jquery:
$(document).ready(function(){
$("#imgvideo").click();
});
You have to put the id="imgvideo" to the image
This should work.
$(document).ready(function() {
$('.html5lightbox').trigger('click');
})
I've combed the internet for a few hours and still cannot make this simple example work. I hope somebody can assist me. I'm trying to use Javascript to display the contents of a php file. The display should be refreshed often as ultimately it will be used to display text matches from a MySql db that match the characters entered in a search bar (similar to Google's search bar). I'll use setinterval for that but I am not there yet. My issue is that I have minial javascript/AJAX experience and just cannot make it work. I've dumbed it down to a bare bones request and still cannot make it work. Please suggest what isn't working:
The index.html where the content should be viewable is:
<!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="/js/jquery-1.3.2.min.js"></script>
</head>
<body>
<script type="text/javascript">
$().ready(function() {
$("#dynamic").load("blasty.php");
});
</script>
<div id="dynamic"></div>
</div>
</body>
</html>
And blasty.php contains:
<?php
echo "hello cruel world!";
?>
Thanks in advance!
Make sure your blasty.php file is on the same domain.
Also, to help debug javascript, right click in Chrome or Firefox and go Inspect Element. Then go to the Console window and it will display most errors.
I also recommend this youtube video about javascript. I it helped me bridge the gap on some javasrcipt gotchas. http://www.youtube.com/watch?v=ljNi8nS5TtQ
Here is a link about debuggers: https://developers.google.com/chrome-developer-tools/
As #Explosion Pills said, FireFox's Firebug is another great option. I will use both to help debug javascript. Firebug is nice because under the Net tab it will display the acutal http requests as they happen in the background, with the params, response, header info, etc.
<!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.9.1.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {
$("#dynamic").load("blasty.php");
});
</script>
<div id="dynamic"></div>
</div>
</body>
</html>
You are missing the document variable in the $().
<script type="text/javascript">
$(document).ready(function() {
$("#dynamic").load("blasty.php");
});
</script>
Visually that's the only issue I see.
I use $.get instead of $.load.
Try something like this:
$.get("blasty.php",
{ nbRandom: Math.random() },
function(data){
$("#dynamic").html(data);
});
nbRandom is to prevent caching in IE.
Use Firebug to make sure there is a response from the AJAX and go from there.
I have a php based website. As in, all of the pages html is output via php.
Here is a simple example:
<?php
ob_start();
$pageStart = '
<!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>MY WEBSITE PAGE</title>
</head>
<body>
<p>CONTENT</p>
</body>
</html>
';
echo $pageStart;
exit;
?>
What i would like to do is make use of some jquery in this page.
So naturally my first attempt was to include the script inside of the php variable like so:
<?php
ob_start();
$pageStart = '
<!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">
var datefield=document.createElement("input")
datefield.setAttribute("type", "date")
if (datefield.type!="date"){ //if browser doesn't support input type="date", load files for jQuery UI Date Picker
document.write('<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />\n')
document.write('<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"><\/script>\n')
document.write('<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"><\/script>\n')
}
</script>
<script type="text/javascript">
if (datefield.type!="date"){ //if browser doesn't support input type="date", initialize date picker widget:
jQuery(function($){ //on document.ready
$('#birthday').datepicker();
})
}
</script>
</head>
<body>
<p>CONTENT</p>
</body>
</html>
';
echo $pageStart;
exit;
?>
Now, I use dreamweavers code editor, which due to the syntax highlighting feature, will point out the masses of syntax errors produced in this.
So i at first attempted to slash out these errors. This failed.
So i tried changing the "s to 's, and visa versa, until the errors were gone. This failed too as it seems the script will not validate in this manner.
So i read a few tutorials, and found this one:
JavaScript and PHP may each bring great potential to any Web development effort, but they don't always play nice together. Read about the problems.
And the way I understand it, is that you'd need to include the js rather than have it as part of your php directly.
So have a file called page.php and another called jquery.php. So I decided to try and modify this idea to suite my problem.
So i started with something like this - index.php:
<?php
ob_start();
$pageStart = '
<!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>MY WEBSITE PAGE</title>
'. include $_SERVER['DOCUMENT_ROOT'] . '/../../path/to/include/datepicker.php'.'
</head>
<body>
<p>CONTENT</p>
</body>
</html>
';
echo $pageStart;
exit;
?>
And - datepicker.php:
<script language="Javascript">
var datefield=document.createElement("input")
datefield.setAttribute("type", "date")
if (datefield.type!="date"){ //if browser doesn't support input type="date", load files for jQuery UI Date Picker
document.write('<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />\n')
document.write('<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"><\/script>\n')
document.write('<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"><\/script>\n')
}
</script>
<script language="Javascript">
if (datefield.type!="date"){ //if browser doesn't support input type="date", initialize date picker widget:
jQuery(function($){ //on document.ready
$('#birthday').datepicker();
})
}
</script>
Now there are no syntax errors in either page, great... So I try it, half expecting things to finally just work...
Nope... Fatal Error: failed to open stream: No such file or directory blah blah. This error relates to the include that i added. So okay, even though the file is there, it is not being validated as php because there are no opening and closing php tags.
So I add them... Annnd... A page full of syntax errors again!
So my question is this:
Could some please share some knowledge and explain to me roughly how this process actually works. Whats the deal with all the syntax errors, and how are you supposed to go about a task like this?
I believe it is possible, and yes it would ceratinly be easier if i was not outputting the entire html via php. But this is a simple example and my actual design is alot more complex. It requires for the different parts of the page to be broken up into variables, in order to place those bits and peices when needed, dynamically.
Any input, suggestions, or insight would be greatly appreciated; and any links to pages or tutorials that cover this would also be greatly appreciated.
Thank You!!
All you need to do to use jQuery with PHP is to include the jQuery javascript file in your HTML document in the head tag. I actually use PHP along with jQuery all the time. And this is how I do it. In your code above, it looks like you have some escaping issues with your code. And it also looks like you want to hold the header of the page in a PHP variable then print it out. You don't have to do all that. Just put the plain text in your PHP file without any php tags and it will work. Also, you are using an old version of jQuery. Should probably use the latest version. But, if you need it stored in a PHP variable so that you can print it out, do this:
SO, here is some code to get you started.
<?php
$pageStart = '<!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>MY WEBSITE PAGE</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function(e) {
$("#date").datepicker();
});
</script>
</head>
<body>
<input type="text" id="date" name="date" />
</body>
</html>';
print $pageStart;
?>
<head>
<script type="text/javascript"
src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// javascript & jquery code
// even better would be if you would put client code in separate file!!!
});
</script>
</head>
<body>
<?php
echo "bla bla bla";
?>
</body>
and +1111 to # Heera's comment
You're missing the basics's.
Use Heredoc. Thousands of syntax errors will be gone.
See the heredoc version of your pages,
http://pastie.org/3412925
http://pastie.org/3412929
http://pastie.org/3412935 // Here you have used include to contact. include does not return anything. It just includes. So Its changed differently.
I think it should be
. (include ($_SERVER['DOCUMENT_ROOT'] . '/../../path/to/include/datepicker.php')) .
otherwise php will try to include all the stuff after until the l is reached (tags will be interpreted as part of the file name).
also, in terms of the php code, after the file is included (on success), the include statement translates into 1 as a number, instead of the content of the file.
use
<? $abc <<<qwerty
...
...
...
qwerty;
return qwerty;
?>
for all the files that you want to include
I've got a problem. I have got two servers on first I've got my whole db with login page, and on secoud one I've got my WWW page. Those servers are on diferent domains. I build site, where is 2 iframes, each iframe respectively from first and secoud server. When I submit form the results are opening in new tab instead of place results in the secound one. Belowe is code. I will add only that, on IE it works good.
secound server
index.html (this is the main frame)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>New Web Project</title>
</head>
<body>
<iframe name="vforms1" src="vforms.php" width="200" height="200"></iframe>
<iframe name="map1" src="http://xxx.xxx.xxx/map.php" width="200" height="200"></iframe>
</body>
</html>
vforms.php
<?php
if (isset($_POST["variable"])){
$var2 = $_POST["variable"];
echo $var2;
}
else echo 'waiting';
?>
first server
map.php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Test page</title>
</head>
<body>
<form action="http://xxx.xxx.xxx/test/vforms.php" method="POST" target="vforms1">
<input type="hidden" name="variable" value="send"/>
<input type="submit" />
</form>
</body>
</html>
I am working on that since last friday, and try to do everything! Now it's realy drive me crazy! Can anybody help me?
Cheers!
Because it is on a different domain, there are cross domain policies in place. The <form> does not know about the other iFrame, and cannot access it. Neither can it access it's parent.
So, there really is no option on how to fix it, other than remotely connecting to the database with php, and removing the iFrames all together (which is a bad thing in the first place)
Are you sure you should be using the frameset doctype inside a framed document? You may be rendering the target attribute invalid.