ik zit de volgende uitdaging:
Ik heb een "start_berekening" pagina, waarop een gebruiker heel wat dingen moet gaan invullen.
Alles wat hij kan kiezen komt uit SQL tabellen en voor elke materiaal is er één selectie veld.
Nu wil ik op het einde de gebruiker de kans geven om "oneindig" veel onderdelen in te geven via 2 maten en een aantal. Dit omdat het kan zijn dat hij van het één 10 stuks wil, van het andere 2 en van nog een andere 100. Aangezien het niks is dat uit een tabel kan komen, laat ik de gebruiker dmv een knop een modale DIV te zien krijgen.
De gebruiker geeft daar hoogte, breedte en aantal in. Als hij op "Toevoegen" klikt, wil ik dat de data in "een veld" komt, dat daarna ook wordt meegestuurd met de submit.
Alles werkt op dit moment zoals ik wil, alleen loop ik nu tegen een vervelend stukje aan plus ik zou willen weten of ik het wel goed doe of niet.
De code van de modale DIV is deze :
$('#sluiter2').click(function () {
if ($('#passtuklengte').val() != 0 && $('#passtukhoogte').val() != 0) {
passtukarr.push({ lengte: $('#passtuklengte').val(), hoogte: $('#passtukhoogte').val(), aantal: $('#passtukaantal').val() });
var new_text = new String();
new_text = "<table><tr><td colspan='3'><h1>Passtukken</h1></td></tr><tr><th>Lengte</th><th>Hoogte</th><th>Aantal</th></tr>";
$.each(passtukarr, function(i , val) {
new_text += "<tr>";
$.each(val, function(index, value) {
new_text += "<td>" + value + "</td>";
});
new_text += "<td><img src='images/delete.png' id='deleteButton'></td>";
new_text += "</tr>";
});
new_text += "</table>";
var passtukkenarrfield = document.getElementById('passtukkenarr');
passtukkenarrfield.value = JSON.stringify(passtukarr);
$("#passtukken").html(new_text);
$('#passtukken').show();
}
$("#passtuklengte").val("");
$("#passtukhoogte").val("");
$("#passtukaantal").val("");
});
Buiten het feit of dit een goede oplossing is of niet, loop ik tegen twee problemen aan :
1. Als de gebruiker zijn gegevens heeft ingevuld maar nog niet gesubmit heeft en dan per ongeluk F5 of refresh doet, dan zijn de gegevens verdwenen aangezien het in een DIV zit die gevuld wordt met innerHTML.
2. Ik wil de gebruiker de kans geven een "lijn" te deleten, daarvoor heb ik de delete knop al voorzien, maar ik kan niet meegeven aan de knop welke lijn hij moet verwijderen. Waarschijnlijk moet ik daarvoor een parse doen van de JSON, die verwerken en dan weer naar JSON zetten.
Kan er iemand me vertellen of dit al dan niet de beste manier is en zo nee, wat er beter kan of over moet gedaan worden ?
vriendelijke groeten en alvast bedankt.
Davy