Dynamische Inhalte mit for-schleife generieren

[preko]

Hallo,

ich möchte eine dynamische Ausgabe des folgenden Codes per JavaScript generieren lassen:

$(document).ready(function(){
    var date_input=$('input[name="mod_1_start"]');
    var container=$('.bootstrap-iso form').length>0 ? $('.kurse').parent() : "body";
    date_input.datepicker({
        language: "de",
        container: container,
        todayHighlight: true,
        clearBtn: true,
        autoclose: true,
        daysOfWeekDisabled: [0],
        datesDisabled: [],   
        startView: 1,
        assumeNearbyYear: true
    })
})   

$(document).ready(function(){
    var date_input=$('input[name="mod_1_ende"]');
    var container=$('.bootstrap-iso form').length>0 ? $('.kurse').parent() : "body";
    date_input.datepicker({
        language: "de",
        container: container,
        todayHighlight: true,
        clearBtn: true,
        autoclose: true,
        daysOfWeekDisabled: [],
        datesDisabled: [],   
        startView: 1,
        assumeNearbyYear: true
    })
})

Da ich dies jedoch nicht x-Mal händisch eintragen möchte, sondern Bedarfsgerecht, soll diese Ausgabe in einer FOR-Schleife eingebunden werden. Meine Vorstellung ist so etwas:

var modules = 10; 
        
for (var i = 1;i <= modules;i++) {   
    $(document).ready(function(){
        var date_input=$('input[name="mod_ + modules + _start"]');
        var container=$('.bootstrap-iso form').length>0 ? $('.kurse').parent() : "body";
        date_input.datepicker({
            language: "de",
            container: container,
            todayHighlight: true,
            clearBtn: true,
            autoclose: true,
            daysOfWeekDisabled: [0],
            datesDisabled: [],   
            startView: 1,
            assumeNearbyYear: true
        })
    })   

    $(document).ready(function(){
        var date_input=$('input[name="mod_ + modules + _ende"]');
        var container=$('.bootstrap-iso form').length>0 ? $('.kurse').parent() : "body";
        date_input.datepicker({
            language: "de",
            container: container,
            todayHighlight: true,
            clearBtn: true,
            autoclose: true,
            daysOfWeekDisabled: [],
            datesDisabled: [],   
            startView: 1,
            assumeNearbyYear: true
        })
    }) 
}

Dies ist ein Teil eines Kalenderscripts, welches diverse Inputfelder mit einem Kalender ausstattet innerhalb eines HTML/PHP-Formulars. Das Problem ist, dass das Ganze nicht entsprechend dynamisch ausgegeben wird, sprich wie in diesem konstruierten Fall von 10 "Durchläufen".

Ich vermute, dass es ein Problem in diesem Bereich ist: ="mod_ + modules + _start", und "mod_ + modules + _ende", wo irgendwo die Anführungszeichen falsch gesetzt sind. Hat jemand einen Tipp für mich?

Beste Grüße!

 

[basti1012]

Sollte man die Zeilen nicht so machen ??

 var date_input=$('input[name="'+mod_ + modules + _start+'"]');
     var date_input=$('input[name="'+mod_ + modules + _ende+'"]');

mehr sehe ich gerade auf der schnelle nicht

 

[preko]

@basti1012:
vielen Dank für die Idee, allerdings funktioniert es leider nicht.

 

[basti1012]

Hast du das schon Online ? Das wäre wahrscheinlich einfacher wenn man den ganzen Code sehen würde und in action

 

[preko]

@basti1012:
Nein, ist noch nicht online. Habe aber aufgrund des gravierenden Zeitmangels das Ganze mit einer PHP Ausgabe realisiert, die den JavaSript-Code mit PHP-Variablen ausgibt. Quick & dirty, aber funktionierend. Vielen Dank nochmals!

$modules = 10;

for ($i = 1; $i <= $modules; $i++) {   
        echo "
        $(document).ready(function(){
            var date_input=$('input[name=\"mod_" . $i . "_start\"]');
            var container=$('.bootstrap-iso form').length>0 ? $('.kurse').parent() : \"body\";
            date_input.datepicker({
                language: \"de\",
                container: container,
                todayHighlight: true,
                clearBtn: true,
                autoclose: true,
                daysOfWeekDisabled: [0],
                datesDisabled: [],   
                startView: 1,
                assumeNearbyYear: true
            })
        })   

        $(document).ready(function(){
            var date_input=$('input[name=\"mod_" . $i . "_ende\"]');
            var container=$('.bootstrap-iso form').length>0 ? $('.kurse').parent() : \"body\";
            date_input.datepicker({
                language: \"de\",
                container: container,
                todayHighlight: true,
                clearBtn: true,
                autoclose: true,
                daysOfWeekDisabled: [],
                datesDisabled: [],   
                startView: 1,
                assumeNearbyYear: true
            })
        })"; 
    }

Aber jetzt wo ich das gerade schreibe, glaube ich den Fehler im Javascript gefunden zu haben.

Es müsse wohl statt:
var date_input=$('input[name="mod_ + modules + _ende"]'); tatsächlich
var date_input=$('input[name="mod_ + i + _ende"]');
lauten, da ansonsten die Gesamtanzahl der Module (in diesem Falle 10 - Variable "modules") und nicht die aufsteigende Iteration (Variable "i") eingesetzt wird!

Naja, höchste Zeit für Feierabend!