Insérer des balises HTML avec du javascript
Umbriel08
Messages postés
65
Date d'inscription
Statut
Membre
Dernière intervention
-
Umbriel08 Messages postés 65 Date d'inscription Statut Membre Dernière intervention -
Umbriel08 Messages postés 65 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
J'aimerais savoir s'il est possible d'insérer des balises HTML avec du javascript, si oui, comment ?
Exemple : Je clique sur un bouton, ça insère une nouvelle ligne à mon tableau.
J'aimerais savoir s'il est possible d'insérer des balises HTML avec du javascript, si oui, comment ?
Exemple : Je clique sur un bouton, ça insère une nouvelle ligne à mon tableau.
A voir également:
- Html dans js
- Editeur html - Télécharger - HTML
- Br html ✓ - Forum Webmastering
- Round js ✓ - Forum Javascript
- Html br ✓ - Forum Webmastering
- Balise </br> - Forum HTML
14 réponses
En fait,
Je développe une petite application pour mon stage.
Dans cette appli, j'ai un tableau ou des clients insère des produits avec des champs d'un formulaire.
Je commence mon formulaire avec 10 entrées et si le client en souhaite plus, il appuie sur un bouton que j'ai créer en bas de la page "Ajouter une ligne".
J'ai plusieurs problème à ce niveau car je n'ai quasiment jamais fait de javascript.
J'ai donc essayer ceci. (Ce qui apparement ne marche pas)
(Désolé du gros pavé)
Je développe une petite application pour mon stage.
Dans cette appli, j'ai un tableau ou des clients insère des produits avec des champs d'un formulaire.
Je commence mon formulaire avec 10 entrées et si le client en souhaite plus, il appuie sur un bouton que j'ai créer en bas de la page "Ajouter une ligne".
J'ai plusieurs problème à ce niveau car je n'ai quasiment jamais fait de javascript.
J'ai donc essayer ceci. (Ce qui apparement ne marche pas)
(Désolé du gros pavé)
<?php
session_start();
// Page pour demander une fourniture
?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xml:lang="fr" lang="fr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title></title>
<link rel="stylesheet" type="text/css" href="stylesheet_appli.css" />
<script type="text/javascript">
var c,c2,ch,num,start;
start = 11;
// ajouter un champ avec son "name" propre;
function plus(){
c=document.getElementById('div');
c2=c.getElementsByTagName('input');
num=c2.length + start;
document.getElementById('div').innerHTML = '<td>';
ch=document.createElement('input');
ch.setAttribute('type','text');
ch.setAttribute('name','ref'+num);
c.appendChild(ch);
document.getElementById('div').innerHTML = '</td><td>';
ch=document.createElement('input');
ch.setAttribute('type','text');
ch.setAttribute('name','desc'+num);
c.appendChild(ch);
document.getElementById('div').innerHTML = '</td><td>';
ch=document.createElement('input');
ch.setAttribute('type','text');
ch.setAttribute('name','qte'+num);
c.appendChild(ch);
document.getElementById('div').innerHTML = '</td><td>';
ch=document.createElement('input');
ch.setAttribute('type','radio');
ch.setAttribute('name','type'+num);
c.appendChild(ch);
ch=document.createElement('input');
ch.setAttribute('type','radio');
ch.setAttribute('name','type'+num);
c.appendChild(ch);
document.getElementById('div').innerHTML = '</td><td>';
ch=document.createElement('input');
ch.setAttribute('type','text');
ch.setAttribute('name','obs'+num);
c.appendChild(ch);
document.getElementById('div').innerHTML = '</td>';
// document.getElementById('sup').style.display='inline';
}
</script>
</head>
<body id='body' >
<form id='form' method='post' action='demandeFournitureEffectuee.php'>
<div id='div'>
</div>
<table id='demande'>
<tr>
<td></td>
<th>Référence</th>
<th>Description*</th>
<th>Quantité*</th>
<th>Type*</th>
<th>Observations éventuelles</th>
</tr>
<?php
// Possibilité d'ajouté 10 enregistrements en une seul fois
for ($i=1;$i<=10;$i++){
echo '<tr>
<td>'.$i.'</td>
<td><input type=\'text\' name=\'ref'.$i.'\' /></td>
<td><input type=\'text\' name=\'desc'.$i.'\' /></td>
<td><input type=\'text\' name=\'qte'.$i.'\'/></td>
<td><input type=\'radio\' name=\'type'.$i.'\' value=\'bureau\' id=\'bureau\' checked=\'checked\'/><label for=\'bureau\'>Bureau</label>
<input type=\'radio\' name=\'type'.$i.'\' value=\'informatique\' id=\'informatique\'/><label for=\'informatique\'>Info.</label></td>
<td><input type=\'text\' name=\'obs'.$i.'\' class=\'observation\'/></td>
</tr>';
}
?>
</table>
<p class='petit'>* Champ obligatoire</p>
<br />
<div class='center'>
<input type="button" value="Ajouter une ligne" onclick="plus()" />
<input type='submit' value='Valider' class='submit' />
</form>
<form action='index.php' class='right'>
<input type='submit' value='Retour' class='submit' />
</form>
</div>
</body>
</html>
