- Posts: 58
- Thank you received: 5
Welcome to the LimeSurvey Community Forum
Ask the community, share ideas, and connect with other LimeSurvey users!
jquery ne s'applique pas sur une classe css ajoutée à une question
- MMAA68
- Topic Author
- Offline
- Senior Member
Less
More
3 years 2 months ago - 3 years 2 months ago #211429
by MMAA68
jquery ne s'applique pas sur une classe css ajoutée à une question was created by MMAA68
Bonjour à tous,
J'ai un questionnaire où l'on souhaite formater un n° de téléphone après saisie. Exemple : on saisit 0322334455 et cela devrait devenir 03 22 33 44 55.
Pour cette question j'ai défini une classe tel-10car-ajout-espaces.
Dans le fichier custom.js j'ai donc rajouté à la fin :
$( document ).ready(function() {
$('.tel-10car-ajout-espaces input').change(function() {
var number = $(this).val().replace(/[^\d]/g, '')
if (number.length == 10) {
number = number.replace(/(\d{2})(\d{2})(\d{2})(\d{2})(\d{2})/, "$1 $2 $3 $4 $5");
}
$(this).val(number);
});
});
Quand je lance le questionnaire (depuis l'admin), j'ai une première page d'information, je fais "suivant", j'arrive sur la page avec le n° de téléphone à saisir.
si je saisis le n° de téléphone, je clique sur une autre question, le n° de téléphone n'a pas été modifié.
Si je rafraichis la page, je saisis à nouveau le n° de téléphone, en changeant de question, les espaces sont bien ajoutés au n° de téléphone.
J'ai testé avec Edge, Chrome, çà fait pareil, il faut que la page soit rafraichie pour que cela fonctionne.
J'ai essayé avec d'autres fonctions jquery : .blur, .focusout toutes fonctionnent mais uniquement après rafraichissement de la page.
Auriez-vous une explication ?
Merci d'avance
Ci-dessous la partie du source de la page qui se rapporte à la question :
<!-- Question 2511 -->
<div id="question2511" class="row text-short tel-10car-ajout-espaces question-container " >
<!-- Question Q018 -->
<!-- Question text -->
<div class=" question-title-container bg-primary col-xs-12 " >
<div class=" question-text " >
<div id="ls-question-text-161454X223X2511" class=" ls-label-question " >
Questions de type texte - Zone de texte court - type:S
</div>
</div>
</div>
<!-- LimeSurvey valid message and help -->
<div class=" question-valid-container bg-primary text-info col-xs-12" >
<div class="ls-question-help " role="alert" id="vmsg_2511" >
<div id='vmsg_2511_regex_validation' class='ls-question-message ls-em-tip em_regex_validation'>
<span class='fa fa-exclamation-circle' aria-hidden="true"></span>
Veuillez vérifier le format de votre réponse.</div>
</div>
</div>
<!-- Answer -->
<div class=" answer-container col-xs-12" >
<!-- answer -->
<div class='ls-answers answer-item text-item ls-input-maxchars ls-input-sized'>
<!-- Prefix -->
<!-- Input -->
<input
class="form-control "
type="text"
name="161454X223X2511"
id="answer161454X223X2511"
value="0000000000"
size="15"
maxlength="10"
aria-labelledby="ls-question-text-161454X223X2511"
/>
<!-- Suffix -->
</div>
<!-- end of answer -->
</div>
<!-- Survey question help -->
<div class=" question-help-container text-info col-xs-12 " >
<div class=" ls-questionhelp ">
Un numéro de téléphone S.V.P.
</div>
</div>
<!-- End of question Q018 -->
</div>
<!-- End of question 2511 -->
Cordialement
Denis
J'ai un questionnaire où l'on souhaite formater un n° de téléphone après saisie. Exemple : on saisit 0322334455 et cela devrait devenir 03 22 33 44 55.
Pour cette question j'ai défini une classe tel-10car-ajout-espaces.
Dans le fichier custom.js j'ai donc rajouté à la fin :
$( document ).ready(function() {
$('.tel-10car-ajout-espaces input').change(function() {
var number = $(this).val().replace(/[^\d]/g, '')
if (number.length == 10) {
number = number.replace(/(\d{2})(\d{2})(\d{2})(\d{2})(\d{2})/, "$1 $2 $3 $4 $5");
}
$(this).val(number);
});
});
Quand je lance le questionnaire (depuis l'admin), j'ai une première page d'information, je fais "suivant", j'arrive sur la page avec le n° de téléphone à saisir.
si je saisis le n° de téléphone, je clique sur une autre question, le n° de téléphone n'a pas été modifié.
Si je rafraichis la page, je saisis à nouveau le n° de téléphone, en changeant de question, les espaces sont bien ajoutés au n° de téléphone.
J'ai testé avec Edge, Chrome, çà fait pareil, il faut que la page soit rafraichie pour que cela fonctionne.
J'ai essayé avec d'autres fonctions jquery : .blur, .focusout toutes fonctionnent mais uniquement après rafraichissement de la page.
Auriez-vous une explication ?
Merci d'avance
Ci-dessous la partie du source de la page qui se rapporte à la question :
<!-- Question 2511 -->
<div id="question2511" class="row text-short tel-10car-ajout-espaces question-container " >
<!-- Question Q018 -->
<!-- Question text -->
<div class=" question-title-container bg-primary col-xs-12 " >
<div class=" question-text " >
<div id="ls-question-text-161454X223X2511" class=" ls-label-question " >
Questions de type texte - Zone de texte court - type:S
</div>
</div>
</div>
<!-- LimeSurvey valid message and help -->
<div class=" question-valid-container bg-primary text-info col-xs-12" >
<div class="ls-question-help " role="alert" id="vmsg_2511" >
<div id='vmsg_2511_regex_validation' class='ls-question-message ls-em-tip em_regex_validation'>
<span class='fa fa-exclamation-circle' aria-hidden="true"></span>
Veuillez vérifier le format de votre réponse.</div>
</div>
</div>
<!-- Answer -->
<div class=" answer-container col-xs-12" >
<!-- answer -->
<div class='ls-answers answer-item text-item ls-input-maxchars ls-input-sized'>
<!-- Prefix -->
<!-- Input -->
<input
class="form-control "
type="text"
name="161454X223X2511"
id="answer161454X223X2511"
value="0000000000"
size="15"
maxlength="10"
aria-labelledby="ls-question-text-161454X223X2511"
/>
<!-- Suffix -->
</div>
<!-- end of answer -->
</div>
<!-- Survey question help -->
<div class=" question-help-container text-info col-xs-12 " >
<div class=" ls-questionhelp ">
Un numéro de téléphone S.V.P.
</div>
</div>
<!-- End of question Q018 -->
</div>
<!-- End of question 2511 -->
Cordialement
Denis
Last edit: 3 years 2 months ago by MMAA68.
The topic has been locked.
- DenisChenu
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 13648
- Thank you received: 2491
3 years 2 months ago #211430
by DenisChenu
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
Replied by DenisChenu on topic jquery ne s'applique pas sur une classe css ajoutée à une question
Bizare, pour moi : c'est OK …
Tu peux essayer $('.tel-10car-ajout-espaces input').on("change",function() { ou $('.tel-10car-ajout-espaces input').on("blur",function() {
Mais cela ne devrait pas chanher grand chjose.
Peut être version de LimeSurvey ? (désactiver le mode ajax)
Tu peux essayer $('.tel-10car-ajout-espaces input').on("change",function() { ou $('.tel-10car-ajout-espaces input').on("blur",function() {
Mais cela ne devrait pas chanher grand chjose.
Peut être version de LimeSurvey ? (désactiver le mode ajax)
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
The topic has been locked.
- MMAA68
- Topic Author
- Offline
- Senior Member
Less
More
- Posts: 58
- Thank you received: 5
3 years 2 months ago - 3 years 2 months ago #211431
by MMAA68
Replied by MMAA68 on topic jquery ne s'applique pas sur une classe css ajoutée à une question
Merci Denis,
on("change", ... je crois que j'avais mis çà au départ.
Pour la version j'ai la Version 3.17.16+190906
J'essaie tout çà
on("change", ... je crois que j'avais mis çà au départ.
Pour la version j'ai la Version 3.17.16+190906
J'essaie tout çà
Last edit: 3 years 2 months ago by MMAA68.
The topic has been locked.
- MMAA68
- Topic Author
- Offline
- Senior Member
Less
More
- Posts: 58
- Thank you received: 5
3 years 2 months ago #211433
by MMAA68
Replied by MMAA68 on topic jquery ne s'applique pas sur une classe css ajoutée à une question
The topic has been locked.
- DenisChenu
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 13648
- Thank you received: 2491
3 years 2 months ago #211434
by DenisChenu
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
Replied by DenisChenu on topic jquery ne s'applique pas sur une classe css ajoutée à une question
On a supprime le mode ajax des nouvelles version.
Fonctionnalité de M……… que aucun dev externe ne voulait (comme cela en tous cas).
Fonctionnalité de M……… que aucun dev externe ne voulait (comme cela en tous cas).
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
The following user(s) said Thank You: MMAA68
The topic has been locked.
- MMAA68
- Topic Author
- Offline
- Senior Member
Less
More
- Posts: 58
- Thank you received: 5
3 years 2 months ago - 3 years 2 months ago #211435
by MMAA68
Replied by MMAA68 on topic jquery ne s'applique pas sur une classe css ajoutée à une question
Last edit: 3 years 2 months ago by MMAA68.
The topic has been locked.
Moderators: Nickko