CodeS-SourceS est hébergé par Frontier.fr

Ce site au démarrage

begin process at 2012 05 29 05:16:11

Accueil Codes Tutoriels Forum Livres Emploi Services Connexion

Trouver un code source :

dans

[ Dernières recherches ]

Accueil > Forum >

Drag & Drop, Glisser Deposer => bp de prob !

Poser une question dans le forum ou lancer une discussion

Drag & Drop, Glisser Deposer => bp de prob !

jeudi 4 mai 2006 à 01:33:45 | Drag & Drop, Glisser Deposer => bp de prob !

danvy

21 msg

24 msg CS

Bonjour a tous,
Voici ce que j'ai fais pour l'instant [ Lien ] et en gros je crée un post-it contenant l'heure suivant ce que l'utilisateur à selectionner.
Le probleme est le suivant: j'aimerais pouvoir saisir le post it, c'est a dire faire un drag and drop sur mes post it et pouvoir les deplacer dans les cases de mon tableau ou bien dans une poubelle. Je cherche sur internet depuis trop longtemp et la je pete un plomb. J'ai presque essayé pas mal de truc: wz_dragdrop.js,.... mais je n'y arrive pas !

Voici le code de ma page utilisant le wz_dragdrop.js:
Je vous enleve le bout de code qui ne concerne pas l'exemple, voici donc le site ci dessus simplifié pour la situation :

<html>
<head>
<title>Planning</title>
<script language="JavaScript" type="text/JavaScript">

function suivant_jour() {
ho1=document.h1.h1_debut.options[document.h1.h1_debut.selectedIndex].text;
ho2=document.h1.h1_fin.options[document.h1.h1_fin.selectedIndex].text;
ho3=document.h2.h2_debut.options[document.h2.h2_debut.selectedIndex].text;
ho4=document.h2.h2_fin.options[document.h2.h2_fin.selectedIndex].text;
heure=ho1+"h"+ho2+"\r\n"+ho3+"h"+ho4;

if (verif_jour())
{afficher("fond_tab1");

function suivant_nuit() {
ho1=document.h3.h3_debut.options[document.h3.h3_debut.selectedIndex].text;
ho2=document.h3.h3_fin.options[document.h3.h3_fin.selectedIndex].text;
ho3=document.h4.h4_debut.options[document.h4.h4_debut.selectedIndex].text;
ho4=document.h4.h4_fin.options[document.h4.h4_fin.selectedIndex].text;
heure=ho1+"h"+ho2+"\r\n"+ho3+"h"+ho4;

if (verif_nuit())
{afficher("fond_tab2");

function suivant_off() {
journee=document.h5.h5_journée.options[document.h5.h5_journée.selectedIndex].text;

if (verif_off())
{afficher("fond_tab3");

function ajouter_employé() {
    var newRow = document.getElementById('table').insertRow(-1);
    var newCell = newRow.insertCell(0);
    newCell.innerHTML = '<align="center"><input type="text" size="10">';
    newCell = newRow.insertCell(1);
    newCell.innerHTML = '<select name="poste"><option>Choisir<option>Cuisine<option>Salle<option>Bar<option>Réception<option>Autre';
newCell = newRow.insertCell(2);
    newCell.innerHTML = '';
newCell = newRow.insertCell(3);
    newCell.innerHTML = '';
newCell = newRow.insertCell(4);
    newCell.innerHTML = '';
newCell = newRow.insertCell(5);
    newCell.innerHTML = '';
newCell = newRow.insertCell(6);
    newCell.innerHTML = '';
newCell = newRow.insertCell(7);
    newCell.innerHTML = '';
newCell = newRow.insertCell(8);
    newCell.innerHTML = '';
newCell = newRow.insertCell(9);
    newCell.innerHTML = '';
newCell = newRow.insertCell(10);
    newCell.innerHTML = '';
newCell = newRow.insertCell(11);
    newCell.innerHTML = '';
newCell = newRow.insertCell(12);
    newCell.innerHTML = '';
newCell = newRow.insertCell(13);
    newCell.innerHTML = '';
newCell = newRow.insertCell(14);
    newCell.innerHTML = '';
newCell = newRow.insertCell(15);
    newCell.innerHTML = '';
newCell = newRow.insertCell(16);
    newCell.innerHTML = '';
newCell = newRow.insertCell(17);
    newCell.innerHTML = '';
newCell = newRow.insertCell(18);
    newCell.innerHTML = '';
newCell = newRow.insertCell(19);
    newCell.innerHTML = '';
newCell = newRow.insertCell(20);
    newCell.innerHTML = '';
newCell = newRow.insertCell(21);
    newCell.innerHTML = '';
newCell = newRow.insertCell(21);
    newCell.innerHTML = '';
}
</script>
</head>

<font size="4" face="Verdana" color="#000000">
<p>Planning Avec Horaire nuit / 37 heures</p></font>

<p>1 - Pour ajouter une tranche horaire, veuillez choisir le type :</p>
<p><form name="type_horaire">
<INPUT type="button" name="type_horaire" OnClick="horaire_jour();" value="Horaire de jour"> <INPUT type="button" name="type_horaire" OnClick="horaire_nuit();" value="Horaire de nuit"> <INPUT type="button" name="type_horaire" OnClick="journée_off();" value="Journée Off">
</form></p>

<div id="Layer1" style="position:absolute; left:10px; top:130px; width:390px; height:150px; z-index:3; overflow: hidden; visibility: hidden;">
<form name="h1">
Horaire de jour :
<p>2 - Début tranche horaire :
<SELECT NAME="h1_debut"><option value="">hh</option><option value="07">07</option><option value="08">08</option><option value="09">09</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option>
</SELECT>h
<SELECT NAME="h1_fin"><option value="">min</option><option value="0">00</option><option value="15">15</option><option value="30">30</option><option value="45">45</option>
</SELECT></p>
</form>

<form id="h2" name="h2">
<DIV><p>3 - Fin tranche horaire :
<SELECT id="h2_debut" onchange=changeliste_jour() name="h2_debut"><option value="" selected>hh</option><option value="07">07</option><option value="08">08</option><option value="09">09</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option>
</SELECT>h
<A id="h2_fin_div"><SELECT id="h2_fin" name="h2_fin"><option value="" selected>min</option>
</SELECT></A></p>
<p><input type="button" name="Suivant" OnClick="suivant_jour();" value="Suivant" width="57" height="16"></p>
</DIV>
</form>
</div>

<div id="Layer2" style="position:absolute; left:10px; top:130px; width:390px; height:150px; z-index:2; overflow: hidden; visibility: hidden;">
<form name="h3">
Horaire de nuit :
<p>2 - Début tranche horaire :
<SELECT NAME="h3_debut"><option value="">hh</option><option value="0">22</option><option value="1">23</option><option value="2">00</option><option value="3">01</option><option value="4">02</option><option value="5">03</option><option value="6">04</option><option value="7">05</option><option value="8">06</option><option value="9">07</option>
</SELECT>h
<SELECT NAME="h3_fin"><option value="">min</option><option value="0">00</option><option value="15">15</option><option value="30">30</option><option value="45">45</option>
</SELECT></p>
</form>

<form id="h4" name="h4">
<DIV><p>3 - Fin tranche horaire :
<SELECT id="h4_debut" onchange=changeliste_nuit() name="h4_debut">
<option value="" selected>hh</option><option value="0">22</option><option value="1">23</option><option value="2">00</option><option value="3">01</option><option value="4">02</option><option value="5">03</option><option value="6">04</option><option value="7">05</option><option value="8">06</option><option value="9">07</option>
</SELECT>h
<A id="h4_fin_div"><SELECT id="h4_fin" name="h4_fin">
<option value="" selected>min</option></SELECT></A></p>
<p><input type="button" name="Suivant" OnClick="suivant_nuit();" value="Suivant" width="57" height="16"></p>
</DIV>
</form>
</div>

<div id="Layer3" style="position:absolute; left:10px; top:130px; width:390px; height:150px; z-index:1; overflow: hidden; visibility: hidden;">
<form name="h5">
Journée Off :
<p>2 - Choix de la journée Off :
<SELECT NAME="h5_journée"><option value="">Choisir</option><option value="lundi">Lundi</option><option value="mardi">Mardi</option><option value="mercredi">Mercredi</option><option value="jeudi">Jeudi</option><option value="vendredi">Vendredi</option><option value="samedi">Samedi</option><option value="dimanche">Dimanche</option>
</SELECT></p>
</form>
<p><input type="button" name="Suivant" OnClick="suivant_off();" value="Suivant" width="57" height="16"></p>
</form>
</div>

<div id="tableau_employé" style="position:absolute; left:10px; top:450px; width:790px; height:100px; z-index:8; visibility: visible;">
<p align="right"><IMG SRC="source/trash.jpg" name="trash" TITLE="Corbeille" ondragdrop ="ok();"></p>
<p align="right"><input type="button" name="button" onClick="ajouter_employé()" value="Ajouter un employé"></p>
<p><table width="100%" id="table" border="1">
    <tr>
        <td width="8%"><div align="center" class="Style1">Employé</div></td>
        <td width="8%"><div align="center" class="Style1">Poste</div></td>
  <td width="12%" colspan="3"><div align="center" class="Style2"><em>Lundi</em></div></td>
  <td width="12%" colspan="3"><div align="center" class="Style2"><em>Mardi</em></div></td>
  <td width="12%" colspan="3"><div align="center" class="Style2"><em>Mercredi</em></div></td>
  <td width="12%" colspan="3"><div align="center" class="Style2"><em>Jeudi</em></div></td>
  <td width="12%" colspan="3"><div align="center" class="Style2"><em>Vendredi</em></div></td>
  <td width="12%" colspan="3"><div align="center" class="Style2"><em>Samedi</em></div></td>
  <td width="12%" colspan="3"><div align="center" class="Style2"><em>Dimanche</em></div></td>
    </tr>
<tr>
  <td width="8%"><input name="nom_employe" type="text" size="10"></td>
  <td width="8%">
   <select>
    <option>Choisir</option>
    <option>Cuisine</option>
    <option>Réception</option>
    <option>Salle</option>
    <option>Bar</option>
    <option>Autre</option>
   </select>
  </td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
  <td width="3%"></td>
</tr>
</table></p>
</div>

</font>

</div>
</body>
</html>

_________________________________________________________________________________________

Voila je ne sais pas si ça va vous aider mais je desespere ! En gros mon post-it est un div caché par defaut que je rend visible en cliquant sur un bouton et ke je rempli avec un innerHTML.
Maintenant j'aimerais faire un glisser deposer pour les mettre dans mon tableau (sachant que je dois faire des controle derriere ! coherence des horaires,...)

Je remerci d'avance tous ceux qui sacrifiront de leur temps pour ce sujet !
Help me please !!!

Cette discussion est classée dans : jour, post, document, innerhtml, newcell

Répondre à ce message

Sujets en rapport avec ce message

Lien sur 1 message par jour.(*.JS) [ par bonobos ] Bonjour à tous,J'ai un script .js qui m'affiche un message différent chaque jour.Comment faire un lien sur chaque message ? MerciVoilà le script JS:{v Recuperation d'un POST d'un popup vers une frame de la fenetre ki a ouvert le popup [ par Petiout2 ] bonjour,j'aimerai recuperer un post d'un popup, et renvoyé ces informations vers la fenetre mere ki a appelé le popupj'ai essayé ca : function verif pb de getElementById [ par kidpigeyre ] for(var i=0;i { document.getElementById("tete")[i].innerHTML=document.getElementById("tete")[i].innerHTML.substr(0,3); }voila ça ça ne ma Incompatibilté navigateur [ par porciner ] function writit(text,id){ if(document.getElementById) { x=document.getElementById(id); x.innerHTML=''; x.innerHTML=text;& Problème avec la fonction switch [ par stiml ] Bonjour, Je sais qu'on a posté plusieurs questions sur ce sujet mais je n'est pas trouvée ma réponseMerci de m'éclairer sur cette fonction qui ne fonc couleur, radiobutton, onclick [ par gabs77 ] slt, j'ai un souci avec mon formulairej'ai un formulaire de base auquel j'ai des formulaires spécifiques par rapport a des choix effectuer dans ce for modifié neige en hiver [ par vollibre ] Bonjour à tousVoila j'ai decidé de mettre un peut les mains dans le cambuit :)et déja j'ai un petit soucis qui je pense dois etre tres simple a regler petite question sur document.body.innerHTML [ par Bestdoud ] Bonjour,j'utilise la focntion document.body.innerHTML pour ajouter du texte dans ma page. et je me suis aperçu qu' à chaque ajout, la page était comme Select et message d'erreur [ par sterkasor ] Bonjourjai modifie mon formulaire d'enregistrement depuis je n'ai plus d'alert d'erreur pour le paysje pense que cela viens de textbox que je lai modi Pb AJAX sous IE [ par Emcy ] bonjour,j'ai créé un mini projet où j'ai 3 fichiers :- 1 fichier html : pour affichier ma page- 1 fichier javascript : script lié à ma page html- 1 fi

Livres en rapport

Fireworks MX pour PC/MAC

DocBook. La référence

BusinessObjects 5.1 et WebIntelligence 2.6.

Acrobat Reader

Tous les livres pour Jour, Post, Document, Innerhtml, Newcell

Nos sponsors

Derniers Blogs

JOYEUX ANNIVERSAIRE NIX par ebartsoft

IMAGINE CUP 2012, MAKE A SIGN EN FINALE par junarnoalg

KINECT 1.5 IS OUT ! par Vko

LES ACTUALITéS DE LA SEMAINE SUR C2I.FR (14 MAI - 20 MAI) par richardc

REACTIVE EXTENSIONS : CONSOMMER DES SERVICES AVEC RX PARTIE 3, LES PIèGES à éVITER par Groc

Forum

MULTI SLIDER UNE SEUL PAGE par karouani

RE : CODE POUR FAIRE APPARAîTRE UN TEXTE EN DESSOUS D'UN LIEN par emuleed2k

RE : RéCUPERATION D'UNE VARIABLE DE JAVASCRIPT VIA PHP par smahaneAAI

POPUP OUVERT à PARTIR D'UN IFRAME par mrassaa

UTILISER UN .JS par zaikoe

Côté IT

Offres d'emploi

Formations Video

Appels d'offres

Installation et configuration de blogs Wordpress
Budget : 8 500€
Recheche Web Master pour MAJ de plateformes Musical
Budget : 500€
Realisation d-une version 2 d-un site e-commerce existant sous prestashop-REPUBLICATION
Budget : 5 000€

Logiciels

sDEVIS-FACTURES vlPRO (8.1.0.3)
SDEVIS-FACTURES VLPRO (8.1.0.3)

sDEVIS-FACTURES vlPRO a été mis au point pour les particuliers, créateurs, entrepreneurs, artisa...

Cliquez pour télécharger sDEVIS-FACTURES vlPRO
974 Application Server (12.2.4.6)
974 APPLICATION SERVER (12.2.4.6)

Développez de puissantes applications dans un environnement de 'cloud computing', clusterisé, séc...

Cliquez pour télécharger 974 Application Server
vPicture (1.4.2.1)
VPICTURE (1.4.2.1)

Avec vPicture, hébergez vos images facilement et rapidement. vPicture est un utilitaire simple, ...

Cliquez pour télécharger vPicture
Easy-Planning (2.2.1.6)
EASY-PLANNING (2.2.1.6)

Easy-Planning permet de créer des plannings sous la représentation de diagrammes et est adapté au...

Cliquez pour télécharger Easy-Planning
COM-BACKUP (2.0)
COM-BACKUP (2.0)

COM-BACKUP est un logiciel de sauvegarde qui permet de planifier les sauvegardes de vos dossiers ...

Cliquez pour télécharger COM-BACKUP