Mijn vraag
Momenteel ben ik bezig met een asp.net core MVC project in Visual Studio. Hierbij heb ik twee objecten:
- Een document object met informatie over een document en bevat een file object.
- Een file object.
Van beide gegevens worden de data opgeslagen in een database.
Van de documenten wordt een lijst gegenereerd met behulp van een for loop. Hierbij worden ook per rij (dus per document) drie knoppen automatisch gegenereerd:
- Edit
- Delete
- Upload file
De edit en delete knop werken allebei. Wanneer op de upload file knop wordt gedrukt opent een verkenner en kan het bestand geselecteerd worden.
Dit roept een javascript functie aan die de data doorgeeft naar een functie in de filecontroller. Het bestand wordt geüpload naar een map op de server.
Ik loop tegen drie dingen aan:
- De upload file knop opent alleen een verkenner bij de eerste rij. Bij andere rijen wordt er geen verkenner geopend. M.b.v. de browser heb ik de gegenereerde HTML vergeleken maar hier zie ik geen verschil.
- Ik probeer het document ID mee te geven aan de javascript functie zodat deze het kan doorgeven naar de controller. De doorgifte van de javascript functie naar de controller werkt. De doorgifte vanaf de html pagina naar de javascript nog niet. Het doorgeven is bedoeld zodat in de controller code het document gekoppeld kan worden aan de file die geupload word.
- De bovenste twee vragen zijn voor nu de belangrijkste. De upload functie zelf werkt ook nog niet helemaal naar behoren. Het maakt wel een bestand aan en de naam wordt ook doorgegeven echter is de bestandsgrote die opgeslagen word nul.
Ik zit al enkele uren te zoeken op het internet maar kom geen stap verder.
Wie o wie kan mij een stukje verder helpen met 1 of meerdere van de vragen?
HTML code for loop:
...
Momenteel ben ik bezig met een asp.net core MVC project in Visual Studio. Hierbij heb ik twee objecten:
- Een document object met informatie over een document en bevat een file object.
- Een file object.
Van beide gegevens worden de data opgeslagen in een database.
Van de documenten wordt een lijst gegenereerd met behulp van een for loop. Hierbij worden ook per rij (dus per document) drie knoppen automatisch gegenereerd:
- Edit
- Delete
- Upload file
De edit en delete knop werken allebei. Wanneer op de upload file knop wordt gedrukt opent een verkenner en kan het bestand geselecteerd worden.
Dit roept een javascript functie aan die de data doorgeeft naar een functie in de filecontroller. Het bestand wordt geüpload naar een map op de server.
Ik loop tegen drie dingen aan:
- De upload file knop opent alleen een verkenner bij de eerste rij. Bij andere rijen wordt er geen verkenner geopend. M.b.v. de browser heb ik de gegenereerde HTML vergeleken maar hier zie ik geen verschil.
- Ik probeer het document ID mee te geven aan de javascript functie zodat deze het kan doorgeven naar de controller. De doorgifte van de javascript functie naar de controller werkt. De doorgifte vanaf de html pagina naar de javascript nog niet. Het doorgeven is bedoeld zodat in de controller code het document gekoppeld kan worden aan de file die geupload word.
- De bovenste twee vragen zijn voor nu de belangrijkste. De upload functie zelf werkt ook nog niet helemaal naar behoren. Het maakt wel een bestand aan en de naam wordt ook doorgegeven echter is de bestandsgrote die opgeslagen word nul.
Ik zit al enkele uren te zoeken op het internet maar kom geen stap verder.
Wie o wie kan mij een stukje verder helpen met 1 of meerdere van de vragen?
HTML code for loop:
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
| <table class="table user-list"> <tbody> @foreach (var document in Model) { <tr> <td class="text-start" style="width: 20%;"> <div style="table-layout:fixed; white-space:pre-wrap"> @document.Name </div> </td> <td class="text-center" style="width: 20%;"> @document.Source </td> <td class="text-center" style="width: 20%;"> @document.Type.Name </td> <td class="text-center" style="width: 20%;"> @document.Writer </td> <td class="text-center" style="width: 20%;"> <a href="javascript:void(0);" class="anchorEditOrCreate" data-id="@document.ID"> <span class="fa-stack"> <img src="~/icons/pencil.svg" alt="Edit" width="24" height="24"> </span> </a> <a href="javascript:void(0);" class="anchorDelete" data-id="@document.ID"> <span class="fa-stack"> <img src="~/icons/trash.svg" alt="Delete" width="24" height="24"> </span> </a> <input type="file" name="attach" id="attach-input" IDDocument="@document.ID" style="display:none" multiple /> <a href="javascript:void(0);" class="list-group-item py-1" type="submit" name="attach" id="attach-button" IDDocument="@document.ID"> <span class="fa-stack"> <img src="~/icons/upload.svg" alt="Upload" width="24" height="24"> </span> </a> </td> </tr> } </tbody> </table> |
JavaScript:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
| var button = $('#attach-button'); var input = $('#attach-input'); var IDDocument = 0; button.on('click', function (e) { input.click(); }); input.on('change', function (e) { var IDDocument = $buttonClicked.attr('IDDocument'); var files = e.target.files var size = 0; var fdata = new FormData(); for (var i = 0; i < files.length; i++) { fdata.append("FormFile", files[i]); size += files[i].size; } fdata.append("IDDocument", IDDocument); if (size < 31457280) { if (files.length > 0) { $.ajax({ type: "POST", url: "/File/Upload", beforeSend: function (xhr) { xhr.setRequestHeader("XSRF-TOKEN", $('input:hidden[name="__RequestVerificationToken"]').val()); }, data: fdata, contentType: false, processData: false, success: function (response) { if (response == "Success") { location.reload(); } else { alert(response); } } }); } else { alert('Please select a file.') } } else { alert('Max 30MB supported') } }) |
...
/u/411828/crop576907a75c281.png?f=community)
:strip_icc():strip_exif()/u/43400/avatar.jpeg?f=community){kind=avatar}
/u/57387/claimedavatar-70.png?f=community){kind=avatar}