Discussion :

[samgratt]

Bonjour.
Je viens de découvrir editable pour jquery afin d'utiliser l'édition in-situ.
Pour l'instant j'ai fait simple, avec juste une ligne vide pour ajouter un élément.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<a href="#" id="nomutil"  data-type="text" data-title="Ajouter un utilisateur">Ajout</a>

Je ne parviens pas à le faire fonctionner correctement malgré mes recherches avec le code suivant;

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
$(function(){
	$('#nomutil').editable ({
		validate: function(value) {
			if($.trim(value) == '') 
			{
				return 'Cette valeur est obligatoire .';
			}
		},
		type: 'POST',
		url: '../admin/addjeditable.php',
	   name: 'nom_util',
	   success: function(value, response){  
              	alert('succès'+' val='+value);
           }
    	});
});

Contenu de addjeditable.php;

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
$nom_util=(isset($_POST['nom_util'])?$_POST['nom_util']:(isset($_GET['nom_util'])?$_GET['nom_util']:""));
 
if ($nom_util !="") 
{
	include("../bin/cnx.php");
	$sql = "INSERT INTO utilisateur(nom_utilisateur) VALUES (
		'".str_replace("'","\'",$nom_util)."')"; 
	include("../bin/cnx_ordres.php");
	include("../bin/cnx_fin.php");
	include("../bin/commit.php");
}
?>

Le truc qui m'agace c'est que j'ai toujours le message succès alors qu'il ne se passe rien.
Pourriez vous m'aider ?

[danielhagnoul]

En HTML5, n'importe quel élément "block" peut recevoir l'attribut "contenteditable". Exemples :

• http://www.developpez.net/forums/d12...sion-editable/
• http://danielhagnoul.developpez.com/...ialogModal.php

Pour le plugin, votre code n'est pas conforme à la documentation : $('.edit').editable('http://www.example.com/save.php', { ... });.

[samgratt]

Merci d'avoir répondu. Ça ne fonctionne pas mieux.
Et je me demande ce que je fais mal.
D'autant que sur les documentations que j'ai consultées,

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$('#nomutil').editable (

c'est pareil que

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$('.edit').editable (

Sauf que le premier utilise le nom de l'élément et le second la classe.
Ensuite le fait de mettre

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$('.edit').editable ('save.php', ...

c'est pareil que

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$('.edit').editable ({url:'save.php' ...

Et là tu me dis que c'est pas pareil ???

Comprends pô ?

[samgratt]

Comme ça m'énervait, j'ai repris depuis le début avec du Jscript "pur" (basé qd mm sur jquery). J'ai donc recréé la roue, en gérant les éléments à masquer et à montrer (j'ai fait la mm chose pour l'édition et l'ajout). Ça fonctionne et je comprends encore moins ou j'ai faux dans l'utilisation de editable.
Le fonctionnement reste quasi identique, et à plus forte raison puisque c'est du jquery qu'utilise l'instruction editable.

POUr info, voilà la "roue réinventée" ;

Code jscript :

Sélectionner tout - Visualiser dans une fenêtre à part

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
 
$(".add_div").click(function(e){
	$("#nom_util").hide();
	$("#nom_util_input").show();
	$("#div_nom_util_input").show();		
	}).keypress(function(event){
		if (event.which == 13 || event.keyCode == 13){
			var nom_util=$("#nom_util_input").val();
			var dataString = 'nom_util='+nom_util;
			if(nom_util.length>0) {
				$.ajax({
					type: "POST",
					url: "../../admin/addjeditable.php",
					data: dataString,
					cache: false,
					success: function(html){$("#nom_util").html(nom_util);}
					});
			}
			else
			{
				alert('Veuillez saisir un nom.');
			}
				$(".addbox").hide();
				$(".addtext").show();
				location.reload();
			}
});

[samgratt]

Bon, comme ça ne fonctionnait pas, j'ai repris tout à zéro, point par point en récupérant les bons js. Et tout fonctionne avec la mm syntaxe.
Je me suis rendu compte que j'utilisais jquery.jeditable.min.js dans mon premier exemple et jquery.jeditable.js dans le second qui fonctionne.
A priori, j'ai pointé vers le mauvais js.

Merci qd même !

[danielhagnoul]

Bonsoir

Un fichier x.min.js est la version compressée (minified) du fichier x.js, normalement ils sont identiques, mais il arrive que la compression provoque des erreurs lorsque le fichier x.js n'est pas correctement écrit.