Valider formulaire sans charger la page et en tapant entrée

Version imprimable

Voir 40 message(s) de cette discussion en une page

Bonjour

j'essaye de valider un formulaire pour ensuite envoyer les données sans recharger la page et en tapant sur entrée

j'ai essayé pas mal de chose
voila mon code du formulaire

Code:

1
2
3
4
<div class="msg-wgt-footer">
<form name="form" method="POST" action="" onsubmit="return mySubmit();">
        <textarea id="chatMsg" onKeyPress="if(event.keyCode == 13) mySubmit();" placeholder="Type your message. Press shift + Enter to send"></textarea>
      </div>

et le code jquery que j'ai :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function mySubmit(){
document.getElementById("form").submit();
$("#form").submit(function(){
		var message = $("#chatMsg").val();
 
		var dataString = 'msg='+message;
		$.ajax({
			type: "POST",
			url: "add_msg.php",
			data: dataString,
			dataType: "json",
			success: function(json){
				$("#infos").html('');
 
			}
		});

la touche entrée ne s'effectue pas, et l'envoi du formulaire non plus

25/06/2017, 19h28
mathieu

dans une zone de texte, la touche "entrée" fait un saut à la ligne et n'envoie pas le formulaire
donc pour faire un envoi AJAX à chaque nouvelle ligne, surveillez plutot l'évènement "change" de la zone de texte.
25/06/2017, 19h52
toulousain3117

Pourtant j'ai vue sur beaucoup de script, j'ai essayé de m'inspirer beaucoup de zone de texte était envoyée avec un style de js que j'ai mis.

Et donc je dois changer quoi sur mon script

Car je dois avouer que j'ai testé beaucoup de chose
25/06/2017, 20h38
mathieu

pour surveiller cet évènement, vous pouvez utiliser une des 2 méthodes suivantes :
http://api.jquery.com/on/
http://api.jquery.com/change/

j'ai ce code maintenant qui marche, mais comment je peux faire pour ne pas qu'il soit redirigé vers la page php mais que j'envoi quand même les données

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<script language="JavaScript">
 
$(document).ready(function() {
            $('.monForm').on('submit', function() { 
		event.preventDefault();  
            // appel Ajax
            $.ajax({
                url: 'planning_cree.php',
                type: $(this).attr('method'), // la méthode indiquée dans le formulaire (get ou post)
                data: $(this).serialize(), // je sérialise les données (voir plus loin), ici les $_POST
                success: function(html) { // je récupère la réponse du fichier PHP
                //alert(html); // j'affiche cette réponse
                }
            });
        return false; // j'empêche le navigateur de soumettre lui-même le formulaire
        });
    });
        </script>
<form class="monForm" method="post" action="planning_cree.php" return false>
<input type="text" name="Envoyer" value="Envoyer">
<input type="submit" name="Envoyer" value="Envoyer" onclick="this.disabled=true;this.value='Crée'"/>
</form>

j'ai repris aussi un vieux script de chat que j'avais dans mes dossiers et j'ai ce code qui correspond a ce que je cherche

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<script language="JavaScript">
 
 
function send_message(message) {
  $.ajax({
    url: 'add_msg.php',
    method: 'post',
    data: {msg: message},
    success: function(data) {
      $('#send').val('');
 
    }
  });
}
 
function fchat() {
  var chatArea = $('#send');
  // Bind the keyboard event
  chatArea.bind('keydown', function(event) {
    // Check if enter is pressed without pressing the shiftKey
    if (event.keyCode == 13 && event.shiftKey == false) {
      var message = chatArea.val();
      // Check if the message is not empty
      if (message.length !== 0) {
        send_message(message);
        event.preventDefault();
      } else {
        alert('Provide a message to send!');
        chatArea.val('');
      }
    }
  });
}
// Initialize the chat
fchat();
        </script>
<div id="send">
<input type="text" id="send" name="send" >
</div>

mais dans la console ça m'affiche ça

Code:

ReferenceError: $ is not defined[En savoir plus]

Pour envoyer la value d'un textarea avec entré. Tu surveille les touches appuyés par utilisateur une fois element textarea activ. Exemple

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 
<script>
var chatMsg = $("#chatMsg");
chatMsg.on("clicke",function(e){
      var toucheAppui = e.keyCode;
      // tu récupère le code du touche entre en fesant alert(toucheAppui)
 
      if(toucheAppui == /*code entre*/){
        // ton script d'envoi 
     }
});
<\script>

Maintenant pour envoyer la value a un fichier PHP sans recharger la page, tu utilise Ajax. Avec jquery tu fais :

Code:

1
2
3
4
5
6
7
8
9
10
 
$.ajax({
    url : cheminFichierPhp.php ,
    data : {key : "value"},
    type : GET OU POST, 
    dataType : "JSON",
    success : function(resultat){
        // action après request
    }
})

Dans ton fichier PHP tu fais :

Code:

1
2
3
4
5
6
7
8
9
10
 
<?php
   header("content-type:application/json");
   // tu récupère la valu normalement exemple
   $r = false; 
   if(isset($_GET["key"])){
        // code de traitement 
       $r = true; 
   }
?>

j'ai le code qui est comme ça en suivant t'es instructions mais j'ai une page blanche

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
 
<script type="text/javascript">
var chatMsg = $("#chatMsg");
chatMsg.on("clicke",function(e){
      var toucheAppui = e.keyCode;
      // tu récupère le code du touche entre en fesant alert(toucheAppui)
 alert(toucheAppui);
      if(toucheAppui == "13"){
 
$.ajax({
    url : add.php ,
    data: {msg: message},
    type : POST, 
    dataType : "JSON",
    success : function(resultat){
        // action après request
 
alert(isgood);
    } else { 
alert(pasgood);
}
})
 
     }
});
<\script>
 
<div class="msg-wgt-footer">
<textarea id="chatMsg"  placeholder="Type your message. Press shift + Enter to send"></textarea>
  </div>

ok je reprend tout. tu crée 2 fichiers formulaire.html et serveur.php, tu mets ces fichiers dans un même dossier de ton choix. maintenant on commence par formulaire.html

- formulaire.html (dans le fichier remplace /CHEMIN DU FICHIER JQUERY/ par son vrai chemin chez toi) :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
 
<!DOCTYPE html>
<html>
<head>
	<title>Messagerie</title>
	<script type="text/javascript" src="/CHEMIN DU FICHIER JQUERY/"></script>
	<style type="text/css">
		form{
			width: 360px;
			height: 610px;
			border: 1px solid rgb(100,100,100);
			overflow: hidden;
			position: relative;
			margin: 10px auto;
			padding: 0px;
		}
		form div:nth-child(1){
			display: block;
			padding: 10px;
			color : #fff;
			background: #1d2a41;
			text-align: center;
			font-size: 16px;
			font-weight: 600;
			position: absolute;
			top : 0px;
			left: 0px;
			width: 100%;
		}
		#displayer_all_sms{
			position: absolute;
			top : 38px;
			left: 0px;
			right: -10px;
			bottom: 70px;
			background: #f3f3f3;
			width: 103%;
			overflow-x: hidden;
			overflow-y: auto;
		}
		form textarea{
			position: absolute;
			bottom: 0px;
			left : 0px;
			width: 100%;
			height: 60px;
			padding: 10px;
		}
		label{
			display: block;
		}
		.every_box{
			display: inline-block;
			padding: 10px;
			margin: 5px;
			margin-left: 10px;
			background: #1e7293;
			color: #fff;
		}
	</style>
</head>
<body>
	<form action="#" method="POST">
		<div>Messagerie</div>
		<div id="displayer_all_sms"></div>
		<textarea name="body_sms" id="body_sms" placeholder="Votre message"></textarea>
	</form>
 
	<script>
		var zone_sms = $("#body_sms");
		zone_sms.on("keydown",function(e){
			if (e.keyCode == 13) {
				if (!e.preventDefault()) {
					e.target;
				}
				// tu mets ton code a executé a l'appui de l'ENTRER ici. pour moi j'envoi le message
 
				// en premier lieu je recupère dans une variable text_sms le contenu de mon textarea et je vérifie si c'est vide ou pas
 
				var text_sms = $(this).val(),all_key = text_sms.split(" "),isEmpty = true;
				$(this).val("");
				for (var i = all_key.length - 1; i >= 0; i--) {
					if (all_key[i] != "") {
						isEmpty = false;
					}
				}
 
				if (!isEmpty) {
					/* 
						- si ce n'est pas vide on continue
						- on envoi le texte a un notre fichier php pour etre sauvegarder dans une data base
					*/
					$.ajax({
						url : "serveur.php",
						type: "POST",
						data: {text_box : text_sms},
						dataType: "JSON",
						success: function(resultat){
							if (resultat.end) {
								// si le message est envoi au fichier php on ajoute le texte a notre displayer_all_box pour l'afficher a l'écran
								$("#displayer_all_sms").append("<label><span class='every_box'>"+text_sms+"</span></label>");
							}
							else{
								alert("message non envoyé");
							}
						} 
					});
				}
				else{
					alert("Zone Vide");
				}
			}
		})
	</script>
</body>
</html>

FIN FICHIER formulaire.html

- LE FICHIER serveur.php on aura :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<?php
        header('Content-Type: application/json');
        $end = false;
 
        if (isset($_POST["text_box"])) {
                $text_du_message = htmlspecialchars($_POST["text_box"]);
 
                // Tu traite le message et tu sauvegarde dans une base de donnée si tu en as besoin.
                $end = true;
        }
        echo json_encode(array("end" => $end));
 
?>

FIN EXECUTE VOIR

:lol::lol::mouarf:

je n'ai qu'un mot a dire tu es un génie, lol

derniere question aprés je vous laisses tranquilles :D

pour afficher depuis une base de donnée avec une boucle etc je procede comment du coup avec le json_encode ?

j'ai un code comme celui la :
Code:

1 2 3 4 5 6 7 8 9 10 cUserId = "1"; $sl_msg = mysql_query("Select * from chats where (user_id='$cUserId' AND user_to='$cUserIdto') OR (user_id='$cUserIdto' AND user_to='$cUserId')"); while($sql_msg = mysql_fetch_array($sl_msg)) { $id_from = $sql_msg["user_id"]; $id_to = $sql_msg["user_to"]; $message = $sql_msg["message"]; if($id_from == $cUserId) {

En tenant compte de ton code on aura ceci :

- DANS TON FICHIER PHP tu fais :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?php 
        header('Content-Type: application/json');
         /* ..... connexion a la base des données ....  */
        $value_a_envoyer_a_js = array();
 
        $sl_msg = mysql_query("Select * from chats where (user_id='$cUserId' AND user_to='$cUserIdto') OR (user_id='$cUserIdto' AND user_to='$cUserId')");
        $position = 0;
        while($sql_msg = mysql_fetch_array($sl_msg)) {
                $value_a_envoyer_a_js[$position] = array();
                $value_a_envoyer_a_js[$position]["user_id_js"] = $sql_msg["user_id"],
                $value_a_envoyer_a_js[$position]["user_to_js"] = $sql_msg["user_to"];
                $value_a_envoyer_a_js[$position]["message_js"] = $sql_msg["message"];
                $position++;
        }
        echo json_encode($value_a_envoyer_a_js);
?>

- DANS TON FICHIER JS tu fais :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
 
<script>
	$.ajax({
		url : ...,
		type: ...,
		data: ...,
		dataType: "JSON",
		success: function(resultat){
 
			//Tu fais ceci pour voir les données envoyées en console de ton navigateur;
			console.log(resultat);
			// le resultat envoyé est un object sous cette form :
 
			/**
				resultat = [
					{
					user_id_js : user_id_1,
					user_to_js : user_to_1,
					message_js : message_1,
					},
					{
					user_id_js : user_id_2,
					user_to_js : user_to_2,
					message_js : message_2,
					},
					....
					{
					user_id_js : user_id_n,		avec n = dernier user_id
					user_to_js : user_to_n,
					message_js : message_n,
					}
				];
				maintenant pour voir accer a chaque donnée de chauque message tu fais comme ceci : 
			*/
 
			for (var i = resultat.length - 1; i >= 0; i--) {
				var current_box_detail = resultat[i];
				for(var key in current_box_detail){
					alert(current_box_detail["user_id_js"])
				}
			}
			// la première for pour pacourrir chaque groupe des données et la seconde for est pour pacourrir chaque donnée du groupe de donnée en position i
		} 
	});
 
</script>

FIN EXECUTE VOIR

:mrgreen::lol::lol::lol:

26/06/2017, 13h52
toulousain3117

je vais étudier tous ça merci beaucoup de ton aide

bonne journée ^^
26/06/2017, 13h56
paoli121

Signale problème résolu pour cette discussion

FIN EXECUTE VOIR

:mrgreen::lol::lol::lol::lol:

je re ouvre le dossier car quand j'ai tester le code d'une seul fenetre ça marche

mais en fait mon script est une messagerie instantanée entre deux membre et quand je met le js, le formulaire ne marche plus

c'est different "popup"

j'ai donc une liste de contact le membre ouvre un popup style facebook pour ouvrir la discution
le lien est donc

Code:

1
2
3
4
5
6
<div class="sidebar-name">
                <!-- Pass username and display name to register popup -->
                <a href="javascript:register_popup('3', 'Narayan Prusty');">
                    <img width="30" height="30" src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-xap1/v/t1.0-1/p50x50/1510656_10203002897620130_521137935_n.jpg?oh=572eaca929315b26c58852d24bb73310&oe=54BEE7DA&__gda__=1418131725_c7fb34dd0f499751e94e77b1dd067f4c" />
                    <span>Narayan Prusty</span>
                </a>

mon js qui ouvre les popups est fb_class.js et j'ai aussi mis ton js la dedans :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
 //this function can remove a array element.
            Array.remove = function(array, from, to) {
                var rest = array.slice((to || from) + 1 || array.length);
                array.length = from < 0 ? array.length + from : from;
                return array.push.apply(array, rest);
            };
 
            //this variable represents the total number of popups can be displayed according to the viewport width
            var total_popups = 0;
 
            //arrays of popups ids
            var popups = [];
 
            //this is used to close a popup
            function close_popup(id)
            {
                for(var iii = 0; iii < popups.length; iii++)
                {
                    if(id == popups[iii])
                    {
                        Array.remove(popups, iii);
 
                        document.getElementById(id).style.display = "none";
 
                        calculate_popups();
 
                        return;
                    }
                }  
            }
 
          //displays the popups. Displays based on the maximum number of popups that can be displayed on the current viewport width
            function display_popups()
            {
                var right = 10;
 
                var iii = 0;
                for(iii; iii < total_popups; iii++)
                {
                    if(popups[iii] != undefined)
                    {
                        var element = document.getElementById(popups[iii]);
                        element.style.right = right + "px";
                        right = right + 230;
                        element.style.display = "block";
                    }
                }
 
                for(var jjj = iii; jjj < popups.length; jjj++)
                {
                    var element = document.getElementById(popups[jjj]);
                    element.style.display = "none";
                }
            }
 
            //creates markup for a new popup. Adds the id to popups array.
            function register_popup(id, name)
            {
 
                for(var iii = 0; iii < popups.length; iii++)
                {  
                    //already registered. Bring it to front.
                    if(id == popups[iii])
                    {
 
                        Array.remove(popups, iii);
 
                        popups.unshift(id);
 
                        calculate_popups();
 
 
                        return;
                    }
                }     
 
var zone_sms = $("#body_sms");
		zone_sms.on("keydown",function(e){
			if (e.keyCode == 13) {
				if (!e.preventDefault()) {
					e.target;
				}
				// tu mets ton code a executé a l'appui de l'ENTRER ici. pour moi j'envoi le message
 
				// en premier lieu je recupère dans une variable text_sms le contenu de mon textarea et je vérifie si c'est vide ou pas
 
				var text_sms = $(this).val(),all_key = text_sms.split(" "),isEmpty = true;
				$(this).val("");
				for (var i = all_key.length - 1; i >= 0; i--) {
					if (all_key[i] != "") {
						isEmpty = false;
					}
				}
 
				if (!isEmpty) {
					/* 
						- si ce n'est pas vide on continue
						- on envoi le texte a un notre fichier php pour etre sauvegarder dans une data base
					*/
					$.ajax({
						url : "serveur.php",
						type: "POST",
						data: {text_box : text_sms},
						dataType: "JSON",
						success: function(resultat){
							if (resultat.end) {
								// si le message est envoi au fichier php on ajoute le texte a notre displayer_all_box pour l'afficher a l'écran
								$("#displayer_all_sms").append("<label><span class='every_box'>"+text_sms+"</span></label>");
							}
							else{
								alert("message non envoyé");
							}
						} 
					});
				}
				else{
					alert("Zone Vide");
				}
			}
		})
                var element = '<div class="popup-box chat-popup" id="'+ id +'">';
                element = element + '<div class="popup-head">';
                element = element + '<div class="popup-head-left">'+ name +'</div>';
                element = element + '<div class="popup-head-right"><a href="javascript:close_popup(\''+ id +'\');">✕</a></div>';
                element = element + '<div style="clear: both"></div></div><div class="popup-messages">';
                element = element + '<iframe width="220px" height="245px" src="es.php?essai='+ id +'" frameborder="0" allowfullscreen></iframe></div>';
 
element = element + '<div class="msg-wgt-footer">';
        element = element + '<textarea id="body_sms" name="body_sms" placeholder="Type your message. Press shift + Enter to send"></textarea>';
      element = element + '</div>';
 
                document.getElementsByTagName("body")[0].innerHTML = document.getElementsByTagName("body")[0].innerHTML + element; 
 
                popups.unshift(id);
 
                calculate_popups();
 
            }
 
 
            //calculate the total number of popups suitable and then populate the toatal_popups variable.
            function calculate_popups()
            {
                var width = window.innerWidth;
                if(width < 540)
                {
                    total_popups = 0;
                }
                else
                {
                    width = width - 200;
                    //320 is width of a single popup box
                    total_popups = parseInt(width/320);
                }
 
                display_popups();
 
            }
 
            //recalculate when window is loaded and also when window is resized.
            window.addEventListener("resize", calculate_popups);
            window.addEventListener("load", calculate_popups);

et si ça peut aider voila le js chat.js

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
function get_messages() {
var essai= $('#essai').val();
  $.ajax({
      url: 'es2.php?essai='+essai,
    method: 'GET',
    success: function(data) {
      $('.msg-wgt-body').html(data);
    }
  });
}
 
/**
 * Initializes the chat application
 */
function boot_chat() {
  var chatArea = $('#chatMsg');
 
  // Load the messages every 5 seconds
  setInterval(get_messages, 1000);
 
 
}
 
// Initialize the chat
boot_chat();

26/06/2017, 14h47
paoli121

Soit plus claire. explique moi ce que tu veux faire. Tu veux réaliser une discussion instantanée comme pour facebook?

FIN EXECUTE VOIR

:mouarf::mouarf::lol::lol::lol:
26/06/2017, 14h51
toulousain3117

la discution est deja créer.

Ce que je cherche est que a chaque popup ouvert le formulaire fonctionne surtout pour l'envoi et la touche entrée

en fait tous marche sauf le plus important c'est a dire l'envoi de formulaire lol

alors que je l'avais tester seul et ca marchait

ok je suis allé voir le lien, je comprends maintenant. A voir la manière dont ça fonction tu crée les pop avec du js. Si tu que l'envoi s'applique a chaque pop, tu modifie juste l'autre js un peu comme suit :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
 
<script>
		function send_box(zone_sms,insert_box_here){
			zone_sms.on("keydown",function(e){
				if (e.keyCode == 13) {
					if (!e.preventDefault()) {
						e.target;
					}
					// tu mets ton code a executé a l'appui de l'ENTRER ici. pour moi j'envoi le message
 
					// en premier lieu je recupère dans une variable text_sms le contenu de mon textarea et je vérifie si c'est vide ou pas
 
					var text_sms = $(this).val(),all_key = text_sms.split(" "),isEmpty = true;
					$(this).val("");
					for (var i = all_key.length - 1; i >= 0; i--) {
						if (all_key[i] != "") {
							isEmpty = false;
						}
					}
 
					if (!isEmpty) {
						/* 
							- si ce n'est pas vide on continue
							- on envoi le texte a un notre fichier php pour etre sauvegarder dans une data base
						*/
						$.ajax({
							url : "serveur.php",
							type: "POST",
							data: {text_box : text_sms},
							dataType: "JSON",
							success: function(resultat){
								if (resultat.end) {
									// si le message est envoi au fichier php on ajoute le texte a notre displayer_all_box pour l'afficher a l'écran
									insert_box_here.append("<label><span class='every_box'>"+text_sms+"</span></label>");
								}
								else{
									alert("message non envoyé");
								}
							} 
						});
					}
					else{
						alert("Zone Vide");
					}
				}
			})
		}
</script>

-maintenant a chaque fois tu crée les pop, tu appelle la function send_box et tu lui donne en argument la zone de texte et là où le message va être ajouter a l'ecran

Si tu veux tu me donne un peu du temps et je refais tout pour toi.

FIN EXECUTE VOIR

:mrgreen::lol::lol:

26/06/2017, 15h15
toulousain3117

dans mon js la zone ou est affiché le message s'appelle "message"

donc je remplace insert_box_here par message

et dans ma fonction register popup (qui est la fonction d'ouverture des popups) j'appelle la fonction send_box c'est ça ?

moi je veux juste envoyer les messages dans mon fichier php pour ensuite
j'effectue un refresh pour actualisé les messages dans la base ede donnée

aprés le formulaire je doit envoyer l'id du destinataire qui est + id +

la j'ai fait donc :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
function send_box(zone_sms,insert_box_here){
var zone_sms = $("#body_sms");
var insert_box_here = $("#popup-messages");
 
			zone_sms.on("keydown",function(e){
				if (e.keyCode == 13) {
					if (!e.preventDefault()) {
						e.target;
					}
					// tu mets ton code a executé a l'appui de l'ENTRER ici. pour moi j'envoi le message
 
					// en premier lieu je recupère dans une variable text_sms le contenu de mon textarea et je vérifie si c'est vide ou pas
 
					var text_sms = $(this).val(),all_key = text_sms.split(" "),isEmpty = true;
					$(this).val("");
					for (var i = all_key.length - 1; i >= 0; i--) {
						if (all_key[i] != "") {
							isEmpty = false;
						}
					}
 
					if (!isEmpty) {
						/* 
							- si ce n'est pas vide on continue
							- on envoi le texte a un notre fichier php pour etre sauvegarder dans une data base
						*/
						$.ajax({
							url : "serveur.php",
							type: "POST",
							data: {text_box : text_sms},
							dataType: "JSON",
							success: function(resultat){
								if (resultat.end) {
									// si le message est envoi au fichier php on ajoute le texte a notre displayer_all_box pour l'afficher a l'écran
									insert_box_here.append("<label><span class='every_box'>"+text_sms+"</span></label>");
								}
								else{
									alert("message non envoyé");
								}
							} 
						});
					}
					else{
						alert("Zone Vide");
					}
				}
			})
		}

puis j'ai mis donc send_box dans register popup comme ça

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
//creates markup for a new popup. Adds the id to popups array.
            function register_popup(id, name)
            {
 
 
 
                for(var iii = 0; iii < popups.length; iii++)
                {  
                    //already registered. Bring it to front.
                    if(id == popups[iii])
                    {
 
                        Array.remove(popups, iii);
 
                        popups.unshift(id);
 
                        calculate_popups();
 
 
                        return;
                    }
                }     
 
 
                var element = '<div class="popup-box chat-popup" id="'+ id +'">';
                element = element + '<div class="popup-head">';
                element = element + '<div class="popup-head-left">'+ name +'</div>';
                element = element + '<div class="popup-head-right"><a href="javascript:close_popup(\''+ id +'\');">✕</a></div>';
                element = element + '<div style="clear: both"></div></div><div class="popup-messages">';
                element = element + '<iframe width="220px" height="245px" src="es.php?essai='+ id +'" frameborder="0" allowfullscreen></iframe></div>';
		element = element + '<div class="msg-wgt-footer">';
       		element = element + '<textarea id="body_sms" name="body_sms" placeholder="Type your message. Press shift + Enter to send"></textarea>';
      		element = element + '</div>';
 
                document.getElementsByTagName("body")[0].innerHTML = document.getElementsByTagName("body")[0].innerHTML + element; 
 
                popups.unshift(id);
                       send_box();
                calculate_popups();
 
            }

mais ça marche que sur une seule popup par sur toutes les popups ouvert

26/06/2017, 15h35
paoli121

ce n'est pas comme ça tu vas appeler la fonction sen_box. attend je te montre un exemple

Voir 40 message(s) de cette discussion en une page