Discussion :

[patricktoulon]

Bonjour a tous

j'ai trouver un moyen pour l'insertion de mes images dans mon wysiwyg d'eviter le fakepath sur certaines config IE et chrome
cela consiste a utiliser execCommand("insertimage",null,null) les deux argument a null permetant d'ouvrir une petite boite de dialogue avec le bouton parcourir

cependant si il n'y a pas de selection active ca ne marche pas , j'ai pour cela creer une range sur la base de la selection vide ca c'est ok dans la fonction
ce que je voudrais au cas ou il y aurait l'utilisateur qui pique une crise du syndrome de la tourette et donc selectionne du texte que cette selection se reduise a rien du tout mais reste a l'endroit ou elle est c'est a dire si il il a le texte

bonjour regardez cette image elle est tellement belle


et que je selectionne "image" je voudrais que la selection soit devant image avant de lancer execCommand

pour ceux que ca interesse

Code javascript :

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
 
//////////////////////////////////////////////////////////SOLUTION 1////////////////////////////////////////////////////////////
function insertimg1(add){
   var selection =window.getSelection().getRangeAt(0)
   var baliseimg = document.createElement("img");
   baliseimg.src=add;
   baliseimg.width=300
   selection.insertNode(baliseimg);
}
//appel de la fonction avec bouton et!!! un input type file caché nommé 'fichier"://
//dans le bouton 
fichier.click();
insertimg1(fichier.value);
// IMPORTANT !!!! reste que selon certaines configs on se retrouve avec un FAKEPATH!!!!! dans le SRC de l'image 
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 
///////////////////////////////////////////////////////////SOLUTION 2////////////////////////////////////////////////////////////
function insertimg2(argmt,b,url){
   if (url==="undefined"){url=null;;b=null;}
   // il est important de determiner la selection (meme vide) sinon l'insertion se fait sur tout le document et remplace tout 
   var selection = window.getSelection().getRangeAt(0);
   window.getSelection().addRange(selection);             
   //l'avantage de execCommand c'est qu'il ouvre sa propre petite fenetre avec un bouton "parcourir" 
   //possibilité de regler dans cette fenetre l'alignement et le hspaces le src a  l'url du fichier local tel quel
   document.execCommand("insertimage",b,url);  
}
//appel de la fonction avec un bouton //
//dans le bouton
//si on connais l'url exemple 
insertimg2("insertimage",false,"C:\dossier\mon_image.jpg");
//si on veut la boite de dialog pour choisir
insertimg(,"null","null");
 
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

[Beginner.]

Salut,

Je vois que ça avance...

Sinon pour ta question as-tu essayé ceci : https://developer.mozilla.org/fr/doc...Range/collapse ?

[patricktoulon]

Bonjour beguiner oui ca avance il fonctionne sur mes 3 support moyenant quelques modifs pour mon support VBA

je viens d'essayer collapse visiblement ca n'a pas le resultat ecompté la selection est bien remplacée

je ne suis pas bien sur de comprendre collapse reuni tout les segments en un dans le range ou place la selection a droite ou gauche selon l'argument ?

au pire j'essairais de faire comme pour pour mon clearspacerange avec un contextualfragment j'aurais voulu faire plus simple pour une fois

[Beginner.]

Ben si tu veux une sélection "non nulle" a deux extrémités différentes un start et un end, avec collapse tu confonds les deux extrémités (elles deviennent égales) ---> la sélection est "nulle" (elle ne contient pas de texte) en fait c'est juste un curseur...

Après avec collapse tu peux choisir de ramener les deux extrémités à celle de droite (start) ou celle de gauche (end)...

Donc toi tu devrais faire : range.collapse(true); avant execCommand...

[patricktoulon]

ok c'est bien ce que j'avais compris alors et ben ca marche pas

Code javascript :

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

1
2
3
4
5
6
7
8
9
10
function insertimg2(argmt,b,url){
   if (url==="undefined"){url=null;;b=null;}
   // il est important de determiner la selection (meme vide) sinon l'insertion se fait sur tout le document et remplace tout 
   var selection = window.getSelection().getRangeAt(0);
   selection.collapse(true);
   window.getSelection().addRange(selection);             
   //l'avantage de execCommand c'est qu'il ouvre sa propre petite fenetre avec un bouton "parcourir" 
   //possibilité de regler dans cette fenetre l'alignement et le hspaces le src a  l'url du fichier local tel quel
   document.execCommand("insertimage",b,url);  
}

[Beginner.]

Chez moi ça marche très bien mais c'est avec Chrome...

As-tu bien sélectionner quelque chose avant ? Car le range peut être nul...(d’ailleurs il faudrait faire un test à chaque fois pour bien faire...)

[Beginner.]

...
cela consiste a utiliser execCommand("insertimage",null,null) les deux argument a null permetant d'ouvrir une petite boite de dialogue avec le bouton parcourir

J'ai essayé sur Chrome cela insère une balise <img> avec un src à null, il n'ouvre pas de boite de dialogue... Il faut que je regarde ça de plus prés...