I was used Ckeditor in my project. It was worked well. I can put picture in texts but with an url. I know that,if I want upload an picture from my pc, I must used CKfinder.
How can I use Ckfinder with Ckeditor?
I use this code to call CKeditor:
protected void Page_Load(object sender, EventArgs e)
{
String StrScript = "CKEDITOR.replace( '" + TextBox1.ClientID + "',{toolbar : 'Full'});";
ClientScript.RegisterStartupScript(this.GetType(), "Ck-Js/ckeditor", StrScript, true);
}
Thanks.
it takes nearly 5 minutes to complete setup:
Download CKEditor and CKFinder.
Put extracted code of both in one folder inside xampp as below.
Create index file (index.html) which will be containing the editor as below code.
<html>
<head>
<script type="text/javascript" src="ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="ckfinder/ckfinder.js"></script>
</head>
<body>
<h1>CKEditor CKFinder Integration using PHP</h1>
<textarea id="editor1" name="editor1" rows="10" cols="80"></textarea>
<script type="text/javascript">
var editor = CKEDITOR.replace( 'editor1', {
filebrowserBrowseUrl : 'ckfinder/ckfinder.html',
filebrowserImageBrowseUrl : 'ckfinder/ckfinder.html?type=Images',
filebrowserFlashBrowseUrl : 'ckfinder/ckfinder.html?type=Flash',
filebrowserUploadUrl : 'ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files',
filebrowserImageUploadUrl : 'ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images',
filebrowserFlashUploadUrl : 'ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Flash'
});
CKFinder.setupCKEditor( editor, '../' );
</script>
</body>
</html>
so your folder structure will be something like this:
htdocs
|_integrated
|_ckeditor
| |_config.js
| |_...
|_ckfinder
| |_config.php
| |_...
|_uploads
|_index.html
Now open file config.php inside ckfinder & make following changes:
function CheckAuthentication() {
return true;
}
$baseUrl = 'http://localhost/integrated/uploads/';
$enabled = true;
$config['SecureImageUploads'] = false;
$config['ChmodFolders'] = 0777 ;
Now open url http://localhost/integrated/ and try uploading image.
I think you want use CKFinder and CKEditor, try this :
Documentation : http://docs.cksource.com/CKFinder_2.x/Developers_Guide/ASP/CKEditor_Integration
http://docs.cksource.com/CKFinder_2.x/Developers_Guide/ASP/FCKeditor_Integration
En Francais : http://creer-un-site.fr/integration-du-formulaire-d-upload-ckfinder-a-l-editeur-ckeditor-202.php
If anyone is still having problems integrating CKFinder with CKEditor, try using KCFinder (http://kcfinder.sunhater.com/) instead.
It has all the same functions as CKFinder, but its free, open source, and much easier to install and setup. (Personally, I was never able to get CKFinder installed properly....)
The installation instructions for KCFinder are here:
http://kcfinder.sunhater.com/install
And the integration instructions are here:
http://kcfinder.sunhater.com/integrate
https://ckeditor.com/ckeditor-4/download/
download ckfinder place it both in single place then
<textarea class="ckeditor" id="editor1"></textarea>
place this code in footer.php or direct on page also
CKEDITOR.replace( 'editor1', {
filebrowserBrowseUrl: 'https://example.com/admin/ckfinder/ckfinder.html',
filebrowserImageBrowseUrl: 'https://example.com/admin/ckfinder/ckfinder.html?type=Images',
filebrowserUploadUrl: 'https://example.com/admin/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files',
filebrowserImageUploadUrl: 'https://example.com/admin/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images'
});
in ckfinder/config.php file open and make some change
$config['authentication'] = function () {
return true;
};
$config['backends'][] = array(
'name' => 'default',
'adapter' => 'local',
'baseUrl' => 'https://example.com/admin/ckfinder/userfiles/',
// 'root' => '', // Can be used to explicitly set the CKFinder user files directory.
'chmodFiles' => 0777,
'chmodFolders' => 0755,
'filesystemEncoding' => 'UTF-8',
);
That's it, it work for me.
If this is helpful for you please rate us me
Related
I have a Cakephp installation on a local wamp in:
c:\wwww\appname
and I have a countdown script in a view:
<script type="text/javascript">
$(document).ready(function()
{
var austDay = new Date();
austDay = new Date(<?= $nextclaimtime * 1000;?>);
$("#countdown").countdown({until: austDay, format: 'HMS', expiryUrl: "/users/add"});
});
</script>
If i specify /users/add in the expiryUrl everything works in live enviroment but in my local environment it doesn't work because the app is installed under appname.
What is the correct way to change the code so the Ajax call works in both encironments?
The correct way would be to use the router to generate the URL, which would create a URL with respect to the base path/URL.
<?php $url = \Cake\Routing\Router::url(['controller' => 'Users', 'action' => 'add']); ?>
var expiryUrl = <?= json_encode($url) ?>;
$("#countdown").countdown({until: austDay, format: 'HMS', expiryUrl: expiryUrl});
See also
Cookbook > Routing > Generating URLS
while download file using codeigniter in IE it redirects image path with out showing any popup like firefox or chrome to download file
code I am using in my controller:
public function download_file($filename)
{
$this->load->helper('download'); //load helper
$data = file_get_contents('wall-images/'.$filename); // Read the file's contents
$name = $filename;
force_download($name, $data);
}
I use javascript & it works for all browsers.
<a target="_blank" class="btn btn-primary" id="download" href="#">Download File</a>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('#download').click(function(){
var url = "<?php echo site_url($filename); ?>";
document.location = url;
});
});
</script>
IE does not support neither navigating to a data URI nor the download attribute.
You can use navigator.msSaveBlob to save file for IE 10+.
You can check window.navigator.msSaveBloband write IE specific Code otherwise use existing code to save file.
You can check following link for more details:
Saving files locally using Blob and msSaveBlob
Currently im building a application using phonegap & jQuery Mobile
I have done the version which is perfectly working on iOS & Android.But the same code does not work on windows phone.When i click any link,redirection to the respective page is not loading..Its still says "Error Page loading".
<!DOCTYPE html>
Test
<div id="bg">
<div style="padding-top:14%;width:100%;text-align:center">
<div style="float:left;text-align:center;width:50%"><img src="pics/btn_1.png" /></div>
<div style="float:left;text-align:center;width:50%"><img src="pics/btn_2.png" /></div>
</div>
<div style="clear:both"></div>
</div>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
app.initialize();
</script>
</body>
Need help on this.
Solution
Add data-ajax=false or rel=external to your anchor tag. But, if you do this, you will lose transitions. This tells the framework to do a full page reload to clear out the Ajax hash in the URL. You could enable this if the incoming device is a windows phone if needed :
$(document).on("mobileinit", function () {
//check for windows phone
$.mobile.ajaxEnabled = false;
});
Else, make your code into a single page template. Here's a demo of that : http://jsfiddle.net/hungerpain/aYW2f/
Edit
Currently jQM doesn't support query string parameters. You could use the localStorage API to store the parameters in cache and retrieve them later. Assuming you want to go to index.html from here :
<img src="pics/btn_2.png" />
You'd add a click event for it :
$(document).on("click", "a", function() {
//gets qs=2 and changes it into ["qs",2]
var query = this.href.split["?"][2].split["="];
//construct an array out of that
var paramString = { query[0]: query[1]} ;
//store it in localstorage
locaStorage["query"] = JSON.stringify(paramString);
//continue redirection
return true;
});
In your index.html :
$(document).on("pageinit", "[data-role=page]", function() {
//store it in localstorage
var params = JSON.parse(locaStorage["query"]);
//now params will contain { "qs" : 2 }
//you could access "2" by params["qs"]
});
More info about localStorage here.
I had Also same issue and finally resolve it by using below code
my html page is index.html and i am writtinga all code in one html
Before
$.mobile.changePage( "#second", {});
After
var url = window.location.href;
url = url.split('#').pop().split('?').pop();
url = url.replace(url.substring(url.lastIndexOf('/') + 1),"index.html#second");
$.mobile.changePage(url, { reloadPage : false, changeHash : false });
and suppose you have multiple html page then for more one page to another you can use
var url = window.location.href;
url = url.split('#').pop().split('?').pop();
url = url.replace(url.substring(url.lastIndexOf('/') + 1),"second.html");
$.mobile.changePage(url, { reloadPage : false, changeHash : false });
There is no support of querystring in web application using phonegap for windows phone 7.
However we can replace ? with # or anything else to pass the data,
like convert
Sample.html?id=12312
to
Sample.html#id=12312
I have a problem with loading CKEDITOR. I have made everything like described here: http://docs.cksource.com/CKEditor_3.x/Developers_Guide/Integration But anyway i'm getting an error (Google Chrome 4.x) Uncaught [CKEDITOR.editor] The instance "html" already exists.
Here is my code:
<script type="text/javascript" src="/engine/jq.js"></script>
<script type="text/javascript" src="/engine/cke/ckeditor.js"></script>
<script type="text/javascript" src="/engine/cke/adapters/jquery.js"></script>
<textarea class="jquery_ckeditor" name="html" id="html" rows="10">text</textarea>
<script type="text/javascript">
if (CKEDITOR.instances['html']) { CKEDITOR.remove(CKEDITOR.instances['html']); // with or without this line of code - rise an error }
CKEDITOR.replace('html');
</script>
check this:
if (CKEDITOR.instances['html']) {
delete CKEDITOR.instances['html']
};
CKEDITOR.replace('html');
using the jquery ckeditor adapter - I was able to reinitialize ckeditor textareas in ajax content using this function.
function initCKEditor() {
$('.wysiwyg').ckeditor(function(e){
delete CKEDITOR.instances[$(e).attr('name')];
},{
toolbar:
[
['Bold','Italic','Underline','Strike','-','NumberedList','BulletedList','-','Paste','PasteFromWord','-','Outdent','Indent','-','Link','-','Maximize','-','Source']
],
skin: 'office2003'
}
);
}
remove class='ckeditor' as it's triggering the automatic replacement system.
Same error, getting it with the jQuery adapter though. Check the class of the textarea. As far as i can tell all text areas with class 'ckeditor' are automatically converted to editors. So either don't bother setting it with javascript or change the class.
http://ckeditor.com/blog/CKEditor_for_jQuery has a fix if you are using jQuery
// remove editor from the page
$('textarea').ckeditor(function(){
this.destroy();
});
Your page has a html container, try renaming your textarea ?
<textarea class="jquery_ckeditor" name="editor" id="editor" rows="10">text</textarea>
<script type="text/javascript">
CKEDITOR.replace('editor');
</script>
The solution that works for me: in an Ajax view, having two controls
#Html.TextAreaFor(model => model.offreJob.profile, new { #class = "input_text_area_nofloat", #style = "width:590px", #id = "ck_profile" })
and
#Html.TextAreaFor(model => model.offreJob.description_job, new { #class = "input_text_area_nofloat", #style = "width:590px", #id = "ck_description" })
I use the following script:
<script>
if (CKEDITOR.instances['ck_profile']) {
delete CKEDITOR.instances['ck_profile'];
}
CKEDITOR.replace('ck_profile');
if (CKEDITOR.instances['ck_description']) {
delete CKEDITOR.instances['ck_description'];
}
CKEDITOR.replace('ck_description');
</script>
Try this, hope it works, it worked for me.
for(html in CKEDITOR.instances['html')
{
CKEDITOR.instances[html ].destroy();
}
http://dev.ckeditor.com/ticket/9862#no1
Try this, it worked for me
var editor = CKEDITOR.instances["your_textarea"];
if (editor) { editor.destroy(true); }
I'm using CKEditor 3 and I need to integrate a cost-free filebrowser/uploader. I tried to integrate the one that comes with FCKEditor but I always get this XML error:
The server didn't send back a proper XML response. Please contact your system administrator.
XML request error: OK (200)
Requested URL: http://example.com/admin/filemanager/browser/default/?Command=GetFoldersAndFiles&Type=File&CurrentFolder=%2F&uuid=1260817820353
Response text:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<html>
<head>
<title>Index of /admin/filemanager/browser/default</title>
</head>
<body>
<h1>Index of /admin/filemanager/browser/default</h1>
<table><tr><th><img src="/icons/blank.gif" alt="[ICO]"></th>
<th>Name</th>
<th>Last modified</th>
<th>Size</th>
<th>Description</th></tr>
<!-- edited for brevity -->
I'm trying to do it in this way:
<script type="text/javascript">
window.onload = function(){
CKEDITOR.config.language='es';
CKEDITOR.config.forcePasteAsPlainText = true;
CKEDITOR.config.enterMode = CKEDITOR.ENTER_DIV;
CKEDITOR.replace('ncCont',{
filebrowserBrowseUrl: 'filemanager/browser/default/browser.html',
filebrowserUploadUrl : 'filemanager/connectors/php/upload.php'
});
};
</script>
Can FCKeditor be integrated with CKEditor? If yes, how can this be done? If not, is there a free filebrowser/uploader alternative?
Wanted to piggy back off Penuel whose code helped me a lot.
add this to /filemanager/connectors/php/upload.php
// Get the CKEditor Callback
$CKEcallback = $_GET['CKEditorFuncNum'];
//modify the next line adding in the new param
FileUpload($sType, $sCurrentFolder, $sCommand, $CKEcallback);
add this to /filemanager/connectors/php/io.php
// This is the function that sends the results of the uploading process to CKE.
function SendCKEditorResults ($callback, $sFileUrl, $customMsg = '')
{
echo '<script type="text/javascript">';
$rpl = array( '\\' => '\\\\', '"' => '\\"' ) ;
echo 'window.parent.CKEDITOR.tools.callFunction("'. $callback. '","'.
strtr($sFileUrl, $rpl). '", "'. strtr( $customMsg, $rpl). '");' ;
echo '</script>';
}
modify this /filemanager/connectors/php/commands.php
//line 158
function FileUpload($resourceType, $currentFolder, $sCommand, $CKEcallback = '')
//line 166
if ( (isset($_FILES['NewFile']) && !is_null($_FILES['NewFile']['tmp_name']))
# This is for the QuickUpload tab box
or (isset($_FILES['upload']) and !is_null($_FILES['upload']['tmp_name'])))
{
global $Config ;
$oFile = isset($_FILES['NewFile']) ? $_FILES['NewFile'] : $_FILES['upload'];
...
if($CKEcallback == '')
{
// this line already exists so wrap the if block around it
SendUploadResults( $sErrorNumber, $sFileUrl, $sFileName ) ;
}
else
{
//issue the CKEditor Callback
SendCKEditorResults ($CKEcallback, $sFileUrl,
($sErrorNumber != 0
? 'Error '. $sErrorNumber. ' upload failed. '. $sErrorMsg
: 'Upload Successful'));
}
You'll need to add the upload URL's to your CKEDITOR definition like so:
var filemanager = '/js/ckeditor/filemanager/';
var browser = filemanager + 'browser/default/browser.html';
var connector = filemanager + 'connectors/php/connector.php';
var upload = filemanager + 'connectors/php/upload.php';
CKEDITOR.replace( id,
{
customConfig : this.config,
filebrowserBrowseUrl : browser +'?Connector=' + connector,
filebrowserImageBrowseUrl : browser + '?Type=Image&Connector='
+ connector,
filebrowserFlashBrowseUrl : browser + '?Type=Flash&Connector='
+ connector,
filebrowserUploadUrl : upload + '?type=Files',
filebrowserImageUploadUrl : upload + '?type=Images',
filebrowserFlashUploadUrl : upload + '?type=Flash'
});
I think that covers everything left off by Penuel
To answer your question I have posted one small tutorial on my blog with step by step instructions to integrate the File Browser of FCKEditor in CKEditor. Please goto:
http://www.mixedwaves.com/2010/02/integrating-fckeditor-filemanager-in-ckeditor/
I have done this for PHP connector but should be pretty simple for other languages as well.
You can also download the already done example or view the demo from this article.
I'm using a custom file browser with my implementation of ckeditor, so I don't see why you couldn't use the old file browser. It uses the same javascript to populate the editor.
Just install the old FCK editor in whatever directory, and make sure you have the correct path to that browser in your config. I'm guessing that you have a pathing problem above.