Autofocus op textarea

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Nick Smit

Nick Smit

03/04/2014 14:58:59
Quote Anchor link
Hallo,

Ik heb een systeem waardoor als er op gegevens geklikt word dat er een textarea opent en dat de gegevens bewerkt kunnen worden. Ik zou nu alleen graag willen dat als ik op de text klik dat er de cursor dan ook verschijnt(en het toetsenbord op tablets) waardoor de gebruiker direct kan beginnen met typen. Als de gebruiker blurt dan moeten de gegevens automatisch opgeslagen worden.

Het gene wat dus niet lukt is het automatische focussen op de textarea.

De javascript code:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
function create_input(element, type, attr, onblur) {
    
        if($(_this).children().hasClass('madeinput')) return;
    
     switch(type) {
        
        case 'textarea':
            create_textarea(element, attr, onblur);
         break;
        
     }
    
}

function create_textarea(element, attr, onblur) {
    
    var c = $(_this).html();
    var r = Math.random();
    
    $(_this).html('<textarea id="' + r + '" onblur="save_input(this)" class="madeinput">' + c + '</textarea>');
    $('#'+r).focus();
}


De HTML code:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
<td onclick="create_input(this, 'textarea');">Blablabla</td>


Ik heb ook geprobeerd een timer in te stellen om er zeker van zijn dat de textarea al echt aanwezig is voor het uitvoeren van de focus. Dit werkte niet. Verder heb ik momenteel even geen ideeën hoe ik dit moet realiseren.

Nick
 
PHP hulp

PHP hulp

29/03/2024 08:36:03
 
Michael -

Michael -

03/04/2014 15:01:40
Quote Anchor link
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
window.onload = function() {
    document.getElementById('het id van je textarea').focus();
}
 
Nick Smit

Nick Smit

03/04/2014 15:47:31
Quote Anchor link
Michael ik heb de optie geprobeerd maar niet wereknd gekregen. Ik heb nu wel de oplossing gevonden, het probleem was dat de Math.random() functie een float teruggeeft(bv: 0.73427438743). Hierdoor kan het ID niet gevonden worden in de selector.

Ik heb dit opgelost door toString().substr(2,5) te gebruiken. Dit zal alleen niet de meest effiecente optie zijn. Hoe kan ik dit beter oplossen?

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
function create_textarea(_this, attr, onblur) {
    
    var c = $(_this).html();
    var r = Math.random().toString().substr(2,5); // <-- Deze regel
    
    
    $(_this).html('<textarea id="' + r + '" onblur="save_input(this);" class="madeinput">' + c + '</textarea>');
    $('#' + r).focus();
    
}
 
Ivo P

Ivo P

03/04/2014 18:43:03
Quote Anchor link
mag een id van een html-element wel numeriek zijn / met een cijfer beginnen?
 



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.