4

I have integrate the CKEditor and CKFinder by referring documentation from their site.

In that, I successfully uploaded different types of docs, pdf and images. But every time when I upload the document the link generated is like 

/Project_folder/files/0321832051(3).pdf

but I have to just display the file name and on that file there should be a link. eg 0321832051(3).pdf when I click on that link it should be open. I searched on google but I didn't get the solution for it. Did any one tried it. Please let me know if any one knows.

For this I am using ckeditor and ckfinder for asp.net

Did any one know this?

shrikant1712
  • 4,336
  • 1
  • 24
  • 42
  • "I have to just display the file name and on that file there should be a link." - Do you mean you want to insert them into CKEditor and there display a link? With the Image dialog? – Joel Peltonen Oct 10 '13 at 05:45
  • 1
    Yes, I want to display only uploaded file name like (abc.pdf) and on that display file name there should be a link like (/folder/uploaded_files/abc.pdf). – shrikant1712 Oct 10 '13 at 11:34
  • You can use /Project_folder/files/0321832051(3).pdf replace method instead what element you are using ? – Just code Oct 11 '13 at 11:26
  • I was actually thinking of doing that by using some post-insert hook if I could find one but I'm super busy, perhaps over the weekend if I have the time! :) – Joel Peltonen Oct 11 '13 at 12:33
  • @shrikant1712 just to further clarify, with the image dialog or with the link dialog? I just did this using the link dialog, but if it's with the image I don't even see how that is possible to insert PDF links with that dialog. Which one do you use? – Joel Peltonen Oct 21 '13 at 12:49
  • Actually when we integrate the ckfinder then it will gives us file "Upload" tab in the "Link" when we click on "Send to server" button it will generate the link into the "Link Info" tab. This link is used. – shrikant1712 Oct 21 '13 at 13:49
  • @shrikant1712 Ok, then my answer should work. I just tested it in http://ckeditor.com/demo and it worked there at least. Any comments? – Joel Peltonen Oct 22 '13 at 11:35

4 Answers4

3

Replace "editor1" with your editor name in the hack below or hack into whatever system you have after the CKE js has loaded. What it does is listens to dialogs closing, when it sees that the link dialog is being hidden and that the current selection begins with an <a...> link, it takes the contents of said link and cuts it from the final slash.

var editor = CKEDITOR.instances.editor1;

editor.on('dialogHide', function(e) {
    if(e.data.getName() === "link") {
        var sel = editor.getSelection();
        var se = sel.getStartElement();
        var text = se.getText();
        if(se.getName() === "a") {
            var newtext = text.slice(text.lastIndexOf('/')+1);
            se.setText(newtext);
        }
    }     
});

It's complicated and disgusting but seems to work. Be warned, I have not tested this if it breaks anything else like anchoring. More checks would be better, like checking if newtext actually gets a value > 1 and only then replacing.

Joel Peltonen
  • 13,025
  • 6
  • 64
  • 100
  • Now re-reading your question I REALLY HOPE that you were indeed talking about hooking into the LINK insertion and nothing else, but I can't see how this could be anything else. If it's not link insertion, please re-read, revise and clarify your question. – Joel Peltonen Oct 21 '13 at 12:39
0

I think you should manually wrap those in html PREVIEW as 

`<a href='/folder/uploaded_files/abc.pdf'>SomeText</a>.`

That should do the trick

0

With CKEDITOR you can do it like this:

string mytext = "hello world :)";
CKEDITOR.instances.editor1.insertHtml( '<a href="mylink">' + mytext + '</a>' );
NaYaN
  • 1,300
  • 7
  • 11
0

With CKEDITOR you can also do it like this using style:

var attributes = Array();
attributes["href"] = link;   //your link
var style = new CKEDITOR.style( { element : 'a', attributes : attributes } );
style.type = CKEDITOR.STYLE_INLINE;
style.apply(editor.document);
NaYaN
  • 1,300
  • 7
  • 11