11540 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Je suis débutante sur Jquery. J'ai créé un bouton qui fait appel à deux fonctions. La première est une fonction jquery qui affiche un popup avec deux boutons. elle attribue une valeur boolean à une varibale selon le choix du bouton du popup
La deuxième fonction qu'est une fonction javascript s'exécute selon le résultat de la première fonction.

Le problème est que le bouton fait appel à la fonction javascript avant celle de jquery. Vous savez pas un moyen pour prioriser l'appel à la fonction jquery.

Ci dessous le code :

<html>
<head>
<title></title>
</head>
<body>
  <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/redmond/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>


    <script type="text/javascript">


	//document.getElementById('theHiddenField').value =false;
        $(document).ready(function () {
            $("#OpenDialog").click(function () {
                $("#dialog").dialog({
				resizable: false,
height:140,
modal: true,
 
				buttons: {
"Oui": function() {
$('#theHiddenField').val(true);
$( this ).dialog( "close" );
alert($('#theHiddenField').val());
},
"Non": function() {
//$('#theHiddenField').val(false);
alert($('#theHiddenField').val());
$( this ).dialog( "close" );
}
}
				});
            });
        });
		
	function Chargement() {
	if (document.getElementById('theHiddenField').value ==true) {
	alert('Bienvenue sur le site');
		}
}
    </script>
	
  <input id="OpenDialog" type="button"  value="Valider" onClick="Chargement()">
    <div id="dialog" title="Empty the recycle bin?">
    </div>
	 <input type="hidden" id="theHiddenField" name="deleteThisSelectedItem" value="false" style="display:none">

</body>
</html>

Modifié par 6l20 (07 Apr 2013 - 14:31)
Bonjour,

Si le but est d'afficher "Bienvenue sur le site au clic" sur oui, il suffit de faire cela :

<script type="text/javascript">
      $(document).ready(function () {
        $("#OpenDialog").click(function () {
          $("#dialog").dialog({
            resizable: false,
            height:140,
            modal: true,
            buttons: {
              "Oui": function() {
                alert('Bienvenue sur le site');
                $(this).dialog( "close" );
              },
              "Non": function() {
                $( this ).dialog( "close" );
              }
            }
          });
        });
      });
    </script>
    <input id="OpenDialog" type="button"  value="Valider">
    <div id="dialog" title="Empty the recycle bin?">
    </div>


Pas besoin de champs caché.

Sinon dans ton test initial que tu effectuais ici :
if (document.getElementById('theHiddenField').value ==true)

il fallait mettre true entre guillemets pour que le test fonctionne.

Bonne journée