Comment changer une fonction d'alerte par fonction de rempli

mahdiweb Messages postés 11 Date d'inscription mardi 20 septembre 2022 Statut Membre Dernière intervention 26 octobre 2022 - 27 sept. 2022 à 10:08
mahdiweb Messages postés 11 Date d'inscription mardi 20 septembre 2022 Statut Membre Dernière intervention 26 octobre 2022 - 28 sept. 2022 à 11:24

Bonjour,

dans mon extension chrome j'ai les codes ci-dessous qui affichent correctement les alertes :

manifeste.json

{
    "name": "Zero",
    "version": "1.0",
    "manifest_version": 3,
    "description": "Auto fill form GRC",
    "icons": { 
        "16": "icon/icon.png",
        "48": "icon/icon.png",
        "128": "icon/icon.png" 
    },
    "action": {
        "default_popup": "index.html",
        "default_icon": "icon/icon.png"
    },
    "options_page": "options.html",
    "content_scripts": [
        {
            "matches" : [
                "http://*/*",
                "https://*/*"
            ],
            "js": ["jquery-3.6.0.min.js", "popup.js"]
        }
    ],
    "permissions": [
        "activeTab",
        "storage",
        "scripting",
        "tabs",
        "clipboardWrite",
        "notifications",
        "contextMenus"
    ]
}

index.html

<!doctype html>
<html>
  <head>
<style>
body {
min-width: 120px;
overflow-x: hidden;
font-family: Arial, sans-serif;
font-size: 12px;
        }
        input, textarea {
            width: 140px;
        }
        input#save {
            font-weight: bold; width: auto;

        }
    </style>

  </head>
  <body>
<h1>GRC</h1>
    <center><form>
  <div>
<label><b>Veuillez saisir un code</b></label>
    <input name="inpt" id="inpt" autocomplete="off"/>
 <p>
<button id="btn">Enter</button>
<script src="popup.js"></script>
</p>
  </div>
</form></center>
  </body>
</html>

popup.js

const button = document.getElementById('btn');
const input = document.getElementById('inpt');

button.onclick = () => {
  functions[input.value]();
};

functions = {
  1: function () { alert(1); },
  2: function () { alert(2); },
  3: function () { alert(3); },
  4: function () { alert(4); },
  5: function () { alert(5); },
  6: function () { alert(6); },
}

Je souhaite garder le même principe, c'est à dire saisir un code dans le champ texte de la page index.html et lancer une fonction, mais je souhaite remplacer les fonctions d'alerte par des fonctions de remplissage comme suit :

à la place de 

1: function () { alert(1); },

Je veux mettre

1: function () { 
var element = document.getElementById('select1');
var element = document.getElementById('select2');
if (element != null && element.value == '') {
const select1 = document.getElementById('select1');
const select2 = document.getElementById('select2');

select1.addEventListener('change', () => {
select2.removeAttribute('disabled');
});

setTimeout(() => {
select1.value = '2: Object';
select1.dispatchEvent(new Event("change"));
}, 1E3);

setTimeout(() => {
select2.value = '1: Object';
select2.dispatchEvent(new Event("change"));
}, 2E3);

},

Lorsque j'ai fait le test avec la méthode que je viens de mentionner, j'ai reçu le message d'erreur suivant :

Existe-t-il une solution qui me permette de le faire. Je suis assez nouveau dans tout cela, donc toute aide serait très appréciée.


Windows / Chrome 91.0.4472.77

3 réponses

choubaka Messages postés 39148 Date d'inscription jeudi 4 avril 2002 Statut Modérateur Dernière intervention 7 février 2023 2 097
Modifié le 27 sept. 2022 à 10:23

Bonjour vérifie ton code, il manque soit un "{" ou une "(" quelque part.

C'est surligné en jaune dans ta capture d'écran.


1
mahdiweb Messages postés 11 Date d'inscription mardi 20 septembre 2022 Statut Membre Dernière intervention 26 octobre 2022
27 sept. 2022 à 10:55

oui effectivement merci il y a un "}" qui manque et je n'ai aucun message d'erreur maintenant, mais la fonction ne se déclenche toujours pas.  

0
jordane45 Messages postés 36944 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 7 février 2023 4 489
27 sept. 2022 à 10:58

Bonjour

var element = document.getElementById('select1');
var element = document.getElementById('select2');

Si tu utilises le même nom de variable pour deux choses forcément ça marchera moins bien


.
Cordialement,
Jordane

0

Bonjour @jordane45,

même si je met seulement le code suivant par exemple:

document.getElementById('select1').value = '3: Object';

et donc la fonction devient

functions = { 
  1: function () { document.getElementById('categorisation_1').value = '9: Object';},
  2: function () { alert(2); },
  3: function () { alert(3); },
  4: function () { alert(4); },
  5: function () { alert(5); },
  6: function () { alert(6); },
}

mais ça ne marche toujours pas et maintenant j'ai le message d'erreur suivant :

0
mahdiweb Messages postés 11 Date d'inscription mardi 20 septembre 2022 Statut Membre Dernière intervention 26 octobre 2022
28 sept. 2022 à 11:24

Est ce que vous avez d'autres propositions svp ?

0