ugrás a tartalomhoz

Képfájl ellenőrzése javascriptel

vikgfk · 2014. Már. 12. (Sze), 23.13
Sziasztok
Van egy űrlapom ahol szöveges tartalom mellett négy képfájlt is fel lehet tölteni.
A négy képfájl közül csak az első főképet szeretném ellenőrizi hogy a felhasználó betallózott-e képet ha igen akkor simán engedném neki a tartalom feltöltését az adatbázisba.
Ha nem akar vagy netán valami oknál fogva kihagyta volna akkor egy javascriptes felugró ablakkal szeretném figyelmeztetni hogy kép nélkül töltöd fel?
Ha igen akkor az ok gombbal lehetne feltölteni az űrlapot kép nélkül.
Ha netán meg mégis meggondolná hogy még tesz fel képet akkor meg a mégse gomb lenyomását követően vissza tudna lépni az űrlapra anélkül hogy feltöltene valamit is az adatbázisba.
A kódom így néz ki:
<form enctype="multipart/form-data" method="post" >
 
                <td>Kép feltöltése:
                <input type="file" name="kep" />
                </td>
 
<td height="30"><input type="submit" name="form_submit"  value="Mentés" />
                </td>
 
</form>
 
<script>
<!--
    function kerdes()
    {
        if(confirm("Valóban kép nélkül mented?"))
        {
            return true;
        }
        else return false;
    }
-->    
</script>

Miképpen tudnám én a function kerdest() leellenőrzi hogy nem az input mező type="file"-re kellene hivatkoznom mert ugyebár van négy kép feltöltési lehetőség és én csak a főképet szeretném leellenőrizni?
‹ text box értéke Egyéni html segítség ›
 ■
1

<form id="upload"

Karvaly84 · 2014. Már. 12. (Sze), 23.41

<form id="upload" enctype="multipart/form-data" method="post" action="upload.php">
	<input type="file" id="image" name="image" multiple="multiple">
	<input type="submit" value="Feltölt">
</form>
<script>
	
	document.getElementById("upload").addEventListener("submit", function(e) {
		
		var image = document.getElementById("image");
		
		if (!image.files.length) {
			if (!window.confirm("Kép nélkül töltöd fel?")) {
				e.preventDefault()
				image.focus();
			}
		}
		
		
	}, false);
			
</script>
2

<form id="upload"

vikgfk · 2014. Már. 13. (Cs), 00.29
Köszi majdnem tökéletesen működik, igaz hogy a form részből kiszedtem az action="upload.php" részt mer így állandóan a upload.php akarta megnyitni.

A problémám az vele hogy az űrlapban van több beviteli mező, amiket leellenőrzök hogy ki van-e töltve vagy netán megfelelő karaktereket tartalmazza.
Mármost ha nincsen kép akkor elsőnek a kép nem létére feldobja az ablakot és ha le szeretném menteni akkor kiírja a hibákat a beviteli mezőkhöz.

Ezt nem-e lehetne úgy megoldani hogy elsőnek le tudnám ellenőrizni hogy a beviteli mezők jól vannak-e kitöltve és csak aztán leellenőrizni magát a képet.
Ez ellenőrzést így oldom meg minden mezőnél:
if(!$arRange)
{

print("<div id='hiba'>Ár megadása kötelező!</div>");
$hiba=1;
}
elseif(!preg_match($hirdetes_arRange, $arRange))
{
print("<div id='hiba'>Ár csak számokat tartalmazhat és maximum 8 karakter lehet!</div>");
$hiba=1;
}
és így tovább minden egyes beviteli mezőhöz.
3

Most amit belinkeltél az

Karvaly84 · 2014. Már. 13. (Cs), 00.55
Most amit belinkeltél az PHP... Ha az árat akarod ellenőrizni JavaScript-el megoldható, ugyan abban a rutinban. Itt a módosított változat:

<form id="upload" enctype="multipart/form-data" method="post">
	<label for="image">Képek:</label>
	<input type="file" id="image" name="image" multiple="multiple"><br>
	<label for="price">Ár:</label>
	<input type="text" id="price" name="price"><br>
	<input type="submit" value="Feltölt">
</form>
<script>
	
	document.getElementById("upload").addEventListener("submit", function(e) {
		
		var price = document.getElementById("price");
		if (!(/^[\d]{0,8}$/).test(price.value)) {
			e.preventDefault();
			window.alert("Az ár csak számokat tartalmazhat, és maximális hosszúsága 8 karakter!");
			price.focus();
			return;
		}
		
		var image = document.getElementById("image");
		
		if (!image.files.length) {
			if (!window.confirm("Kép nélkül töltöd fel?")) {
				e.preventDefault()
				image.focus();
			}
		}
		
		
	}, false);
			
</script>
De ettől még szerver oldalon ne hagyd ki az ellenőrzést. Javaslom a jQuery-t használni, mivel hogy az általam mutatott példa inkább a logikára helyezi hangsúlyt, IE7, IE8 hibát fog generálni.