focus sur un champ

**da991319** · 13/11/2007, 04h13

Bonjour le forum,

J'aimerai savoir comment faire pour avoir le focus sur un champ en particulier lorsque qu'une vue apparait (avoir le curseur directement dans le champ). Afin que l'utilisateur puisse commencer a remplir le champ sans avoir a cliquer dessus?

merci pour vos reponses

**titoumimi** · 13/11/2007, 10h44

bonjour

Pour donner le focus à un champs, tu peux utiliser du inline RJS :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
= update_page_tag do |page|
  - page['id_de_ton_champs'].focus()

(version HAML

)

PB

**Zfred** · 14/11/2007, 14h03

Ah ouais pas mal !
Sinon le classique javascript :
<body onload="javascript:document.getElementById('id').focus();">
et j'ai à peine honte de poster ça dans le forum Rails

**SekYo** · 15/11/2007, 01h24

Si possible il vaut mieux éviter d'utiliser le "onload". Par contre j'imagine que Prototype a bien un event du type "document ready", qui se lance quand le DOM est chargé, c'est celui là qu'il faut utiliser (en jQuery c'est $(document).ready())

**Zfred** · 15/11/2007, 11h36

Pourquoi il faut éviter le onload ?

Sinon on doit pouvoir faire un simple script en bas de page (pour éviter "onload") :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
<script language="javascript">
document.getElementById('id').focus();
</script>

Mais je reconnais ne pas avoir testé, et il se peut qu'il arrive des cas où le script se lance avant que l'élément cible ne soit encore chargé...

**Zfred** · 15/11/2007, 15h34

Voila j'ai trouvé le "Rails Way"

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<%= javascript_tag "$('id_du_champ').focus()" %>

**bab_dev** · 15/11/2007, 15h51

Merci a toi!

J'en avais besoin aussi mais la version de mettre le script en javascript en bas de page ne me plaisait pas trop...

**da991319** · 15/11/2007, 16h30

Bonjour tout le monde,
Peut etre que j'aurais du poster ma question sur le forum de javascript

J'ai essaye certaines de vos reponses et je n'ai pas de resultats flagrants desole,
Je pense que je place mal mes appels.
Grace a SekYo j'ai pense a regarder dans prototype (chose a laquelle je ne pense pas) et j'ai trouve la fonction focusFirstElement qui pourrait faire l'affaire. Apres quelques recherches pour savoir comment la fonction s'appelait j'ai trouve ici que l'on pouvait apparement utiliser "onload" comme Zfred le disait. Ta derniere solution Zfred me parait vraiment cool mais je dois mal la placer car il ne se passe rien.
Voici comment mes views se presentent.

Layout:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
<head>
  <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
  <title>Gestion des inventaires</title>
  <%= stylesheet_link_tag 'scaffold' %>
  <%= javascript_include_tag :defaults %>
</head>
<body>
    <p style="color: green"><%= flash[:notice] %></p>
    <% if logged_in?%>
    <%= @content_for_layout %>
</body>

view New

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
<h1>New pstandard</h1>
 
 
<% form_tag :action => 'create' do %>
  <%= render :partial => 'form' %>
  <%= submit_tag "Create" %>
<% end %>
 
<%= link_to 'Back', :action => 'list', :etat => 'open' %>

partial _form

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<!--[form:pstandard]-->
 
<div id='produit_nom'>
<p><label>Nom du produit standard</label><br/>
<%= text_field_with_auto_complete :pstandard, :nom  %><br/></p> </div>

Je ne sais pas trop ou placer

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<%= javascript_tag "$('produit_nom').focus()" %>

J'ai essaye de la mettre a differents endroits mais ca ne change rien.

Si jamais ca vous parle

**titoumimi** · 15/11/2007, 16h37

produit_nom, c'est le nom d'un div, pas d'un élément de formulaire

La notion de focus est donc HS ici.

Pis le code javascript, je préfère le placer juste avant le /body, au moins je suis sûr que tout ce à quoi je peux faire référence est chargé

**da991319** · 15/11/2007, 16h38

Ca y est j'ai trouve je ne mettais pas le bon nom pour mon champ, il fallait

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<%= javascript_tag "$('pstandard_nom).focus()" %>

et non

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<%= javascript_tag "$('produit_nom').focus()" %>

merci pour vos reponse

**da991319** · 15/11/2007, 16h40

Envoyé par titoumimi

produit_nom, c'est le nom d'un div, pas d'un élément de formulaire

La notion de focus est donc HS ici.

Pis le code javascript, je préfère le placer juste avant le /body, au moins je suis sûr que tout ce à quoi je peux faire référence est chargé

desole je n'avais pas vu ton post

**SekYo** · 16/11/2007, 01h51

Envoyé par Zfred

Pourquoi il faut éviter le onload ?

Parce qu'il me semble que le DOM n'est pas encore forcément chargé quand le onload est activé. Donc si tu veux essayer d'accéder à un élément alors que le DOM est pas complètement chargé, pour y mettre le focus, ca peut créer des suprises (bien entendu pour une opération ne souhaitant pas accéder à des éléments du DOM c'est pas génant).
Surtout que j'imagine que c'est le genre de problèmes plus ou moins aléatoires et merdiques à debugger, donc autant pas se faire chier et "attendre" que le DOM soit chargé complètement

**Zfred** · 16/11/2007, 13h34

@SekYo : Oui ok, c'est effectivement le probleme que j'entrevoyais...
Merci d'avoir pris le temps de répondre

focus sur un champ

Ruby on Rails

Discussions similaires

Partager

Partager