i have address like
site.com/elfinder/simple
i need after click to a button open new blank window and open this address then after click a image return the url.
i dont need use method elfinder dialog . because i cant load css,js,,,, in master page
An easy way would be to use a modal which loads elFinder in iframe.
You can then use parent.myFunction() to close(destroy/hide) the iframe modal and return the selected image url to parent page.
In fact this is similar to how TinyMCE handles it.
To prevent elFinder from reloading from scratch each time you hit the button, it will be good to use some logic to check if the iframe already exists, if it does, .show() it, if it does not, create it
//elFinder main.js file (in the modal iframe)
getFileCallback: function(file) {
var returnUrl = file.url;
parent.getElfinderUrl(returnUrl);
}
//parent page
function getElfinderUrl(url){
$("input.elfinder").val(url);
$("iframe.elfinder").hide(); // or .remove()
}
//parent page
$("button.elfinder").on("click", function(){
if($("iframe.elfinder").length){
if(!$("iframe.elfinder").is(":visible")){
$("iframe.elfinder").show();
}
}
else{
$("<iframe src='elfinder.html' class='elfinder' />").appendTo("body"); // use CSS to make look like a proper modal
}
});
//add a modal close button somewhere with the same idea
Most helpful comment
An easy way would be to use a modal which loads elFinder in iframe.
You can then use
parent.myFunction()to close(destroy/hide) the iframe modal and return the selected image url to parent page.In fact this is similar to how TinyMCE handles it.
To prevent elFinder from reloading from scratch each time you hit the button, it will be good to use some logic to check if the iframe already exists, if it does,
.show()it, if it does not,createit