AccueilCodesTutorielsForumsEmploiLivresGuide achatConnexion

  • Javascript / Ajax / DHTML CodeS-SourceS
  • RSS CodeS-SourceS
  • CodyxBot, le Bot GTalk & MSN qu'il vous faut !
  • Générez des revenus avec vos codes, scripts et tutoriaux
  • Aide à la navigation du site
begin process at 2009 07 05 23:42:13
Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

Sujet : Récupération de variable [ CSS / Général ] (romain14g59)

mardi 1 juillet 2008 à 18:21:44 | Récupération de variable

romain14g59
Bonjour a tous voila j'ai trouver ce script !! http://www.mozilla.org/editor/midasdemo/ il fonctionne nikel mais mon probléme et la récupération du texte entré par l'utilisateur j'aimerer les recupérer par POST part exemple pour les rentré dans une base de données mais l'élément qui contien le texte et une iframe donc je n'arrive pas a le récupérer. voici le code ci dessous .

Merci de votre aide d'avance

Et si vraiment cela et possible comment prés remplir cette zone d'affichage toujours par un aprovisionnement mysql !!

<html>
<head>
<title>Mozilla Rich Text Editing Demo</title>

<style type="text/css">
.imagebutton {height: 22; width: 23; border: solid 2px #C0C0C0; background-color: #C0C0C0}
.image {position: relative; left: 1; top: 1; height:20; width:21; border:none;}
.toolbar {height: 30; background-color: #C0C0C0;}
</style>

<script>

var command = "";

function InitToolbarButtons() {
  var kids = document.getElementsByTagName('DIV');

  for (var i=0; i < kids.length; i++) {
    if (kids[i].className == "imagebutton") {
      kids[i].onmouseover = tbmouseover;
      kids[i].onmouseout = tbmouseout;
      kids[i].onmousedown = tbmousedown;
      kids[i].onmouseup = tbmouseup;
      kids[i].onclick = tbclick;
    }
  }
}

function tbmousedown(e)
{
  var evt = e ? e : window.event; 

  this.firstChild.style.left = 2;
  this.firstChild.style.top = 2;
  this.style.border="inset 2px";
  if (evt.returnValue) {
    evt.returnValue = false;
  } else if (evt.preventDefault) {
    evt.preventDefault( );
  } else {
    return false;
  }
}

function tbmouseup()
{
  this.firstChild.style.left = 1;
  this.firstChild.style.top = 1;
  this.style.border="outset 2px";
}

function tbmouseout()
{
  this.style.border="solid 2px #C0C0C0";
}

function tbmouseover()
{
  this.style.border="outset 2px";
}

  function insertNodeAtSelection(win, insertNode)
  {
      // get current selection
      var sel = win.getSelection();

      // get the first range of the selection
      // (there's almost always only one range)
      var range = sel.getRangeAt(0);

      // deselect everything
      sel.removeAllRanges();

      // remove content of current selection from document
      range.deleteContents();

      // get location of current selection
      var container = range.startContainer;
      var pos = range.startOffset;

      // make a new range for the new selection
      range=document.createRange();

      if (container.nodeType==3 && insertNode.nodeType==3) {

        // if we insert text in a textnode, do optimized insertion
        container.insertData(pos, insertNode.nodeValue);

        // put cursor after inserted text
        range.setEnd(container, pos+insertNode.length);
        range.setStart(container, pos+insertNode.length);

      } else {


        var afterNode;
        if (container.nodeType==3) {

          // when inserting into a textnode
          // we create 2 new textnodes
          // and put the insertNode in between

          var textNode = container;
          container = textNode.parentNode;
          var text = textNode.nodeValue;

          // text before the split
          var textBefore = text.substr(0,pos);
          // text after the split
          var textAfter = text.substr(pos);

          var beforeNode = document.createTextNode(textBefore);
          afterNode = document.createTextNode(textAfter);

          // insert the 3 new nodes before the old one
          container.insertBefore(afterNode, textNode);
          container.insertBefore(insertNode, afterNode);
          container.insertBefore(beforeNode, insertNode);

          // remove the old node
          container.removeChild(textNode);

        } else {

          // else simply insert the node
          afterNode = container.childNodes[pos];
          container.insertBefore(insertNode, afterNode);
        }

        range.setEnd(afterNode, 0);
        range.setStart(afterNode, 0);
      }

      sel.addRange(range);
  };

function getOffsetTop(elm) {

  var mOffsetTop = elm.offsetTop;
  var mOffsetParent = elm.offsetParent;

  while(mOffsetParent){
    mOffsetTop += mOffsetParent.offsetTop;
    mOffsetParent = mOffsetParent.offsetParent;
  }

  return mOffsetTop;
}

function getOffsetLeft(elm) {

  var mOffsetLeft = elm.offsetLeft;
  var mOffsetParent = elm.offsetParent;

  while(mOffsetParent){
    mOffsetLeft += mOffsetParent.offsetLeft;
    mOffsetParent = mOffsetParent.offsetParent;
  }

  return mOffsetLeft;
}

function tbclick()
{
  if ((this.id == "forecolor") || (this.id == "hilitecolor")) {
    parent.command = this.id;
    buttonElement = document.getElementById(this.id);
    document.getElementById("colorpalette").style.left = getOffsetLeft(buttonElement);
    document.getElementById("colorpalette").style.top = getOffsetTop(buttonElement) + buttonElement.offsetHeight;
    document.getElementById("colorpalette").style.visibility="visible";
  } else if (this.id == "createlink") {
    var szURL = prompt("Enter a URL:", "http://");
    if ((szURL != null) && (szURL != "")) {
      document.getElementById('edit').contentWindow.document.execCommand("CreateLink",false,szURL);
    }
  } else if (this.id == "createimage") {
    imagePath = prompt('Enter Image URL:', 'http://');
    if ((imagePath != null) && (imagePath != "")) {
      document.getElementById('edit').contentWindow.document.execCommand('InsertImage', false, imagePath);
    }
  } else if (this.id == "createtable") {
    e = document.getElementById("edit");
    rowstext = prompt("enter rows");
    colstext = prompt("enter cols");
    rows = parseInt(rowstext);
    cols = parseInt(colstext);
    if ((rows > 0) && (cols > 0)) {
      table = e.contentWindow.document.createElement("table");
      table.setAttribute("border", "1");
      table.setAttribute("cellpadding", "2");
      table.setAttribute("cellspacing", "2");
      tbody = e.contentWindow.document.createElement("tbody");
      for (var i=0; i < rows; i++) {
        tr =e.contentWindow.document.createElement("tr");
        for (var j=0; j < cols; j++) {
          td =e.contentWindow.document.createElement("td");
          br =e.contentWindow.document.createElement("br");
          td.appendChild(br);
          tr.appendChild(td);
        }
        tbody.appendChild(tr);
      }
      table.appendChild(tbody);      
      insertNodeAtSelection(e.contentWindow, table);
    }
  } else {
    document.getElementById('edit').contentWindow.document.execCommand(this.id, false, null);
  }
}

function Select(selectname)
{
  var cursel = document.getElementById(selectname).selectedIndex;
  /* First one is always a label */
  if (cursel != 0) {
    var selected = document.getElementById(selectname).options[cursel].value;
    document.getElementById('edit').contentWindow.document.execCommand(selectname, false, selected);
    document.getElementById(selectname).selectedIndex = 0;
  }
  document.getElementById("edit").contentWindow.focus();
}

function dismisscolorpalette()
{
  document.getElementById("colorpalette").style.visibility="hidden";
}

function Start() {
  document.getElementById('edit').contentWindow.document.designMode = "on";
  try {
    document.getElementById('edit').contentWindow.document.execCommand("undo", false, null);
  }  catch (e) {
    alert("This demo is not supported on your level of Mozilla.");
  }

  InitToolbarButtons();
  if (document.addEventListener) {
    document.addEventListener("mousedown", dismisscolorpalette, true);
    document.getElementById("edit").contentWindow.document.addEventListener("mousedown", dismisscolorpalette, true);
    document.addEventListener("keypress", dismisscolorpalette, true);
    document.getElementById("edit").contentWindow.document.addEventListener("keypress", dismisscolorpalette, true);
  } else if (document.attachEvent) {
    document.attachEvent("mousedown", dismisscolorpalette, true);
    document.getElementById("edit").contentWindow.document.attachEvent("mousedown", dismisscolorpalette, true);
    document.attachEvent("keypress", dismisscolorpalette, true);
    document.getElementById("edit").contentWindow.document.attachEvent("keypress", dismisscolorpalette, true);
  }
}

</script>
</head>
<body onLoad="Start()">
<h2>Please note that the changing of text format (Heading, Paragraph, etc.) will only function
properly on a 1.3b build dated after January 26, 2003. Thanks.</h2>
<p>The Cut, Copy, and Paste buttons below are disabled for security reasons. To enable
them for purposes of this demo, you need to
<a href="securityprefs.html">edit your preferences file</a>.</p>
<table bgcolor="#C0C0C0" id="toolbar1">
<tr>
<td>
<div class="imagebutton" id="cut"><img class="image" src="cut.gif" alt="Cut" title="Cut"></div>
</td>
<td>
<div class="imagebutton" id="copy"><img class="image" src="copy.gif" alt="Copy" title="Copy"></div>
</td>
<td>
<div class="imagebutton" id="paste"><img class="image" src="paste.gif" alt="Paste" title="Paste"></div>
<td>
</td>
<td>
</td>
<td>
<div class="imagebutton" id="undo"><img class="image" src="undo.gif" alt="Undo" title="Undo"></div>
</td>
<td>
<div class="imagebutton" id="redo"><img class="image" src="redo.gif" alt="Redo" title="Redo"></div>
</td>
<td>
</td>
<td>
<div style="left: 10;" class="imagebutton" id="createlink"><img class="image" src="link.gif" alt="Insert Link" title="Insert Link"></div>
</td>
<td>
<div style="left: 10;" class="imagebutton" id="createimage"><img class="image" src="image.gif" alt="Insert Image" title="Insert Image"></div>
</td>
<td>
</td>
<td>
<div style="left: 10;" class="imagebutton" id="createtable"><img class="image" src="table.gif" alt="Insert Table" title="Insert Table"></div>
</td>
</tr>
</table>
<br>
<table bgcolor="#C0C0C0" id="toolbar2">
<tr>
<td>
<select id="formatblock" onchange="Select(this.id);">
  <option value="<p>">Normal</option>
  <option value="<p>">Paragraph</option>
  <option value="<h1>">Heading 1 <H1></option>
  <option value="<h2>">Heading 2 <H2></option>
  <option value="<h3>">Heading 3 <H3></option>
  <option value="<h4>">Heading 4 <H4></option>
  <option value="<h5>">Heading 5 <H5></option>
  <option value="<h6>">Heading 6 <H6></option>
  <option value="<address>">Address <ADDR></option>
  <option value="<pre>">Formatted <PRE></option>
</select>
</td>
<td>
<select id="fontname" onchange="Select(this.id);">
  <option value="Font">Font</option>
  <option value="Arial">Arial</option>
  <option value="Courier">Courier</option>
  <option value="Times New Roman">Times New Roman</option>
</select>
</td>
<td>
<select unselectable="on" id="fontsize" onchange="Select(this.id);">
  <option value="Size">Size</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>  
</select>
</td>
<td>
<div class="imagebutton" id="bold"><img class="image" src="bold.gif" alt="Bold" title="Bold"></div>
</td>
<td>
<div class="imagebutton" id="italic"><img class="image" src="italic.gif" alt="Italic" title="Italic"></div>
</td>
<td>
<div class="imagebutton" id="underline"><img class="image" src="underline.gif" alt="Underline" title="Underline"></div>
</td>
<td>
</td>
<td>
<div style="left: 10;" class="imagebutton" id="forecolor"><img class="image" src="forecolor.gif" alt="Text Color" title="Text Color"></div>
</td>
<td>
<div style="left: 40;" class="imagebutton" id="hilitecolor"><img class="image" src="backcolor.gif" alt="Background Color" title="Background Color"></div>
</td>
<td>
</td>
<td>
<div style="left: 10;" class="imagebutton" id="justifyleft"><img class="image" src="justifyleft.gif" alt="Align Left" title="Align Left"></div>
</td>
<td>
<div style="left: 40;" class="imagebutton" id="justifycenter"><img class="image" src="justifycenter.gif" alt="Center" title="Center"></div>
</td>
<td>
<div style="left: 70;" class="imagebutton" id="justifyright"><img class="image" src="justifyright.gif" alt="Align Right" title="Align Right"></div>
</td>
<td>
</td>
<td>
<div style="left: 10;" class="imagebutton" id="insertorderedlist"><img class="image" src="orderedlist.gif" alt="Ordered List" title="Ordered List"></div>
</td>
<td>
<div style="left: 40;" class="imagebutton" id="insertunorderedlist"><img class="image" src="unorderedlist.gif" alt="Unordered List" title="Unordered List"></div>
</td>
<td>
</td>
<td>
<div style="left: 10;" class="imagebutton" id="outdent"><img class="image" src="outdent.gif" alt="Outdent" title="Outdent"></div>
</td>
<td>
<div style="left: 40;" class="imagebutton" id="indent"><img class="image" src="indent.gif" alt="Indent" title="Indent"></div>
</td>
</tr>
</table>
<br>
<iframe id="edit" width="100%" height="200px"></iframe>
<iframe width="250" height="170" id="colorpalette" src="colors.html" style="visibility:hidden; position: absolute;"></iframe>

<script>
function viewsource(source)
{
  var html;
  if (source) {
    html = document.createTextNode(document.getElementById('edit').contentWindow.document.body.innerHTML);
    document.getElementById('edit').contentWindow.document.body.innerHTML = "";
    html = document.getElementById('edit').contentWindow.document.importNode(html,false);
	document.getElementById('edit').contentWindow.document.body.appendChild(html);
    document.getElementById("toolbar1").style.visibility="hidden";
    document.getElementById("toolbar2").style.visibility="hidden";  
  } else {
    html = document.getElementById('edit').contentWindow.document.body.ownerDocument.createRange();
    html.selectNodeContents(document.getElementById('edit').contentWindow.document.body);
    document.getElementById('edit').contentWindow.document.body.innerHTML = html.toString();
    document.getElementById("toolbar1").style.visibility="visible";
    document.getElementById("toolbar2").style.visibility="visible";  
  }
}

function usecss(source)
{
  document.getElementById('edit').contentWindow.document.execCommand("useCSS", false, !(source));  
}

function readonly(source)
{
    document.getElementById('edit').contentWindow.document.execCommand("readonly", false, !(source));  
}
</script>
<input type="checkbox" onclick="viewsource(this.checked)">
View HTML Source</input>
<input checked type="checkbox" onclick="usecss(this.checked)">
Use CSS</input>
<input type="checkbox" onclick="readonly(this.checked)">
Read only</input>

</body>
</html>
mercredi 2 juillet 2008 à 13:59:34 | Re : Récupération de variable

bultez

Membre Club
Bonjour,
on se paint toujours du maque de code pour pouvoir aider.
ici, ce n'est pas le cas.
cependant, moi, je suis totalement noyé dans  ce code justement !
qu'est-ce qui ne fonctionne pas ?
>r>écupération du texte entré par l'utilisateur j'aimerer les recupérer par POST
c'est ça ton souci ?
récupérer par post ?     donc dans un script php, je suppose ? (
( si c'est en javascript, seul get fonctionne )
ben...  un formulaire, avec method="podst"
qui contient un élément avec le name "toto", et php traite $_POST['toto']
                Cordialement            Bul         [mon Site]     [M'écrire]


Cette discussion est classé dans : class, td, id, document, div

Répondre à ce message

Sujets en rapport avec ce message

connaitre la position (coordonnées) du curseur de la souris? [ par johanb ] Bonjour à tous, tous est dis dans le titre.Je sais c'est censé être qqc de basique, mais j'ai du mal. Voici l'origine de mon probleme: j'ai une liste document.getElementById() .div [ par abdoulax ] Bonjour, Je voulais faire un truc du genre : document.getElementById(id).div.style.paddingTop="0px"; En faite je veux modifier le style des div enfa Ajouter un Div dans un li [ par yanis7518 ] Salut a tous je souhaiterais pouvoir créer et ajouter des div dans des balises li créées dynamiquementvoici mon code    var newLi= document.createElem IE + Ajax + Css : pas de css ! [ par lyrix37 ] Bonjour la compagnie ! et bien mon problème est tout simple : j'ai fait une page web, avec changement de div en ajax : mais quand je change ce div, q Recuperation d'ID DE DIV [ par grandpa006 ] Bonjour,Voila je voudrais recuperer l'ID de mes DIV en meme temps que le click de la souris mais j'y arraive pas.Si une ame charitable a une idée se s remplir plusieurs champs avec une checkbox [ par jul_diedhiou ] bonjour à tous et à toutes, Je voudrais savoir comment remplir tous les champs d'un formulaire ,à l'identique d'autre champs, par le biais d'une che class et id définis dans une même balise ? [ par sagat06 ] Bonjour à tous.J'aimerais savoir s'il existe un moyen de définir à la fois la class et l'id d'une div, du genre:En effet, j'ai plusieurs div dans ma p un formulaire n'est pas rempli par des infos transmis avec ajax [ par tiwtiwa11 ] Bonjour tout le monde,j'ai un problème que j'ai pas pu résoudre ça fait une semaine,je m'explique:j'ai une liste déroulante dans laquelle je choisis u Agrandissement et reduction d'une div onclick [ par davidcian ] Bonjour,Voila j'aimerais réduire et agrandir le contenu d'une div lorsque qu'on clique sur un petit icon +/- d'une barre de navigation, ça marche pas Fonction avec boucle for qui ne marche pas [ par toons43 ] Bonjour à tous,J'ai un souci avec une fonction que j'ai crée, c'est une fonction qui me permet de zoomer des thumbnails (6 en tout) en changeant le co


Nos sponsors

Sondage...

CalendriCode

Juillet 2009
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
2728293031  

Consulter la suite du CalendriCode

Téléchargements

Logiciels à télécharger sur le même thème :

Comparez les prix Nouvelle version


RIM BlackBerry Storm 9530
Entre 72€ et 72€


Visiter le guide achat

Photothèque Nouveau !

Photo sitges beachPhoto Cockpit Airbus A320
Photo accident de la routePhoto alphabet signes des sourds

Visiter la photothèque


Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés
Temps d'éxécution de la page : 1,498 sec

Google Coop CodeS-SourceS Google Coop CodeS-SourceS


Certaines images présentes sur le site (notament certains avatars) sont issues des collections IconShock, donc si vous souhaitez utiliser ces icons vous devez les acheter, ne les copiez pas et ne utilisez pas dans vos sites et applications sans les avoir commandé.