CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

TV47 Seniormester

10. april 2022 - 09:23 Der er 13 kommentarer og
1 løsning

Drag and drop / gem filer

Hejsa.

Nogen der har et eksempel på drag and drop, hvor filen/filerne gemmes på harddisk?

Jeg har forsøgt med JavaScript og fetch, men der uploader man tilsyneladende kun til browser og kan ikke gemme til harddrive.

Jeg laver en løsning i web og C#.
Det skal kunne køre .net framework 4.8.
Ikke med windows form, men i web.

Synes godt om

jakobdo Ekspert

10. april 2022 - 21:39 #1

Jeg tror der skal lidt mere forklaring til.
Du vil lave en hjemmeside, og når jeg laver en drag/drop, så skal filen/filerne gemmes på harddisken?
Snakker vi harddisken på serveren eller lokalt hos brugeren? (hvilket selvfølgelig lyder dumt, da brugeren allerede har filen) :)

Synes godt om

TV47 Seniormester

11. april 2022 - 13:04 #2

Det er på harddisken på serveren.

Synes godt om

jakobdo Ekspert

11. april 2022 - 20:35 #3

Nu koder jeg slet ikke c#, men måske noget ala: https://www.codeguru.com/csharp/uploading-files-using-html5-drag-and-drop-and-asp-net/

Synes godt om

TV47 Seniormester

11. april 2022 - 21:32 #4

Hej Jakobdo.
Ja, det ligner noget jeg kan bruge.
Har forsøgt lidt, men det virker ikke rigtig.
Jeg har nok ikke indsat koden korrekt.
Se nedenfor, hvad gør jeg galt.... det nedenfor er indsat i webdelen?

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="FileUpload.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<center>

<div id="box">Drag & Drop files from your machine on this box.

<script>
var selectedFiles;

$(document).ready(function () {
var box;
box = document.getElementById("box");
box.addEventListener("dragenter", OnDragEnter, false);
box.addEventListener("dragover", OnDragOver, false);
box.addEventListener("drop", OnDrop, false);
//...

function OnDragEnter(e) {
e.stopPropagation();
e.preventDefault();
}

function OnDragOver(e) {
e.stopPropagation();
e.preventDefault();
}

function OnDrop(e) {
e.stopPropagation();
e.preventDefault();
selectedFiles = e.dataTransfer.files;
$("#box").text(selectedFiles.length + " file(s) selected for uploading!");
}
}
</script>

<script>
$("#upload").click(function () {
var data = new FormData();
for (var i = 0; i < selectedFiles.length; i++) {
data.append(selectedFiles[i].name, selectedFiles[i]);
}
$.ajax({
type: "POST",
url: "FileHandler.ashx",
contentType: false,
processData: false,
data: data,
success: function (result) {
alert(result);
},
error: function () {
alert("There was error uploading files!");
}
});
});
</script>

</div>

<br />
<input id="upload" type="button" value="Upload Selected Files" />
</center>
</form>
</body>
</html>

Synes godt om

arne_v Ekspert

11. april 2022 - 21:35 #5

Er din FileHandler.ashx ok?

Synes godt om

TV47 Seniormester

11. april 2022 - 22:20 #6

Jeg ser ikke nogen filehandler.ashx nogen steder....

Jeg har følgende code behind:

namespace FileUpload
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{

}

public void ProcessRequest(HttpContext context)
{
if (context.Request.Files.Count > 0)
{
HttpFileCollection files = context.Request.Files;
foreach (string key in files)
{
HttpPostedFile file = files[key];
string fileName = file.FileName;
fileName = context.Server.MapPath("~/uploads/" + fileName);
file.SaveAs(fileName);
}
}
context.Response.ContentType = "text/plain";
context.Response.Write("File(s) uploaded successfully!");
}
}
}

Synes godt om

arne_v Ekspert

12. april 2022 - 00:43 #7

$.ajax({
type: "POST",
url: "FileHandler.ashx",

og ingen FileHandler.ashx vil næppe virke.

Synes godt om

TV47 Seniormester

12. april 2022 - 06:54 #8

Det står i min html i script området.

Hvor skal det stå i stedet da?

Synes godt om

TV47 Seniormester

12. april 2022 - 13:05 #9

Nu har jeg tilføjet sådan en generisk handler.... var vist det.

Synes godt om

arne_v Ekspert

12. april 2022 - 15:00 #10

$.ajax({
type: "POST",
url: "FileHandler.ashx",

instruerer browserens JavaScript engine om at sende en POST HTTP request til den angivne URL, så den URL skal naturligvis være gyldig.

Synes godt om

TV47 Seniormester

12. april 2022 - 17:57 #11

Jeg har i løsningen nu en der hedder FileHandler.ashx.
Koden er som nedenfor:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace FileUpload
{
public class FileHandler : IHttpHandler
{

public void ProcessRequest(HttpContext context)
{
if (context.Request.Files.Count > 0)
{
HttpFileCollection files = context.Request.Files;
foreach (string key in files)
{
HttpPostedFile file = files[key];
string fileName = file.FileName;
fileName = context.Server.MapPath("~/uploads/" + fileName);
file.SaveAs(fileName);
}
}
context.Response.ContentType = "text/plain";
context.Response.Write("File(s) uploaded successfully!");
}

public bool IsReusable
{
get
{
return false;
}
}
}
}

Synes godt om

TV47 Seniormester

12. april 2022 - 17:58 #12

Men i sin helhed virker det stadig ikke rigtig.
Nogen der kan se, hvad jeg har forkert eller mangler i såvel web, C# som i FileHandler?

Synes godt om

arne_v Ekspert

12. april 2022 - 18:45 #13

Kan du være lidt mere specifik end "i sin helhed virker det stadig ikke rigtig" ?

Synes godt om

1 synes godt om dette

TV47 Seniormester

12. april 2022 - 19:49 #14

Nej ikke lige umiddelbart.
Jeg prøver at arbejde lidt videre med.

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Se alle it-kurser fra Computerworld Kurser

IT-kurser om Microsoft 365, sikkerhed, personlig vækst, udvikling, digital markedsføring, grafisk design, SAP og forretningsanalyse.

Se alle it-kurser

Flere spørgsmål fra C# kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Søger programmør til hjælp på eksamensprojekt - betaler gerne! Af Caroline BJ i C#	0	12/06/202411:19	-
Drev bogstav som path Af prox1 i C#	5	01/05/202403:58	01/05/202421:24
Tråd programmering Af lasserasch i C#	3	04/12/202313:03	06/01/202419:04
Inspiration til GUI opdatering fra Service lag. Af lasserasch i C#	2	28/11/202308:48	28/11/202319:29
Kan ikke komme igennem azure firewall med fil upload fra web app Af chrisrj i C#	1	28/08/202313:32	28/08/202314:04

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS