Gå til innhold

Auto submit form etter ingen taster er trykket på x sekunder

Datasmurfen

Anbefalte innlegg

Datasmurfen

Datasmurfen

Skrevet
Skrevet (endret)

Hei,

 

Har noen gamle butikk-scannere som jeg sitter å leker litt med.

 

Spørsmålet mitt er hvordan skal jeg få formen til å automatisk submit etter X sekunder dersom noe har blitt skrevet/scanna inn? Vil helst ikke at submit knappen vises i det heletatt på skjermen.

 

Scriptet som står under kan sees her. 

<html>
<html>
<body>

<!--  Fil som scriptet skal kalle på  !-->
<form action="check-status.php">

<!--  varenummer skal bli inputet fra EAN(Strekkode) scanner her. 
Autofocus taggen gjør at text field blir automatisk selectert når brukeren laster siden.
!-->
  varenummer: <input type="text" name="fname" autofocus><br>
<!--  Denne skal automatisk prossesere formen, helst uten submit knappen er synlig.  !--> 
 <input type="submit" value="Sender varnummer">
</form>
</body>
</html>
Endret av Datasmurfen
Lenke til kommentar

Videoannonse

Videoannonse
Annonse
Thorbear

Thorbear

Skrevet
Skrevet 
if (document.getElementsByName("fname")[0].value != "") {
    setTimeout("document.foo.submit()", 10 * 1000);
}

Ut i fra det du beskriver er du kanskje egentlig interessert i at skjemaet automatisk blir sendt umiddelbart etter at scanneren fyller inn en verdi, for dette kan du kikke på "onchange". Om du ønsker å gjøre det ekstra avansert kan du også lytte på "onkeyup" slik at man må sende skjemaet manuelt om man har skrevet inn varenummer manuelt, men at det ellers går automatisk.

Lenke til kommentar
Datasmurfen

Datasmurfen

Skrevet
  • Forfatter
Skrevet

Mulig jeg har misforstått deg, men den siste endringen ser ikke ut til å virke? 

<html>
<html>
<body>

<script>
if (document.getElementsByName("fname")[0].value != "") {
    setTimeout("document.foo.submit()", 10 * 1000);
}
</script>

<!--  Fil som scriptet skal kalle på  !-->
<form action="check-status.php "name="foo">

<!--  Varenummer  skal bli inputet fra EAN(Strekkode) scanner her. 
Autofocus taggen gjør at text field blir automatisk selectert når brukeren laster siden.
!-->
  Varenummer : <input type="text" name="fname" size="200" autofocus><br>
<!--    !--> 
 <input type="submit" value="Sender varenummer ">
</form>
</body>
</html>
Lenke til kommentar
Thorbear

Thorbear

Skrevet
Skrevet

Ah, selvfølgelig, jeg veit ikke helt hva jeg tenkte på der, var vel mest for å vise hvordan man kunne sjekke om et input-felt inneholdt noe tekst.

Om det er meningen at koden skal sjekke hver 10. sekund om det er noe i feltet, og sende skjemaet hvis det er noe der, så blir koden noe slikt:

function autoSubmit() {
    if (document.getElementsByName("fname")[0].value != "") {
        document.foo.submit();
    } else {
        setTimeout(autoSubmit, 10 * 1000);
    }
}

Også må denne funksjonen kalles én gang i det siden åpnes, f.eks:

<body onload="autoSubmit()">
  • Liker 1
Lenke til kommentar
Feh

Feh

Skrevet
Skrevet (endret) 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script>
$(document).ready(function() {
	$('#barcode_input').keypress(function() {
		if($(this).val() === "") {
			//ikke gjør noe så lenge inputet er tomt
		} else {
			setTimeout(function() {
				var barcode = $('#barcode_input').val();
				$.ajax({
					url: 'check_status.php',
					data: { barcode:barcode },
					type: 'get',
					success: function(output) {
						$('#output').html(output);
						$('#barcode_input').val('');
					}
				});
			}, 2000);
			
		}
	});
});
</script>

<!--  Fil som scriptet skal kalle på  !-->
<form id="barcode_form">

<!--  Varenummer  skal bli inputet fra EAN(Strekkode) scanner her. 
Autofocus taggen gjør at text field blir automatisk selectert når brukeren laster siden.
!-->
  Varenummer : <input type="text" name="barcode" id="barcode_input" size="200" autofocus><br>
<!--    !-->
</form>

<div id="output"></div>

check_status.php

<?php
	$barcode=$_GET['barcode'];
	
	//inkluder noe her, som f.eks spørring mot databse for å vise noe, eks. hent varedetaljer
	
	//later som vi finner varens informasjon, SELECT * FROM products WHERE barcode='$barcode', while($row= etc. etc.
	
	$product_name='Leverpostei';
	$price='12,90';
	$description='Deilig leverpostei som smaker like godt for store og små!';
?>
	<h2>Vare: <?php echo $product_name; ?></h2>
    <p>Pris: <?php echo $price; ?></p>
    <p>Varebeskrivelse: <?php echo $description; ?></p>

I et isolert script gjør det ingenting å binde onload events til body elementet, men generelt sett er det en "not recomended" practice. Det kan være nyttig dersom ting skal lastes inn så kjapt som mulig (i forhold til window/document ready), men bør unngås om mulig.

 

Script delen over bør selvsagt inkluderes mellom dokumentets <head> og </head> tager istedenfor i body.

 

Edit: Siden jeg først var så godt i gang lagde jeg en ajax versjon istedet, så slipper du å se at siden "postes" og formen resettes når resultatet er klart.

Endret av Feh
Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste
×
×
  • Opprett ny...