drag & drop codes
i have simple mvc web app using c#.
do you know any drag & drop & remove photo codes I can use?
do you know any drag & drop & remove photo codes I can use?
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Hi,
Check this- https://www.c-sharpcorner.com/article/asp-net-mvc-drag-drop-multiple-image-upload/
This is implemented using DropZone.js. This is an open source library, which provides drag and drop file uploading with the image preview. This library is independent and does not require JQuery library. It is a very lightweight library.
Check this- https://www.c-sharpcorner.com/article/asp-net-mvc-drag-drop-multiple-image-upload/
This is implemented using DropZone.js. This is an open source library, which provides drag and drop file uploading with the image preview. This library is independent and does not require JQuery library. It is a very lightweight library.
ASKER
Do you know why the second one is not working? removedfile
<script>
Dropzone.options.myAwesomeDropzone = {
init:
function () {
this.on("complete", function (file) {
var myData = JSON.parse(file.xhr.responseText);
//alert("Save File: " + file.xhr.responseText);
//alert("Json Return Msg: " + myData.Message);
document.getElementById("photolistingtodatabase").value = document.getElementById("photolistingtodatabase").value + myData.Message + ",";
});
}
};
</script>
<script>
Dropzone.options.myAwesomeDropzone = {
init:
function () {
this.on("removedfile", function (file) {
alert("Are you sure you want to remove this photo " + file.name);
//write ajax codes to remove this file
//pick from photolistingtodatabase input box
var photolist = document.getElementById("photolistingtodatabase").value;
photolist.replace(file.name, '');
});
}
};
</script>
Hi,
You have kept both function names as "init". You might want to change that and you do not require separate <script> tags for more functions... 1 tag is sufficient enough. check below code for reference:
You have kept both function names as "init". You might want to change that and you do not require separate <script> tags for more functions... 1 tag is sufficient enough. check below code for reference:
<script>
Dropzone.options.myAwesomeDropzone = {
init:
function () {
this.on("complete", function (file) {
var myData = JSON.parse(file.xhr.responseText);
//alert("Save File: " + file.xhr.responseText);
//alert("Json Return Msg: " + myData.Message);
document.getElementById("photolistingtodatabase").value = document.getElementById("photolistingtodatabase").value + myData.Message + ",";
});
},
someOtherFunction: function() { }
};
</script>
Can you have a look at what jQuery has to offer regarding drag and drop?
https://www.elated.com/drag-and-drop-with-jquery-your-essential-guide/