File upload icm met uniform.js
Ik wil een file upload maken in een simpele html form.
Deze form wordt echter gestyled m.b.v. uniform.js
Door gebruik van uniform.js wordt een simpele <input class="input-file uniform_on" id="fileInput" type="file" /> omgezet naar het volgende.
<input class="input-file uniform_on" id="fileInput" type="file">
<span class="filename" style="-webkit-user-select: none;">No file selected</span>
<span class="action" style="-webkit-user-select: none;">Choose File</span>
Als ik nu een file selecteer veranderd het naar:
<input class="input-file uniform_on" id="fileInput" type="file">
<span class="filename" style="-webkit-user-select: none;">bestandsnaam.ext</span>
<span class="action" style="-webkit-user-select: none;">Choose File</span>
Zoals je kunt zien, wordt er bij het selecteren geen value gegeven aan de file input maar wordt de bestandsnaam welke geselecteerd is in een <span> tag gezet.
Als ik nu dus een bestand wil uploaden wordt de file input als "leeg" gezien.
Hoe kan ik nu, met behulp van deze methode van styling, toch een bestand uploaden? Hoe krijg ik het aangeroepen bestand in mijn uploader script?
bij voorbaat dank.
Wat ik in bovenstaand mis is name="..."
Gewijzigd op 26/01/2014 15:23:13 door - SanThe -
(Het is natuurlijk ook opensource dus kan niet alles voor niks krijgen)
Ik had zelf ook wel al bedacht dat ik name="" moest gebruiken. Maar dir maakt helaas niks uit voor mijn probleem.
Dit is een stukje uit de code die ik momenteel gebruik, nadat ik een bestand heb geselecteerd.
<div class="uploader" id="uniform-siteImg">
<input class="input-small focused" id="siteImg" name="siteImg" type="file" value=""><span class="filename" style="-webkit-user-select: none;">bg7.jpg</span>
<span class="action" style="-webkit-user-select: none;">Kies bestand</span>
</div>
Zoals je ziet, ook hier geen value in de file input.
- SanThe - op 26/01/2014 15:22:52:
Bij een input type="file" zie je de value niet zomaar.
Er IS ook gewoon geen value.
Even snel het volgende uitgevoerd om het, voor dit topic, zeker te weten.
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
<?php
if (isset($_FILES['siteImg'])){
move_uploaded_file($_FILES['siteImg']['tmp_name'], 'uploads/'.$_FILES['siteImg']['name']);
}
else{
echo 'Geen bestand geselecteerd';
}
?>
if (isset($_FILES['siteImg'])){
move_uploaded_file($_FILES['siteImg']['tmp_name'], 'uploads/'.$_FILES['siteImg']['name']);
}
else{
echo 'Geen bestand geselecteerd';
}
?>
En natuurlijk komt er terug: "Geen bestand geselecteerd"
Bedankt SanThe!
Omdat ik uniform.js ff snel wilde testen in een form had ik alleen <form action="bladiebla"> aangemaakt.
Nadat uniform.js wel prima werkte heb ik die form gewoon gekopieerd naar mijn projectje.
Opgelost! Dus bedankt!