Impossible pour moi de trouver la réponse à cette question :
Pour utiliser jQuery UI, il est possible de passer par un CDN
- Il n'existe aucun CDN pour jQuery UI
- Le code JavaScript de jQuery UI est disponible sur le CDN de jQuery, mais pas les thèmes
- Le code JavaScript et les thèmes de jQuery UI sont accessibles sur le CDN de jQuer
Dans le cours, il est stipulé qu'on peut passer par les CDN de google pour jQuery UI et les thémes.
J'élimine donc la premiére réponse.
Je ne sais pas si les thémes sont accessible sur le cdn de jQuery, c'est le genre de question piége qui n'apporte rien qui m'agace un peu a vrai dire. Des suppositions de votre part?
J'ai une question en lien avec le cours : je crois que mes méthodes .hover et.click ne fonctionnent pas.
Dans le premier TP (celui avec les images "question", "bon", et "mauvais"), le .hover ne fonctionnait pas, quand bien même j'avais copié collé la correction et adapté toutes mes sources. Le reste fonctionnait à merveille.
Et maintenant que je suis sur la première activité, je suis coincée. Quelqu'un à une idée de ce que ça peut bien être?
<body>
<form>
<a href="">Tester les réponses</a>
<div class="question">
<div class="texte">
<h2>Question 1</h2>
Le code jQuery s'exécute :<br>
<input type="radio" id="r1" name="q1">Dans le navigateur<br>
<input type="radio" id="r2" name="q1">Sur le serveur où est stocké le code<br>
<input type="radio" id="r3" name="q1">Tantôt dans le navigateur, tantôt sur le serveur<br>
<br><span class="reponse" id="reponse1">Le code jQuery n'est autre que du JavaScript. À ce titre, il s'exécute toujours sur les clients (ordinateurs, tablettes et téléphones) qui font référence à ce code via une page HTML. La bonne réponse est donc la première.</span>
</div>
<img id="img1" src="TP1/interrogation.png" />
</div>
Voici la partie jQuery :
// Action au survol du lien « Tester les réponses »
$('a').hover(
function() {
$('.reponse').show();
if ($(':radio[id="r1"]:checked').val()) {
$('#img1').attr('src', 'TP1/bon.png');
$('#reponse1').css('color', 'green');
}
- Edité par AstriddeGasté 28 avril 2016 à 11:52:43
@Astridde je sais plus exactement comment s'est expliqué dans le cours mais pour faire apparaître un élément il faut le cacher avant en utilisant la fonction hide();
comme ici
$(function() {
// Dissimulation des réponses à faire avant d'appeler la fonction show()
$('.reponse').hide();
....
ensuite ton script est mal fermée du coup sa bug
rajoute ); apres le crochet
desole pour les balises de code je suis sur mon portable
Je viens de terminer la deuxième partie du cours et je suis en train d’essayer la première activité : générateur de formulaires.
Mais ce qui me pose problème c'est que les consignes de l’activité font penser à des notions qui ne sont pas encore abordées à ce stade de cours, les événements: pour réagir aux clics de la souris sur un bouton il faut penser aux événements.
Comment alors pouvez-vous me conseiller : dois-je utiliser les événements classiques de JavaScript à coté de jQuery ? ou bien aller voir la gestion événementielle de la partie 3 puis revenir sur l'activité de la partie 2 ?
Merci d'avance pour vos réponses.
Ce qui est simple est faux. Ce qui est compliqué est inutilisable. Paul Valéry.
de mémoire il faut utiliser la fonction .onClick(); donc n'hésite pas à aller plus loin dans le cours pour voir son fonctionnement je crois pas que cela soit interdit
Je pense aussi que c'est la seule solution pour faire l'exercice étant donné que c'est un TP en jQuery et doit donc être fait en jQuery.
Je trouve néanmoins qu'un TP ne doit pas contenir des notions d'autres parties à venir pour pouvoir respecter l'ordre pédagogique de tous les chapitres du cours.
Merci.
- Edité par sadimov 1 mai 2016 à 15:26:23
Ce qui est simple est faux. Ce qui est compliqué est inutilisable. Paul Valéry.
Mais le problème c'est lorsque que je sélectionne une des suggestions c'est l'id qui s'affiche dans le champ au lieu du "name"...
Merci d'avance pour votre réponse
Salut,
Voici ce que la doc explique :
Array: An array can be used for local data. There are two supported formats:
An array of strings:[ "Choice1", "Choice2" ]
An array of objects withlabelandvalueproperties:[ { label: "Choice1", value: "value1" }, ... ]
The label property is displayed in the suggestion menu. The value will be inserted into the input element when a user selects an item. If just one property is specified, it will be used for both, e.g., if you provide onlyvalueproperties, the value will also be used as the label.
Donc cela me semble le comportement normal.
Et avant de me dire que tu ne passe pas un tableau mais l'url de ton fichier JSON, en cas de String, la doc dit bien :
The data itself can be in the same format as the local data described above.
Donc je pense que tu n'as pas lu la doc avant d'utiliser autocomplete de façon plus complexe
- Edité par AxelHuberty 4 mai 2016 à 23:57:35
Un accès premium d'un mois avec le code AXEL-8RR3 C'est cadeau et c'est illimité !
Ce cours vous permettra de prendre en main le framework jQuery pour exploiter toute la puissance de JavaScript et rendre vos sites web encore plus dynamiques. À partir du 22 septembre, vous y trouverez des quiz et activités pour vous entraîner... et peut-être, vous décrocherez la certification du cours quand vous l'aurez terminé !
Mais le problème c'est lorsque que je sélectionne une des suggestions c'est l'id qui s'affiche dans le champ au lieu du "name"...
Merci d'avance pour votre réponse
Salut,
Voici ce que la doc explique :
Array: An array can be used for local data. There are two supported formats:
An array of strings:[ "Choice1", "Choice2" ]
An array of objects withlabelandvalueproperties:[ { label: "Choice1", value: "value1" }, ... ]
The label property is displayed in the suggestion menu. The value will be inserted into the input element when a user selects an item. If just one property is specified, it will be used for both, e.g., if you provide onlyvalueproperties, the value will also be used as the label.
Donc cela me semble le comportement normal.
Et avant de me dire que tu ne passe pas un tableau mais l'url de ton fichier JSON, en cas de String, la doc dit bien :
The data itself can be in the same format as the local data described above.
Donc je pense que tu n'as pas lu la doc avant d'utiliser autocomplete de façon plus complexe
Merci j'ai bien compris maintenant comment cela fonctionne
j'ai donc essayer de créer un champ hidden mais lorsque je soumet mon formulaire le champs(hidden) renvoie NULL :/
voici mon code :
$( document ).ready(function() {
$('#city').autocomplete({
minLength: 3,
source : function(requete, reponse){ // les deux arguments représentent les données nécessaires au plugin
$.ajax({
type:"POST",
url : "{{ path('last_immo_lead_city') }}", // on appelle le script JSON
dataType : 'json', // on spécifie bien que le type de données est en JSON
data : {
q : $('#city').val(), // on donne la chaîne de caractère tapée dans le champ de recherche
},
success : function(donnee){
reponse($.map(donnee, function(objet){
return {label: objet.zipcode + ' - ' + objet.article + ' ' + objet.name, value: objet.zipcode + ' - ' + objet.article + ' ' + objet.name, id: objet.id}; // on retourne cette forme de suggestion
}));
},
select: function(event, ui) {
$('#city_hidden').val(ui.objet.id);
return false;
}
});
},
});
});
Je veux donc faire apparaître le nom de la ville mais au final envoyer l'id de cette dernière qui doit se trouver dans mon champ "city_hidden"
Bonjour, il n'y a apparemment pas grand monde sur ce cours mais j'ai quand même une question à propos de la première activité "Créez un générateur de formulaires".
J'ai fais le code mais à chaque fois que je clique sur le bouton "label", j'ai plusieurs label qui se se créer. Est-ce qu'il y a un moyen de déclencher l’événement qu'une seule fois ? Le chapitre sur les événement ne fais même pas parti de cette partie 2 donc je trouve que tout cela est un peu confus. Merci de votre aide est voila mon code :
J'ai testé votre code je l'ai copié collé chez moi pour le tester mais je n'ai remarqué aucun problème.Surtout concernant la création de plusieus labels à la fois dont vous parlez.
En effet tous les elements se créent de façon normale.
je ne sais pas vaiment d'où vous vient ce problème .
Ce qui est simple est faux. Ce qui est compliqué est inutilisable. Paul Valéry.
Alors dans ce cas c'est à vous de gérer les choses.c'est à dire d'indiquer à vos boutons de ne générer qu'un seul champ à la fois.
pour ce faire vous pouvez par exemple tester l'existence d'un enfant div chez l’élément #droite avant d'en lui ajouter un, en ajoutant ces 2 lignes à votre code :
je viens vers vous pour un peu d'aide. Cela fait 2h00 que je bloque.
Je suis à l'activité de la partie 2 avec la création du gestionnaire de formulaire.
Lorsque je récupère la valeur de mon input "LABEL" et que je veux l'afficher sur la partie de gauche, la valeur s'affiche quand je clique sur "OK" mais s'efface aussitôt. Quelqu'un aurait-il une idée s'il vous plaît?
Voici le code html:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Générateur de formulaire</title>
<link type="text/css" href="css/style.css" rel="stylesheet">
</head>
<body>
<div id="gauche">
</div>
<div id="droite">
Utilisez ces boutons pour créer votre formulaire<br><br>
<button id="btnlabel">Label</button>
<button id="btntexte">Zone de texte</button>
<button>Bouton</button><br><br>
<hr>
<!-- CONTENU AFFICHABLE
LORSQUE L'ON CLIQUE SUR
CHAQUE BOUTON -->
<form>
<!-- CONTENU DU BOUTON <<LABEL>> -->
<label for="texte1">Texte du label</label>
<input type="text" id="texte1"/>
<button type="submit" id="ok1">OK</button>
</form>
</div>
<!-- SCRIPTS -->
<script src="js/jquery.js"></script>
<script src="js/monscript.js"></script>
</body>
</html>
C'est la solution pour laquelle j'ai fini par opter et ça marche .Mais je ne comprends pas toujours pourquoi les nouveaux boutons ne sont pas détectés par le sélecteur jQuery :
Je ne comprends pas pourquoi c'est impossible.Pourquoi çà doit être sur le même hébergement.
Si on connaît bien l'adresse du serveur et qu'on lui passe le(s) paramètre(s) demandé(s) cela doit normalement fonctionner. peut importe l'origine de la requête ou l'utilisation de la réponse.
d'ailleurs,tous les sites ou presque aujourd'hui utilisent des services fournis par d'autres sites qui ne sont pas bien sûr sur le même hébergement.Comment font-ils alors pour appeler ces services ?
Merci d'avance à votre aide.
Ce qui est simple est faux. Ce qui est compliqué est inutilisable. Paul Valéry.
J'ai besoin d'un petit coup de main pour résoudre ce problème :
j’étais en train de lire le chapitre 3 de la 5eme partie consacré à la création d'un plugin jQuery.
aprés avoir compris et testé le plugin rebond du sinus cardinal,j'ai voulu allé plus loin avec ce plugin pour faire en sorte qu'il trace la courbe de cette fonction.L'idée consiste à écrire une instruction qui ajoute un <span> dont le texte est "*" à <body> à la position calculée par le plugin (affX,affY).
Ce qui me paraît plus correct et plus logique est d'ajouter cette instruction dans la fonction de retour de animate():
(function($) {
$.fn.rebond = function(amplX, amplY)
{
this.each(function() {
var x, y, affX, affY, initX, initY;
initX = parseInt($(this).css('left'));
initY = parseInt($(this).css('top'));
for (x = (Math.PI)/2; x < (4*Math.PI); x = x+.02)
{
y = (Math.abs(Math.sin(x)))/x;
affX = initX + x * amplX;
affY = initY - y * amplY;
$(this).animate({left: affX, top: affY},10,function(){
$('body').append('<span style="left:'+affX+'px;top:'+affY+'px;position:absolute">*</span>');
});
}
});
return this;
};
})(jQuery);
Mais malheureusement le résultat était décevant : tous les étoiles se superposent au même point (le dernier pt de la courbe) :
Quand je mets l'instruction hors de la fonction de retour :
(function($) {
$.fn.rebond = function(amplX, amplY)
{
this.each(function() {
var x, y, affX, affY, initX, initY;
initX = parseInt($(this).css('left'));
initY = parseInt($(this).css('top'));
for (x = (Math.PI)/2; x < (4*Math.PI); x = x+.02)
{
y = (Math.abs(Math.sin(x)))/x;
affX = initX + x * amplX;
affY = initY - y * amplY;
$(this).animate({left: affX, top: affY},10);
$('body').append('<span style="left:'+affX+'px;top:'+affY+'px;position:absolute">*</span>');
}
});
return this;
};
})(jQuery);
le résultat est plus intéressant sauf qu'ici toute la courbe est tracée à la fois lors du chargement de la page sans animation puis la boule vient la retracer par la suite :
Je voudrais que la courbe soit tracée de façon animée juste après les mouvements de la boule.
Si vous avez une solution ou idée qui peut m'aider merci d'avance.
- Edité par sadimov 8 août 2016 à 4:40:42
Ce qui est simple est faux. Ce qui est compliqué est inutilisable. Paul Valéry.
Merci beaucoup ça marche parfaitement maintenant encore merci... Je note qu'il y avait un autre gros problème dans ce cours avec les maps de Google où il fallait s'inscrire sur Google pour obtenir une clé nécessaire pour que les cartes s'affichent correctement... J'ai mis un certain temps avant de trouver la solution...Bonne journée...
× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
#RTFM #AskGoogle and Have a nice code Day
#RTFM #AskGoogle and Have a nice code Day
#RTFM #AskGoogle and Have a nice code Day