IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

[AJAX] Modification "inline" de données avec AJAX d'Olivier Lance sous IE si vide


Sujet :

JavaScript

  1. #1
    Candidat au Club
    Profil pro
    Inscrit en
    Mars 2003
    Messages
    4
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2003
    Messages : 4
    Points : 3
    Points
    3
    Par défaut [AJAX] Modification "inline" de données avec AJAX d'Olivier Lance sous IE si vide
    Bonjour,

    le script d'Olivier marche très bien, sauf si dans le champs à modifier, il n'y a rien...

    Dans ce cas, on a une erreur sous IE (uniquement, ça marche très bien avec FIREFOX !), et ensuite, c'est complètement planté, on ne peux même plus cliquer sur un champs avec des données...

    J'ai l'erreur : Argument non valide...

    Si quelqu'un à une idée...

    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
    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
    163
    164
    165
    166
    167
    168
    169
    170
    171
    172
    173
    174
    175
    176
    177
    178
    179
    180
    181
    182
    183
    184
    185
    186
    187
    188
    189
    190
    191
    192
    193
    194
    195
    196
    197
    198
    199
    200
    201
    202
    203
    204
    205
    206
    207
    208
    209
    210
    211
    212
    213
    214
    215
    216
    217
    218
    219
    220
    221
    222
    223
    224
    225
    226
    227
    228
    229
    230
    231
    232
    233
    234
    235
    236
    237
    238
    239
    240
    241
     
    // retourne un objet xmlHttpRequest.
    // méthode compatible entre tous les navigateurs (IE/Firefox/Opera)
    function getXMLHTTP()
    {
        var xhr = null;
        if(window.XMLHttpRequest)
        { // Firefox et autres
            xhr = new XMLHttpRequest();
        }
        else if(window.ActiveXObject)
        { // Internet Explorer
            try
            {
                xhr = new ActiveXObject("Msxml2.XMLHTTP");
            }
            catch(e)
            {
                try
                {
                    xhr = new ActiveXObject("Microsoft.XMLHTTP");
                }
                catch(e1)
                {
                    xhr = null;
                }
            }
        }
        else
        { // XMLHttpRequest non supporté par le navigateur
            alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
        }
     
        return xhr;
    }
     
     
    //Fonction renvoyant le code de la touche appuyée lors d'un événement clavier
    function getKeyCode(evenement)
    {
        for (prop in evenement)
        {
            if(prop == 'which')
            {
                return evenement.which;
            }
        }
     
        return event.keyCode;
    }
     
     
    //Suppression des espaces/sauts de ligne inutiles (http://www.breakingpar.com/bkp/home.nsf/0/87256B280015193F87256C0C0062AC78)
    function trim(value) {
       var temp = value;
       var obj = /^(\s*)([\W\w]*)(\b\s*$)/;
       if (obj.test(temp)) { temp = temp.replace(obj, '$2'); }
       var obj = /  /g;
       while (temp.match(obj)) { temp = temp.replace(obj, " "); }
       return temp;
    }
     
    //Fonction donnant la largeur en pixels du texte donné (merci SpaceFrog !)
    function getTextWidth(texte)
    {
    	//Valeur par défaut : 150 pixels
    	var largeur = 150;
     
    	if(trim(texte) == "")
    	{
    		return largeur;
    	}
     
    	//Création d'un span caché que l'on "mesurera"
    	var span = document.createElement("span");
    	span.style.visibility = "hidden";
    	span.style.position = "absolute";
     
    	//Ajout du texte dans le span puis du span dans le corps de la page
    	span.appendChild(document.createTextNode(texte));
    	document.getElementsByTagName("body")[0].appendChild(span);
     
    	//Largeur du texte
    	largeur = span.offsetWidth;
     
    	//Suppression du span
    	document.getElementsByTagName("body")[0].removeChild(span);
    	span = null;
     
    	return largeur;
    }
     
     
    //Fonction renvoyant une valeur "aléatoire" pour forcer le navigateur (ie...)
    //à envoyer la requête de mise à jour
    function ieTrick(sep)
    {
    	d = new Date();
    	trick = d.getYear() + "ie" + d.getMonth() + "t" + d.getDate() + "r" + d.getHours() + "i" + d.getMinutes() + "c" + d.getSeconds() + "k" + d.getMilliseconds();
     
    	if (sep != "?")
    	{
    		sep = "&";
    	}
     
    	return sep + "ietrick=" + trick;
    }
     
     
     
    //On ne pourra éditer qu'une valeur à la fois
    var editionEnCours = false;
     
    //variable évitant une seconde sauvegarde lors de la suppression de l'input
    var sauve = false;
     
    //Fonction de modification inline de l'élément double-cliqué
    function inlineMod(id, obj, nomValeur, type)
    {
    	if(editionEnCours)
    	{
    		return false;
    	}
    	else
    	{
    		editionEnCours = true;
    		sauve = false;
    	}
     
    	//Objet servant à l'édition de la valeur dans la page
    	var input = null;
     
    	//On crée un composant différent selon le type de la valeur à modifier
    	switch(type)
    	{
    		//Valeur de type texte ou nombre
    		case "texte":
    		case "nombre":
    			input = document.createElement("input");
    			break;
     
    		//Valeur de type texte multilignes
    		case  "texte-multi":
    			input = document.createElement("textarea");
    			break;
    	}
     
    	//Assignation de la valeur
    	if (obj.innerText)
    		input.value = obj.innerText;
    	else
    		input.value = obj.textContent;
     
    	input.value = trim(input.value);
     
    	//On lui donne une taille un peu plus large que le texte à modifier
    	input.style.width  = getTextWidth(input.value) + 50 + "px";
     
    	//Remplacement du texte par notre objet input
    	obj.replaceChild(input, obj.firstChild);
     
    	//On donne le focus à l'input et on sélectionne le texte qu'il contient
    	input.focus();
    	input.select();
     
    	//Assignation des deux événements qui déclencheront la sauvegarde de la valeur
     
    	//Sortie de l'input
    	input.onblur = function sortir()
    	{
    		sauverMod(id, obj, nomValeur, input.value, type);
    		delete input;
    	};
     
    	//Appui sur la touche Entrée
    	input.onkeydown = function keyDown(event)
    	{
                    if (!event&&window.event)
                    {
                        event = window.event;
                    }
    		if(getKeyCode(event) == 13)
                      {
    			sauverMod(id, obj, nomValeur, input.value, type);
    			delete input;
    		}
    	};
    }
     
     
    //Objet XMLHTTPRequest
    var XHR = null;
     
    //Fonction de sauvegarde des modifications apportées
    function sauverMod(id, obj, nomValeur, valeur, type)
    {
    	//Si on a déjà sauvé la valeur en cours, on sort
    	if(sauve)
    	{
    		return false;
    	}
    	else
    	{
    		sauve = true;
    	}	
     
    	//Si l'objet existe déjà on abandonne la requête et on le supprime
    	if(XHR && XHR.readyState != 0)
    	{
    		XHR.abort();
    		delete XHR;
    	}
     
    	//Création de l'objet XMLHTTPRequest
    	XHR = getXMLHTTP();
     
    	if(!XHR)
    	{
    		return false;
    	}
     
    	//URL du script de sauvegarde auquel on passe la valeur à modifier
    	XHR.open("GET", "client.php?thePageClient=prelevement&menuParentActif=marketing.php&act=update&id=" + id + "&champ=" + nomValeur + "&valeur=" + escape(valeur) + ieTrick(), true);
     
    	//On se sert de l'événement OnReadyStateChange pour supprimer l'input et le replacer par son contenu
    	XHR.onreadystatechange = function()
    	{
    		//Si le chargement est terminé
    		if (XHR.readyState == 4)
    		{
    			//Réinitialisation de la variable d'état d'édition
    			editionEnCours = false;
     
    			//Remplacement de l'input par le texte qu'il contient
    			obj.replaceChild(document.createTextNode(valeur), obj.firstChild);
    		}
    	}
     
    	//Envoi de la requête
    	XHR.send(null);
    }

  2. #2
    Expert éminent

    Avatar de denisC
    Profil pro
    Développeur Java
    Inscrit en
    Février 2005
    Messages
    4 050
    Détails du profil
    Informations personnelles :
    Âge : 44
    Localisation : Canada

    Informations professionnelles :
    Activité : Développeur Java
    Secteur : Service public

    Informations forums :
    Inscription : Février 2005
    Messages : 4 050
    Points : 7 641
    Points
    7 641
    Par défaut
    Citation Envoyé par altivec
    le script d'Olivier marche très bien, sauf si dans le champs à modifier, il n'y a rien...

    Dans ce cas, on a une erreur sous IE (uniquement, ça marche très bien avec FIREFOX !), et ensuite, c'est complètement planté, on ne peux même plus cliquer sur un champs avec des données...
    Avec quelle version d'IE? J'utilise IE 6, et effectivement, quand j'édite un champ vide, il me colle un undefined dedans. C'est pas fameux, mais ça ne bloque rien.

    Tu as quel genre de comportement de la part d'IE?

    Le problème vient probablement de quelque part par là:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
     
    //Assignation de la valeur
    	if (obj.innerText)
    		input.value = obj.innerText;
    	else
    		input.value = obj.textContent;

  3. #3
    Candidat au Club
    Profil pro
    Inscrit en
    Mars 2003
    Messages
    4
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2003
    Messages : 4
    Points : 3
    Points
    3
    Par défaut
    J'ai essayé de jouer avec ces lignes en effet, et des fois ça me met undefined, mais pas tout le temps...

    La plupart du temps, ça me colle une erreur javascript (argument non valide), et plus rien ne marche...

    J'ai IE6, mais j'utilise le plus souvent avant browser (qui utilise le moteur d'IE).

  4. #4
    Expert éminent

    Avatar de denisC
    Profil pro
    Développeur Java
    Inscrit en
    Février 2005
    Messages
    4 050
    Détails du profil
    Informations personnelles :
    Âge : 44
    Localisation : Canada

    Informations professionnelles :
    Activité : Développeur Java
    Secteur : Service public

    Informations forums :
    Inscription : Février 2005
    Messages : 4 050
    Points : 7 641
    Points
    7 641
    Par défaut
    Citation Envoyé par altivec
    J'ai IE6, mais j'utilise le plus souvent avant browser (qui utilise le moteur d'IE).
    Et ça buggue avec avant browser ou avec IE?

    Quelle est l'erreur plus précise que tu obtiens?

Discussions similaires

  1. Réponses: 1
    Dernier message: 13/07/2017, 15h52
  2. Réponses: 16
    Dernier message: 12/07/2012, 11h58
  3. Réponses: 13
    Dernier message: 30/05/2011, 17h47
  4. [AJAX] Modification "inline" de données avec AJAX
    Par isa150183 dans le forum AJAX
    Réponses: 1
    Dernier message: 04/12/2009, 00h21
  5. [AJAX] Modification "inline" de données avec AJAX
    Par Bestiol dans le forum Contribuez
    Réponses: 0
    Dernier message: 12/08/2006, 14h01

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo