Frenske123
Terugkerende gebruiker
- Lid geworden
- 2 jul 2007
- Berichten
- 1.260
Hallo,
Ik heb onderstaande van https://kcfinder.sunhater.com/demos/image
handig om afbeeldingen te uploaden.
Mooiste is de IMAGE versie zie menu links , probleem is echter hoe geef ik de gekozen url door aan bijv. een hidden inputfield zodat deze in een tabel kan worden opgeslagen , aan selecteren alleen heb ik niks.
Na selecteren in de broncode pagina:
Het gaat dus om /upload/files/type-1/test.jpg naar een input value te kopiëren of andere manier om /upload/files/type-1/test.jpg naar een table te schrijven.
Ik heb onderstaande van https://kcfinder.sunhater.com/demos/image
handig om afbeeldingen te uploaden.
Mooiste is de IMAGE versie zie menu links , probleem is echter hoe geef ik de gekozen url door aan bijv. een hidden inputfield zodat deze in een tabel kan worden opgeslagen , aan selecteren alleen heb ik niks.
Code:
<style type="text/css">
#image {
width: 200px;
height: 200px;
overflow: hidden;
cursor: pointer;
background: #000;
color: #fff;
}
#image img {
visibility: hidden;
}
</style>
<script type="text/javascript">
function openKCFinder(div) {
window.KCFinder = {
callBack: function(url) {
window.KCFinder = null;
div.innerHTML = '<div style="margin:5px">Loading...</div>';
var img = new Image();
img.src = url;
img.onload = function() {
div.innerHTML = '<img id="img" src="' + url + '" />';
var img = document.getElementById('img');
var o_w = img.offsetWidth;
var o_h = img.offsetHeight;
var f_w = div.offsetWidth;
var f_h = div.offsetHeight;
if ((o_w > f_w) || (o_h > f_h)) {
if ((f_w / f_h) > (o_w / o_h))
f_w = parseInt((o_w * f_h) / o_h);
else if ((f_w / f_h) < (o_w / o_h))
f_h = parseInt((o_h * f_w) / o_w);
img.style.width = f_w + "px";
img.style.height = f_h + "px";
} else {
f_w = o_w;
f_h = o_h;
}
img.style.marginLeft = parseInt((div.offsetWidth - f_w) / 2) + 'px';
img.style.marginTop = parseInt((div.offsetHeight - f_h) / 2) + 'px';
img.style.visibility = "visible";
}
}
};
window.open('/demo/kcfinder/browse.php?type=images&dir=images/public',
'kcfinder_image', 'status=0, toolbar=0, location=0, menubar=0, ' +
'directories=0, resizable=1, scrollbars=0, width=800, height=600'
);
}
</script>
<div id="image" onclick="openKCFinder(this)"><div style="margin:5px">Click here to choose an image</div></div>
Na selecteren in de broncode pagina:
HTML:
<div id="image" onclick="openKCFinder(this)">
<img id="img" src="/upload/files/type-1/test.jpg" style="width: 200px; height: 134px; margin-left: 0px; margin-top: 33px; visibility: visible;"/>
</div>
Het gaat dus om /upload/files/type-1/test.jpg naar een input value te kopiëren of andere manier om /upload/files/type-1/test.jpg naar een table te schrijven.
Laatst bewerkt: