Checkboxen und AJAX Problem mit Darstellung der Haken

[CrazyPlaya]

Hallo zusammen,

ich habe folgendes Problem. Durch anklicken von Ästen in einer Treeview werden entsprechend Daten zu diesem gewähltem Datensatz via AJAX nachgeladen. Über jQuery setze ich dann entsprechend eines bestimmten Wertes eine Checkbox auf checked also

$('#mycheckbox').attr('checked', 'checked');

Das funktioniert beim ersten Mal auch sehr gut. Attribut checked wird gestezt und der Haken dargestellt.
Nun wechsle ich in meiner Ansicht den Ast und bekomme die Daten dazu. Wechsel ich jetzt wieder zurück auf den vorherigen Datensatz ist die entsprechende Checkbox zwar auch checked gesetzt, sorcih das Nachladen funktioniert ebenfalls einwandfrei aber der Haken wird nicht mehr dargestellt.
Das Projekt selbst ist zwar mit Zend Framework 2 erstellt und die Daten werden auch darüber nachgeladen aber ich gehe ertsmal davon aus, dass dies ein Problem mit AJAX sein wird.

Kennt jemand den Effekt und kann man was dagegen tun?

Besten Gruß
Karsten

 

[hub]

Moin moin,
das sind zu wenig Infos, eigentlich funktioniert das gut, egal ob mit oder ohne Ajax. Was holst du per Ajax, Html oder nur die Daten? Wenn nur Daten, wie ordnest du die Daten den Elementen zu? So, wie du es beschreibst, würde ich vermuten, das die Events, die was bewirken sollen, nach dem Request nicht mehr existieren. Es ist nur eine Vermutung, da dein Code-Schnipsel nicht wirklich was aussagt, Das Problem liegt wo anders. Was sagen deine Debugger dazu (was gibt Php und was Javascript)?
(Sorry, aber über Ostern wirst du mit verzögerten Reaktionen rechnen müssen )

Gruß Ulli

 

[CrazyPlaya]

Moin Ulli,

Also per Ajax hole ich mir nur die Daten und gebe diese als JSON Objekt an meine JS Funktion zurück. Wie gesagt, der Effekt tritt nurn auf wenn ich das gleich Object zum zweiten Mal aufrufe, sprich der Haken bereits einmal gesetzt war und auch nur da wo ich Daten via AJAX hole. Kann natürlich tatsächlich sein, das es was mit den View Methoden vom ZF2 bzw. in dieser Kombination zu tun hat. Daten von PHP kommen auch korrekt zurück. Wie oben bereits erwähnt wird das Element auch als checked gesetzt, nur eben der Haken nicht mehr gezeichnet.

Die Daten ordne ich via jQuery und Zugriff über die Selektoren den jeweiligen Formfeldern zu. Im Debugger alles gut. Keine Fehler zu finden.

Hier nochmal die Javascript Funktion im ganzen.

function changeCategoryDetails(id)
{
    var data = { catId : id }
    $.ajax({
       type: 'POST',
       url: '/mg_category/category/changecategorydetails',
       data: data,
        beforeSend: function() {
           $('#spinner').show();
        },
        complete: function(){
           $('#spinner').hide();
        },
        success: function(data, status) {
            result = JSON.stringify(data);
            parsedResult = $.parseJSON(result);
            $('#Shops option:selected').removeAttr('selected');
            $.each(parsedResult['selectedChannels'], function() {
                $('#Shops option[value="'+this['objectId']+'"]').attr('selected', 'selected');
            });
            $('#Title').val(parsedResult['categoryDescription']['categoryName']);
            $('#Description').val(parsedResult['categoryDescription']['categoryDescription']);
            if (parsedResult['category']['type'] == 2) {
                $('#CategoryType').attr('checked', 'checked');
            } else {
                $('#CategoryType').removeAttr('checked');
            }
            $('#categoryHeader').val(parsedResult['categoryDescription']['headingTitle']);
            $('#Tooltip').val(parsedResult['categoryDescription']['toolTip']);
            $('#MetaTitle').val(parsedResult['categoryDescription']['metaTitle']);
            $('#MetaDescription').val(parsedResult['categoryDescription']['metaDescription']);
            $('#MetaKeywords').val(parsedResult['categoryDescription']['metaKeywords']);
            $('#PageTitle').val(parsedResult['categoryDescription']['pageTitle']);
            $('#URLKey').val(parsedResult['categoryDescription']['linkName']);
            $('#categoryFrooglePath').val(parsedResult['categoryDescription']['frooglePath']);
            $('#categorySiteHeader').val(parsedResult['categoryDescription']['pageTitle']);
            $('#categorySiteText').val(parsedResult['categoryDescription']['siteText']);
            return false;
        },
        error: function(xhr, err) {
            alert('Error:' + err.code);
       }
    });
}

Kein Problem mit dem warten, der Fehler ist gerade noch nicht so hoch priorisiert

Besten Gruß
Karsten

 

[CrazyPlaya]

Gelöst isses
Der hub hat mich auf die Lösung gebracht. An dieser Stelle nochmals vielen Dank dafür

Damit der Haken immer gesetzt wird wenn man das entsprechende Element mehrmal auswählt muss in diesem Fall nicht das Attribut sondern die Property gesetzt werden.

//Anstatt
$('#CategoryType').attr('checked', 'checked');
$('#CategoryType').removeAttr('checked');

//also
$('#CategoryType').prop('checked', 'checked');
$('#CategoryType').removeProp('checked');

Sollte man auf das Attribut selbst zugreifen müssen muss man beide Optionen nutzen!

Besten Gruß und schickes Wochenende
Karsten