select() sous chrome

Par thierrysudfr, il y a 13 ans

Javascript

Bonsoir à tous,
petit problème pour sélectionner le texte dans un input :

<script>
$(document).ready(function(){
$(#Date).focus().select();
)};
</script>

Ce petit code donne le focus au champ 'Date' à l'ouverture du formulaire, et sélectionne la date contenue dans le champs (date du jour par défaut). Le focus est bien donné, mais le texte ne se sélectionne pas sous chrome (OK sous FF et IE9).

Merci d'avance de vos avis.

cordialement.
Thierry.

9 réponses

thierrysudfr, il y a 13 ans

Bonjour,
j'ai refait un petit test ce matin, sur un tout petit script :

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
</head>
<body>
<form id="test">
    <input type="text" id="champTest" name="champTest" value="Ceci est un test" />
</form>
<script>
$('#champTest').focus().select();
</script>

et là, ça fonctionne parfaitement sous chrome ?!!
Je précise que le formulaire sur lequel ça ne fonctionne pas est chargé en Ajax, et qu'il est généré par une classe php.

Quelqu'un a-t-il une idée ?

Merci.
Thierry

RedaElkhayat, il y a 13 ans

Salut.
si tu veux récupérer la valeur du champ

$('elem').val();

et si tu veux sélectionner le champ c'est juste 

$('elem').focus();
Nairolf, il y a 13 ans

Je comprend pas vraiment ce que tu veux faire, tu veux récupéré le contenu du input ou juste placer une sélection dessus?

thierrysudfr, il y a 13 ans

Merci Nairolf et Reda pour vos réponses.
Ce que je souhaite, c'est donner le focus au champ ($('elem').focus()), mais également que le contenu de ce champ soit sélectionné ($('elem').select()).
mon script fonctionne sous IE, FF, mais sous chrome, pas toujours. J'ai parcouru le net, il semble que d'autres rencontrent ce problème, mais pas de solution vraiment efficace.
Le plus étonnant, c'est que ça fonctionne dans certains cas (mon petit script), et pas dans d'autres (mon application).

RedaElkhayat, il y a 13 ans

Voila

$('input').focus(function(){
    $(this).select();
    retrun false;
});
elsen, il y a 13 ans

Les évents ne se remettent pas à jour lorsque de nouveaux éléments sont ajoutés à la page.
Comme c'est le cas ici (le formulaire est construit par ajax), je pense que tu devrais utiliser $(#Date).live('focus', function() {}); au lieu de $(#Date).focus(function() {});

Maenhyr, il y a 13 ans

Essaye ceci :

$('input').focus(function(){
    $(this).select(); 
    $(this).mouseup(function(e){ e.preventDefault(); });    
});

J'utilise ce snippet dans un plugin jQuery et cela fonctionne correctement. C'est sans doute ce dont tu as besoin.

thierrysudfr, il y a 13 ans

Merci pour toutes vos réponses, je vais tester tout ça.
Bon week-end à tous

thierrysudfr, il y a 13 ans

Bonjour prbaron, merci pour ta réponse, elle ne fonctionne malheureusement pas dans mon cas.
J'ai trouvé ceci qui fonctionne, même si ça n'est pas très propre :

$('input#Date').focus();
    var temp = setInterval(function(){ // bidouille pour que le select fonctionne sous chrome
        $('input#Date').select();
        clearTimeout(temp)
      }, 5);