Hoe post ik een variabele met formdata?
Op drie verschillende manieren heb ik geprobeerd het aan de praat te krijgen zonder succes.
Dit is mijn code op het moment:
Code (php)
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
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
<script>
$(function () {
'use strict';
var url = window.location.hostname === 'site.nl/demo/server/php/' ?
'//site.nl/' : 'demo/server/php/';
$('#fileupload').fileupload({
url: url,
dataType: 'json',
formData: [
{ name: 'custom_dir', value: '/fileupload/<?PHP echo $_GET['bedrijf'] ?>/<?PHP echo $_GET['alias'] ?>/' },
{ name: 'cat_id', value: '<?PHP echo $gtc['id']; ?>'},
{ name: 'name', value: $( "#filename" ).val()},
],
add: function (e, data) {
data.context = $('<button/>').text('Uploaden starten').addClass('font-15 btn btn-secondary btn-lg waves-effect btnadd fullwidth')
.appendTo('.uploadbutton')
.click(function () {
data.submit();
});
},
done: function (e, data) {
$.each(data.result.files, function (index, file) {
$('<p/>').text(file.name).appendTo('#files');
});
},
progressall: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
$('#progress .progress-bar').css(
'width',
progress + '%'
);
}
}).prop('disabled', !$.support.fileInput)
.parent().addClass($.support.fileInput ? undefined : 'disabled');
});
</script>
$(function () {
'use strict';
var url = window.location.hostname === 'site.nl/demo/server/php/' ?
'//site.nl/' : 'demo/server/php/';
$('#fileupload').fileupload({
url: url,
dataType: 'json',
formData: [
{ name: 'custom_dir', value: '/fileupload/<?PHP echo $_GET['bedrijf'] ?>/<?PHP echo $_GET['alias'] ?>/' },
{ name: 'cat_id', value: '<?PHP echo $gtc['id']; ?>'},
{ name: 'name', value: $( "#filename" ).val()},
],
add: function (e, data) {
data.context = $('<button/>').text('Uploaden starten').addClass('font-15 btn btn-secondary btn-lg waves-effect btnadd fullwidth')
.appendTo('.uploadbutton')
.click(function () {
data.submit();
});
},
done: function (e, data) {
$.each(data.result.files, function (index, file) {
$('<p/>').text(file.name).appendTo('#files');
});
},
progressall: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
$('#progress .progress-bar').css(
'width',
progress + '%'
);
}
}).prop('disabled', !$.support.fileInput)
.parent().addClass($.support.fileInput ? undefined : 'disabled');
});
</script>
Het gaat om dit stuk:
Code (php)
De twee bovenstaande waardes worden netjes gepost maar de onderste blijft leeg, dat ziet er zo uit:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
------WebKitFormBoundary59O7sCnGuJdp2LnV
Content-Disposition: form-data; name="custom_dir"
/fileupload/nieuw_bedrijf/inkoop_van_diensten/
------WebKitFormBoundary59O7sCnGuJdp2LnV
Content-Disposition: form-data; name="cat_id"
95
------WebKitFormBoundary59O7sCnGuJdp2LnV
Content-Disposition: form-data; name="name"
------WebKitFormBoundary59O7sCnGuJdp2LnV
Content-Disposition: form-data; name="files[]"; filename="198970050.pdf"
Content-Type: application/pdf
------WebKitFormBoundary59O7sCnGuJdp2LnV--
Content-Disposition: form-data; name="custom_dir"
/fileupload/nieuw_bedrijf/inkoop_van_diensten/
------WebKitFormBoundary59O7sCnGuJdp2LnV
Content-Disposition: form-data; name="cat_id"
95
------WebKitFormBoundary59O7sCnGuJdp2LnV
Content-Disposition: form-data; name="name"
------WebKitFormBoundary59O7sCnGuJdp2LnV
Content-Disposition: form-data; name="files[]"; filename="198970050.pdf"
Content-Type: application/pdf
------WebKitFormBoundary59O7sCnGuJdp2LnV--
Naast bovenstaande manier heb ik het ook zo geprobeerd:
Code (php)
1
var filename = $( "#filename" ).val();
Met daaronder dan:
Code (php)
1
{ name: 'name', value: filename},
Ook dit blijft leeg.
Ten slotte probeerde ik het zo:
Code (php)
1
2
3
4
5
2
3
4
5
var input = $('#filename');
//met dan daaronder
{ name: 'name', value: input.val()},
//met dan daaronder
{ name: 'name', value: input.val()},
Wat doe ik verkeerd? Het vreemde is, als ik mijn input veld een standaard waarde geef, dan werkt het wel. Maarja ik wil natuurlijk dat mensen zelf de naam aan kunnen geven ipv dat dit vooraf vast staat...
site.nl/demo/server/php/
Daarnaast weet ik ook niet of je via $_GET parameters wilt injecteren in je JavaScript, weet niet precies wat de insteek is maar ik denk dat er andere/betere manieren zijn.
Als #filename het id is van een uploadveld, daar kun je sowieso weinig of niets mee, dit wordt afgeschermd, waarschijnlijk mede uit veiligheidsoverwegingen. Als je een custom naam wilt opgeven zul je hiervoor een apart veld moeten opgeven denk ik. Ook zul je bij het uploaden moeten controleren of je niet toevallig iets aan het overschrijven bent misschien.
Het is ook handig als je erbij vermeldt of / welke plugin/library of wat dan ook je hiervoor gebruikt? Is dit de eerder vermelde blueimp? Heb je de documentatie aldaar bekeken? En mist er toevallig geen leading slash in /demo/server/php/? Even uitproberen en debuggen maar.
Maar zit de originele bestandsnaam niet gewoon in je $_FILES['files']['name']?
@rob Ik zoek niet de filename van het bestand, die weet ik wel te achterhalen (zit al in mijn formdata post wanneer ik in mijn network tab kijk). Wat ik probeer is de mogelijkheid te creeeren om zelf een naam te kiezen voor een bestand.