Tut mir Leid, manchmal ist es Recht schwer nachzudenken, und zu merken, dass alle anderen ja nicht die Datei vor den Augen haben^^
function updateLegung(legungsId)
{
//Falls eine Legung neu erstellt werden soll, ist de Uebergabewert == Null.
if (legungsId == 0){
//Es wird die Anzahl der Legungen iteriert.
anzahlLegungen++;
//Initialisierung von Hilfsvariablen.
var m = anzahlLegungen;
var n = anzahlLegungen.toString();
//Der spaetere Namen fuer diese Legung wird erstellt.
var lengthName = "length_" + n;
var legebarrenName = "legebarren_" + n;
var legungName = "legung_" + n;
var stueckzahlName = "anzahl_" + n;
var tabelleName = "tabelle_" + n;
//Jetzt werden die Eingabefelder erstellt.
var einzufuegendeLength = document.createElement("input");
var einzufuegendeLegebarren = document.createElement("select");
var einzufuegendeLegung = document.createElement("input");
var einzufuegendeStueckzahl = document.createElement("input");
//Attribute werden zugewiessen.
einzufuegendeLength.type = "number";
einzufuegendeLength.name = "Die gewünschte Rapportlänge";
einzufuegendeLength.id = lengthName;
einzufuegendeLength.step = "2";
einzufuegendeLegebarren.name = "Der gewünschte Legebarren";
einzufuegendeLegebarren.id = legebarrenName;
//HIER NOCH WERTE EINFUEGEN!!!
einzufuegendeLegebarren.options[0] = new Option("");
einzufuegendeLegung.type = "text";
einzufuegendeLegung.name = "Die gewünschte Legung";
einzufuegendeLegung.id = legungName;
einzufuegendeLegung.maxLength = "";
einzufuegendeLegung.size = "10";
einzufuegendeStueckzahl.type = "number";
einzufuegendeStueckzahl.name = "Die gewünschte Anzahl";
einzufuegendeStueckzahl.id = stueckzahlName;
//Jetzt werden die Objekte in die bestehende Tabelle angefuegt.
var table = document.getElementById("tabelleLegung");
var lastRow = numRows("tabelleLegung");
var row_0 = table.insertRow(lastRow);
var row_1 = table.insertRow(lastRow + 1);
var row_2 = table.insertRow(lastRow + 2);
var cell_00 = row_0.insertCell(0);
var cell_01 = row_0.insertCell(1);
var cell_10 = row_1.insertCell(0);
var cell_11 = row_1.insertCell(1);
var cell_20 = row_2.insertCell(0);
var cell_21 = row_2.insertCell(1);
var cell_22 = row_2.insertCell(2);
var tdhtml1 = document.createElement("td");
var tdhtml2 = document.createElement("td");
var tdhtml3 = document.createElement("td");
tdhtml1.innerHTML = "Rapportlänge:";
tdhtml2.innerHTML = "Legebarren:";
tdhtml3.innerHTML = "";
cell_00.appendChild(tdhtml1);
cell_01.appendChild(einzufuegendeLength);
cell_10.appendChild(tdhtml2);
cell_11.appendChild(einzufuegendeLegebarren);
cell_20.appendChild(tdhtml3);
cell_21.appendChild(einzufuegendeLegung);
cell_22.appendChild(einzufuegendeStueckzahl);
//Jetzt werden noch zusaetzliche Attribute gesetzt.
document.getElementById(legungName).setAttribute("required", "required");
document.getElementById(lengthName).setAttribute("required", "required");
document.getElementById(stueckzahlName).setAttribute("required", "required");
document.getElementById(legebarrenName).setAttribute("required", "required");
//Jetzt wird noch der Eventlistener angehaengt.
document.getElementById(legungName).addEventListener("focus", function(){
updateLegung(m);
}
);
} else {
//Initialisierung von der Maximalen Laenge und den Legungsmultiplikatoren
var legungsName = "legung_" + legungsId;
var maximaleLaenge = null;
var i = null;
var legungsmultiplikatorRapport = null;
var legungsmultiplikatorFinal = null;
var rapportlaenge = "length_" + legungsId;
var legungsMaske = "";
//Erfassung der maximalen Laenge und des finalen legungsmultiplikators
legungsmultiplikatorRapport = document.forms['formular'][rapportlaenge].value;
legungsmultiplikatorFinal = (legungsmultiplikatorRapport * legungsmultiplikatorMc);
maximaleLaenge = (2 * legungsmultiplikatorFinal) + 1;
//Die maximale Laenge des Feldes wird angepasst.
document.forms['formular'][legungsName].maxLength = maximaleLaenge;
//Erstellen der Maskierung
if(legungsmultiplikatorMc == 2){
for (i = 0; i < (legungsmultiplikatorFinal / 2); i++)
{
legungsMaske = legungsMaske + "9-9/";
}
}else {
for (i = 0; i < (legungsmultiplikatorFinal / 4); i++)
{
legungsMaske = legungsMaske + "9-9-9-9/";
}
}
legungsMaske = legungsMaske + "/";
//Konsolenausgabe
console.log(legungsMaske);
//Jetzt wird das Textfeld maskiert
$(function($){
$("#legungName").mask(legungsMaske,{placeholder:" "});
});
}
}
Alles anzeigen
Ich habe einen Button im Formular der der diese Funktion mit dem Übergabewert 0 aufruft. Dann werden ein paar weitere Eingabefelder erneut in die Tabelle eingefügt. Immer wenn der Focus auf bestimmte Input-Felder kommt, wird der die Funktion mit der entsprechenden Nummerierung aufgerufen. Also beim zweiten entsprechenden Input-Feld dann mit dem Übergabewert 1. Ich hoffe das ist soweit verständlich.
Jetzt hätte ich auch noch gerne, dass diese Felder maskiert werden. Wie sie maskiert werden, habe ich, wie oben zu sehen, schon hinbekommen. Aber leider weiß ich jetzt nicht ("#legungName") dynamisch verändern kann. Eine variable ist dort ja nicht erlaubt. Wenn ich statisch z.B.: ("#legung_1") festlege funktioniert es für dieses Feld.