Is it possible to allow an image container to allow drag & drop of an image into it.
Once completing I can then upload the image to a server ?
Any pointers please ?
Cheers
Steve Warby
Is it possible to allow an image container to allow drag & drop of an image into it.
Once completing I can then upload the image to a server ?
Any pointers please ?
Cheers
Steve Warby
Yes, this is possible. We do not have a sample of this.
I did find a JavaScript library - there may be others:
Thanks for the info.
How do I set a container to have attribute ‘action’ ?
Following the docs I have tried
Where drop1 is a container with class dropzone
// Dropzone.autoDiscover = false;
$('#drop1').attr('action', 'http://www.toolfolks.com/techy/dropZone.php');
$("div#drop1").dropzone({ url: "http://www.toolfolks.com/techy/dropZone.php" });
With the above when I drag an image I get :
TypeError: files.map is not a function. (In 'files.map(function (file) {
return _this5.addFile(file);
})', 'files.map' is undefined).
line 1655 column 23
I have also tried different configurations.
I think I need to do the equivalent of this in NSBasic
<form action="upload.php" class="dropzone"></form>
but for a container
I presume this would do the trick $(‘#drop1’).attr(‘action’, ‘http://www.xxxx.com/xxxxx.php’);
Cheers
Steve Warby
I am only getting the above error if I drag an image from finder ( I am on a Mac) If I drag an image from a browser I get no errors but no action.
Cheers
Steve Warby
The Container control has a ‘attributes’ property. Simply put it there.
For anyone else. I got it working as follows:
Client side.
Add the files dropdown.js & dropdown.css
Copy these into the project folder then drag from that folder into the project.
Add a container and set the class to dropzone.
Set the attributes to:
action = ‘dropZone.php’ // the name of your php file:
On the server
creat a folder 'uploads’
create a PHP file as follows:
<?php
$ds = DIRECTORY_SEPARATOR; //1
$storeFolder = 'uploads'; //2
if (!empty($_FILES)) {
$tempFile = $_FILES['file']['tmp_name']; //3
$targetPath = dirname( __FILE__ ) . $ds. $storeFolder . $ds; //4
$targetFile = $targetPath. $_FILES['file']['name']; //5
move_uploaded_file($tempFile,$targetFile); //6
}
//echo('working');
?>
This is fine on Mac Chrome & Firefox but on Safari I get the following error:
TypeError: files.map is not a function. (In 'files.map(function (file) {
return _this5.addFile(file);
})', 'files.map' is undefined).
line 1655 column 23
I have emailed the developer so I’ll keep you posted.
Cheers
Steve Warby
I search ‘tinter web’ and food the GitHub page with a fix here
Seems okay now.