Refresh en autofocus

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Guillaume Storimans

Guillaume Storimans

02/12/2019 14:30:48
Quote Anchor link
Hallo allemaal,

Ik heb een script dat nu een div refresh werkt super.
Maar nu wilde ik autofocus gaan doen in een text field.
Dit werkt even daarna valt autofocus weg..
Nu had ik een script gevonden maar dan werkt refresh niet meer.
Kan iemand mij helpen ?
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
<script type="text/javascript">
        $(document).ready(function () {
            var refreshId = setInterval(function () {
                $('#refresh').load(' #refresh');
            }, 10000);
        });
       myFocusFunction(){
 let myInput = document.getElementById('idOfInput');
 setTimeout(function() {
  myInput .focus();
 }, 100);
}
    </script>

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
<input type="text" id="serial" name="zoeken" placeholder="Serial nummer" onblur="this.focus()" ng-blur="myFocusFunction"  required autofocus>

Edit:
Ik heb code-tags geplaatst. Gelieve dit in het vervolg zelf toe te voegen aan je bericht.
Zie ook: Veel gestelde vragen: Welke UBB-codes kan ik gebruiken.


Bedankt alvast
Gewijzigd op 02/12/2019 14:43:37 door - Ariën -
 
PHP hulp

PHP hulp

19/03/2024 03:32:13
 
Thomas van den Heuvel

Thomas van den Heuvel

02/12/2019 14:47:28
Quote Anchor link
Staat het textveld in de div die gerefresht wordt?

Hoe dan ook, waarschijnlijk heeft het pas zin om de focus terug te geven op het moment dat deze div klaar is met laden? Dus in dat opzicht lijkt mij de meest logische plaats om dit te doen in de callback-functie van de load aanroep. In de derde parameter van load zet je dus een naamloze functie die de focus (terug)geeft aan het textveld.

Als het textveld in de div zelf staat (die ververst wordt) lijkt mij deze aanpak ook verplicht, omdat het textveld anders mogelijk nog niet bestaat als je direct probeert de focus hier naar te verplaatsen terwijl de div nog aan het laden is.

Uiteraard moeten de verwijzingen naar de namen van de id's ook kloppen als je wilt dat het werkt. Zo zou "idOfInput" in het bovenstaande fragment waarschijnlijk aangepast moeten worden naar "serial". Maar mogelijk heb je in het bovenstaande fragment twee varianten geplaatst die hetzelfde doen, of probeer je deze te combineren of wat dan ook.
Gewijzigd op 02/12/2019 14:48:32 door Thomas van den Heuvel
 
Guillaume Storimans

Guillaume Storimans

02/12/2019 14:53:01
Quote Anchor link
de div staat boven aan die alles refresht. dit werkt zonder de focus script.
Maar wanneer is deze er weer tussen zet werkt de focus wel maar refresh niet.
Ik heb de is aangepast..
 
Thomas van den Heuvel

Thomas van den Heuvel

02/12/2019 15:02:21
Quote Anchor link
Weet trouwens niet precies wat voor functionaliteit het betreft? Is het ook bijvoorbeeld de bedoeling dat de timeout wordt opgeschort als iemand begint te typen? Of is het een soort quiz waarbij je een beperkte tijd hebt om iets in te voeren ofzo? Ik zou het zelf nogal irritant vinden als een (deel van) een pagina refreshed terwijl ik nog aan het typen ben :p. Maar dit hangt dus af van de locatie van dit invoerveld, en of deze mee ververst wordt.
Gewijzigd op 02/12/2019 16:47:19 door Thomas van den Heuvel
 
Guillaume Storimans

Guillaume Storimans

02/12/2019 15:06:03
Quote Anchor link
Daar heb je wel een punt.
het is een systeem dat allemaal serial nummers bij houd.
even een voorbeeld. ik voer een serial nummer in en de gegevens komen tevoorschijn.
miss dat jij iets als alternatief kan geven. (Jquery is niet mijn tak helaas :$)
 
Thomas van den Heuvel

Thomas van den Heuvel

02/12/2019 16:58:36
Quote Anchor link
Hangt er een beetje vanaf hoeveel mensen op enig moment informatie aan het invoeren zijn, maar anders (als er maar één persoon is) zou je kunnen volstaan met een refresh op het moment dat er daadwerkelijk iets verandert. En je zou het invoeren en het weergeven van informatie los van elkaar kunnen trekken zodat enkel de div met deze data ververst? Dit zou je dan kunnen doen met AJAX-calls. Eentje voor het POSTen van data zodat je nooit wegnavigeert van de huidige pagina een eentje voor het ophalen van een lijst van serienummers.

Als het een interactief geheel is (dat je realtime ook invoer van anderen ziet verschijnen) wordt het een ander verhaal en moet je ook aan een iets andere oplossing gaan denken.

Ben je ook daadwerkelijk data aan het invoeren of gaat het hier om zoekfunctionaliteit oid? Wat is de toepassing van deze functionaliteit precies?
 
Guillaume Storimans

Guillaume Storimans

02/12/2019 19:58:23
Quote Anchor link
Het gaat om meerdere gebruikers. Die real time alles moeten zien.
Dit omdat er op de vloer meerdere systeem zijn zodat iedereen weet wat wel en niet goed is..
En de zoek functie is om het sneller en makkelijker te maken.
Dus dacht ik dat het wel zou werken met een zoekfunctie..
Maar ideeen sta ik altijd open voor ;)

(bedankt voor het mee denken)
 
Yoop Overmaat

Yoop Overmaat

02/12/2019 21:03:54
Quote Anchor link
Dat een autofocus na een toetsaanslag of muisbeweging wegvalt is normaal en is verder weinig aan te doen.

In je tekstveld een autofocus toevoegen & en deze overnemen bij het verzenden onder jquery lijkt me een simpelere oplossing. Voorbeeld:

<script>
$("#ingang").submit(function(e) {
var form = $("#ingang");
e.preventDefault();
$.ajax({
method: "POST",
url: form.attr("action"),
cache: false,
data: form.serialize(),
success: function(result) {
$(".msge").val("");
$(".msge").focus();
}
});
});
</script>

<script>:
$(document.ready(function() { //is aan het begin v/h script wel geopend
//bla,
//bla,
//bla.
}); //maar aan het einde niet.
</script>

Dit voorgaande geeft de meest vage foutmeldingen, de webdevelopper is je vriend in deze want een var/log/apache2/error.log geeft de jquery fouten niet weer.
Gewijzigd op 02/12/2019 21:07:15 door Yoop Overmaat
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.