Nom image à inserer

Résolu
cathy9999 Messages postés 68 Date d'inscription dimanche 6 janvier 2013 Statut Membre Dernière intervention 10 décembre 2023 - 2 juil. 2007 à 15:37
cathy9999 Messages postés 68 Date d'inscription dimanche 6 janvier 2013 Statut Membre Dernière intervention 10 décembre 2023 - 11 juil. 2007 à 12:00
Bonjour,

Dans un formulaire qui a un champ qui permet d'uploader plusieurs fichiers, j'aimerais mettre un bouton "inserer" a coté de celui ci pour qu'il puisse selectionner le nom de l'image prête à être uploader, et que ce nom soit inserer dans la zone textarea. ou un glisser deposer.
Est ce possible? si oui comment faire? si non quel solution proposez vous?

J'ai déja mon champ upload et qui charge mes fichiers grace a mn bouton envoyer.
Quand je clique sur le bouton upload, ca me marque le chemin comme ceci C:\DocumentsandSettings\image1.jpg
et je recherche a faire un bouton inserer qui quand on cliquera dessus, prendre la valeur image1.jpg et ira l'inserer dans ma textarea avec les crochets <!-- / message -->
merci

Je suis debutante de chez debutante

<!-- / message -->

79 réponses

cathy9999 Messages postés 68 Date d'inscription dimanche 6 janvier 2013 Statut Membre Dernière intervention 10 décembre 2023
3 juil. 2007 à 15:56
En faite imagine dans la liste deroulante :

collines.jpg
nenuphar.jpg
rouge.jpg

et j'aimerais quand je vais selectionner par exemple collines.jpg et que je clique sur inserer, ca me marque dans textarea
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
3 juil. 2007 à 16:17
utiliser onchange sur la balise      <select    onchange="(**)">
   
(**) "l'option choisie" c'est this.options[this.selectedIndex].text
       avec ça tu fais la même chose que dans l'autre fonction.

       attention à onchange... si le select n'a pas de siez= ou si
           ce size=1, ma 1ère ligne est sélectionnée par défaut et
           ne sera donc opérationnelle qu'après avoir cliqué sur une autre ligne
       donc
        mettre <select size=2 au moins... ou
        perso, je fais : <select.... onfocus="this.selectedIndex=-1;"... ou
        d'autres préfère mettre une 1ère option bidon et tester si
              selectedIndex==0, et dans ce cas ne rien faire

       chacun ses goûts, et les vaches seront bien gardées...

<hr />


Cordialement                Bul     [mon Site]     [M'écrire]



<hr />
0
cathy9999 Messages postés 68 Date d'inscription dimanche 6 janvier 2013 Statut Membre Dernière intervention 10 décembre 2023
3 juil. 2007 à 16:43
Bon ben merci bien, je vais tentée! je vais voir... merci beaucoup de votre aide.
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
4 juil. 2007 à 12:55
on réflêchit parfois lentement ( enfin, moi souvent ! )
pour l'ajout des input file, il faudrait essayer avec createElement et appendChild...
    forts soupçons que ça devrait baigner !
<hr />


Cordialement                Bul     [mon Site]     [M'écrire]



<hr />
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
cathy9999 Messages postés 68 Date d'inscription dimanche 6 janvier 2013 Statut Membre Dernière intervention 10 décembre 2023
4 juil. 2007 à 14:15
Je cherche une autre solution car elle me parait un peu compliqué, et de plus je suis débutante!
Si je la trouve, je la mettrais ici
0
cathy9999 Messages postés 68 Date d'inscription dimanche 6 janvier 2013 Statut Membre Dernière intervention 10 décembre 2023
4 juil. 2007 à 14:23
var _indice=0;
function addInputFile(id) {
 var dest=document.getElementById(id);
 var div=document.createElement("div");
 var input=document.createElement("input");
 input.type="file";
 input.id="f"+_indice;
 div.appendChild(input);
        div.appendChild(createBoxDel(div));
 dest.appendChild(div);
        _indice++;
}
function createBoxDel() {
 var input=document.createElement("input");
 input.type="checkbox";
 input.onclick=function() {
  var p=this.parentNode;
  div=p.parentNode;
  div.removeChild(p);
 }
 return input;
}
0
cathy9999 Messages postés 68 Date d'inscription dimanche 6 janvier 2013 Statut Membre Dernière intervention 10 décembre 2023
4 juil. 2007 à 14:36
Mais là mon souci c'est juste pr les champs qui s'effacent, sinon ca marche super mes champs qui s'ajoutent
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
4 juil. 2007 à 14:52
j'ai essayé avec createElement, appendChild...
et : ça baigne, les champs ne s'effacent pas .

<script type="text/javascript">
   var num=0;
   function ajout()
   {    var i=document.createElement("input");
        i.type="file";
        i.id="fic"+num;
        i.name="fic[]";


        var d=document.createElement("div");




        d.appendChild(i);
        document.getElementById(


'divFichiers'


).appendChild(d);
        num++;
   }
</script>
<form    name="frm"
         enctype="multipart/form-data"
         method="POST" >
  

   
   

</form>





    comme je ne suis pas très doué, je bute lamentablement sur
           la syntaxe pour la "récupération" des données en php.

<hr />


Cordialement                Bul     [mon Site]     [M'écrire]



<hr />
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
4 juil. 2007 à 15:28
    ouf...  problème de syntaxe résolus :

    un ch'tit exemple... à peaufiner donc....

<?php
if (isset($_FILES['fic']['name']))
{ for ( $n=0; $n<

count($_FILES['fic']['name'])


;$n++ )
  { if ( $_FILES['fic']['error'][$n]==0 )
    { move_uploaded_file($_FILES['fic']['tmp_name'][$n],$_FILES['fic']['name'][$n]); }
  }
}
?>

<script type="text/javascript">
   var num=0;
   function ajout()
   {    var i=document.createElement("input");
        i.type="file";
        i.id="fic"+num;
        i.name="fic[]"
        var d=document.createElement("div");       
        d.appendChild(i);
        document.getElementById('divFichiers').appendChild(d);
        num++;
   }
</script>
<form name="frm"
      enctype="multipart/form-data"
      method="POST" >
  

   
   

</form>



pour moi... tout baigne
<hr />


Cordialement                Bul     [mon Site]     [M'écrire]



<hr />
0
cathy9999 Messages postés 68 Date d'inscription dimanche 6 janvier 2013 Statut Membre Dernière intervention 10 décembre 2023
4 juil. 2007 à 16:51
Cela veut dire que ma fonction create champ je m'en sers plus ?

var i=0;
function create_champ()
{    i++;
    document.getElementById('leschamps').innerHTML +=
        ''+
        '
';
}
0
cathy9999 Messages postés 68 Date d'inscription dimanche 6 janvier 2013 Statut Membre Dernière intervention 10 décembre 2023
4 juil. 2007 à 16:55
j'ai remplacé cela marche mais comment limiter a 10 champs seulement
0
cathy9999 Messages postés 68 Date d'inscription dimanche 6 janvier 2013 Statut Membre Dernière intervention 10 décembre 2023
4 juil. 2007 à 17:10
ah non je suis aller un pe trop vite ! cela vide les champs quand meme !
marche donc pas!
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
5 juil. 2007 à 11:02
je t'assure que mon exemple fonctionne, sans vider les champs
( coté serveur aussi ).

si tu veux limiter, n'ajoute que si num est <= maxi

dès que j'ai trouvé un moyen élégant de supprimer des fichiers
à télécharger ( j'ai une solution qui fonctionne mais qui ne me
plait pas ), je pense faire un truc plus général.

<hr />


Cordialement                Bul     [mon Site]     [M'écrire]



<hr />
0
cathy9999 Messages postés 68 Date d'inscription dimanche 6 janvier 2013 Statut Membre Dernière intervention 10 décembre 2023
5 juil. 2007 à 11:34
Alors je recapitule, ma synthaxe devrait être comme cela :

var num<= 10
   function ajout()
   {    var i=document.createElement("input");
  

'si je veux un bouton inserer nom a côté de chaque champ ajouté'
        i.type ="file";
        i.id="fic"+num;
        i.name="fic[]"
        var d=document.createElement("div");       
        d.appendChild(i);
        document.getElementById('divFichiers').appendChild(d);
        num++;
   }
function inserer_nom(num) {
   var text = document.getElementById('fichier_'+num).value;
    var fichier = text.substr(text.lastIndexOf('\\')+1); //LastIndexOf recuperes le dernier ""
    document.getElementById('textarea').value+= '\n';
}

[javascript:void(ajout()); Ajouter un champ]
0
cathy9999 Messages postés 68 Date d'inscription dimanche 6 janvier 2013 Statut Membre Dernière intervention 10 décembre 2023
5 juil. 2007 à 11:38
Je ne vais jamais m'en sortir, autre souci encore : ca upload juste la premiere image du premier champ! je suis débutante...est ce que je vais réussir? snif ...
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
5 juil. 2007 à 12:01
>>je ne vais jamais m'en sortir,
    mais si, mais si...

    pas toujours simple, mais ce ne serait pas amusant sinon...

>>si je veux un bouton inserer nom a côté de chaque champ ajouté

    dans le  div créé, on insère un input file.
    = ==> insère en plus un button.

    à propos, j'ai mis un div... qui est inutile...

<script type="text/javascript">
    var num=0;
   function ajout(ou)
   {   

var d=document.createElement("div");


       
var i=document.createElement("input");
        i.type="file";
        i.name="fic[]"
        d.appendChild(i);

        var b=document.createElement("input");
        b.type="button";
        b.value="texte du bouton";

        b.onclick=function()    {    alert(num);    }

        d.appendChild(b);

        ou.appendChild(d);

        num++;
   }
</script>
<form name="frm"
      enctype="multipart/form-data"
      method="POST" >
  

   
</form>





et copté php, respecter la syntaxe... ça baigne...
( même s'il faudrait améliorer un peu )

<?php
if (isset($_FILES['fic']['name']))
{   for ( $n=0; $n<

count($_FILES['fic']['name'])


;$n++ )
    {   if ( $_FILES['fic']['error'][$n] ==0 )
        {    move_uploaded_file( $_FILES['fic']['tmp_name'][$n] ,
                                 $_FILES['fic']['name'][$n] );    }
    }
}
?>





<hr />



Cordialement                Bul     [mon Site]     [M'écrire]



<hr />
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
5 juil. 2007 à 13:10
j'ai fait un petit truc plus général.    http://www.javascriptfr.com/code.aspx?ID=43349
( avec bouton pour supprimer un fichier, tu peux t'en inspirer pour faire ce que tu veux )
<hr />


Cordialement                Bul     [mon Site]     [M'écrire]



<hr />
0
cathy9999 Messages postés 68 Date d'inscription dimanche 6 janvier 2013 Statut Membre Dernière intervention 10 décembre 2023
5 juil. 2007 à 14:27
Merci beaucoup! tout marche maintenant il me reste plus qu'a l'adapter a ma fonction inserer nom et de faire pour ma liste déroulante :
var num= 0;
function ajout()
   {    var i=document.createElement("input");
        i.type="file";
        i.id="fic"+num;
        i.name="fic[]";       
  
 var d=document.createElement("div");
        d.appendChild(i);
        document.getElementById( 'divFichiers' ).appendChild(d);
 
 var b=document.createElement("input");
        b.type="button";
        b.value="inserer nom image";
  b.onclick= inserer_nom
  b.width="120";


        d.appendChild(b);


        num++;
    }



function inserer_nom(num)
{    var text = document.getElementById('fichier_'+num).value;
    var fichier = text.substr(text.lastIndexOf('\\')+1); //LastIndexOf recuperes le dernier ""
    document.getElementById('textarea').value+= '\n';
}

[javascript:void(ajout()); Ajouter un champ]
0
cathy9999 Messages postés 68 Date d'inscription dimanche 6 janvier 2013 Statut Membre Dernière intervention 10 décembre 2023
5 juil. 2007 à 14:41
  C'est dans cet synthaxe je sias pas quoi mettre pour que ca appele la fonction

b.onclick= "inserer_nom";
0
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
5 juil. 2007 à 14:54
met ta fonction...    comme dans mon exemple ( pour supprimer )

b.onclick=function()
{   var text = document.getElementById('fichier_'+num).value;
    var fichier = text.substr(text.lastIndexOf('\\')+1); //LastIndexOf recuperes le dernier ""
    document.getElementById('textarea').value+= '\n';
   
}

pour ton "script actuel".

si tu utilises la source UMP, num n'est pas utilisé.
regarde  parentNode , ...Child....

<hr />


Cordialement                Bul     [mon Site]     [M'écrire]



<hr />
0
Rejoignez-nous