Momenteel ben ik bezig met een scriptje voor een nieuwe site van mij, om precies te zijn ben ik al 2 weken (niet fulltime ofcourse
) bezig met het script, javascript is mijn zwakste punt..
Wat het script moet doen is niet zooo moeilijk.. Het moet rows toevoegen en verwijderen per row en de values opslaan. 1 row bestaat uit een selectbox + input veld, na het aanmaken van de row kan deze ook weer verwijderd worden via een linkje die naast de row staat.
Ik wil dit als volgt aanpakken:
function addSlice() - voegt een row toe aan de innerhtml van een divje in de html
function removeSlice(ID) - verwijderd de row
Nu lukt dit allemaal aardig, behalve dat als ik de function removeSlice aanroep die de gehele innerHTML verwijderd, terwijl die alleen maar 1 row moet verwijderen.
De rows zitten namelijk in een <div> en elke row heeft ook weer een <div>.. ik wil dus de div-childs verwijderen.
De code ziet er als volgt uit:
Ik zou dus graag willen weten hoe ik de div-children kan verwijderen. En verder heb ik nog een probleempje, als ik de function removeSlice() aanroep en vervolgens de function addSlice() aanroep doet die niks meer, er komen geen nieuwe rows meer bij.
Hartelijk dank voor evt. reacties
Wat het script moet doen is niet zooo moeilijk.. Het moet rows toevoegen en verwijderen per row en de values opslaan. 1 row bestaat uit een selectbox + input veld, na het aanmaken van de row kan deze ook weer verwijderd worden via een linkje die naast de row staat.
Ik wil dit als volgt aanpakken:
function addSlice() - voegt een row toe aan de innerhtml van een divje in de html
function removeSlice(ID) - verwijderd de row
Nu lukt dit allemaal aardig, behalve dat als ik de function removeSlice aanroep die de gehele innerHTML verwijderd, terwijl die alleen maar 1 row moet verwijderen.
De rows zitten namelijk in een <div> en elke row heeft ook weer een <div>.. ik wil dus de div-childs verwijderen.
De code ziet er als volgt uit:
code:
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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
| <html>
<head>
<script langauge="javascript">
<!--
function addSlice()
{
var playerPrices, ID;
ID = document.form.divID.value;
playerPrices += '<div id="pp_'+ID+'">';
playerPrices += '<table width="400" cellpadding="0" cellspacing="0">';
playerPrices += '<tr>';
playerPrices += '<td width="100" class="size12"><b>Players</b></td>';
playerPrices += '<td colspan="3" class="size12"><b>Total Price</b></td>';
playerPrices += '</tr>';
playerPrices += '<tr>';
playerPrices += '<td> </td>';
playerPrices += '<td width="85" align="center" class="size12"><u>$ USD</u></td>';
playerPrices += '<td width="85" align="center" class="size12"><u>€ Euro\'s</td>';
playerPrices += '<td width="130" align="center" class="size12"><u>£ Brittish Pounds</u></td>';
playerPrices += '</tr>';
playerPrices += '</table>';
playerPrices += '<table width="400" cellpadding="0" cellspacing="0">';
playerPrices += '<tr>';
playerPrices += '<td width="100">';
playerPrices += '<select class="input" name="players[]">';
playerPrices += '<option value="">TESTING</option>';
playerPrices += '</select>';
playerPrices += '</td>';
playerPrices += '<td width="85" align="center" class="size12">$ <input type="text" class="input" name="price_u'+ID+'" value="" size="5" maxlength="7"></td>';
playerPrices += '<td width="85" align="center" class="size12">€ <input type="text" class="input" name="price_e'+ID+'" value="" size="5" maxlength="7"></td>';
playerPrices += '<td width="130" align="center" class="size12">£ <input type="text" class="input" name="price_p'+ID+'" value="" size="5" maxlength="7"></td>';
playerPrices += '<td width="130" align="center" class="size12"><a href="javascript:removeSlice('+ID+')">Verwijderen</a></td>';
playerPrices += '</tr>';
playerPrices += '</table></div>';
divPlayerPrices.innerHTML += playerPrices;
ID++;
document.form.divID.value = ID;
}
function removeSlice(ID)
{
document.getElementById('divPlayerPrices', 'pp_ID' + ID).style.display = 'none';
}
-->
</script>
</head>
<body>
<form method="post" name="form">
<input type="hidden" name="divID" value="1">
<a href="javascript:addSlice()">Klik Hier</a> |
<div id="divPlayerPrices">
</div>
</form>
<!-- div.style.display='none' -->
</body>
</html> |
Ik zou dus graag willen weten hoe ik de div-children kan verwijderen. En verder heb ik nog een probleempje, als ik de function removeSlice() aanroep en vervolgens de function addSlice() aanroep doet die niks meer, er komen geen nieuwe rows meer bij.
Hartelijk dank voor evt. reacties