CakePHP-Forum.com

[Mathias]

Hallo,

ich bin beim Proggen auf ein Problem gestoßen, was ich mir nicht erklären kann.
Ich habe ein Album, in dem mehrere Bilder mit einer bestimmten Position sind.
Diese sind gefloatet und sollen später einfach über jquery.sortable änderbar sein.

Das Sortieren funktioniert schon mal super, aber ich hänge bei der AJAX-Abfrage, die mir die neuen Bildpositionen speichern soll.

Auszug aus dem JavaScript-Teil.

Code: Alles auswählen

                    onStop:         function() {
                                        serial = $.SortSerialize('photoFloat');
                                        var AlbumId = $('#AlbumId input').attr('value');
                                        $.ajax({
                                            type: 'post',
                                            timeout: 7000,
                                            data: {AlbumId: AlbumId, serial: serial.hash},
                                            url: 'admin_saveNewPositions',
                                            complete: function(j){
                                                alert(j.responseText);
                                            }
                                        })
                                    }
                });

1. Problem:
serial wird übertragen, die AlbumId, die in einem hidden-input steht, nicht. Warum?

2. Problem
Nach dem Absenden der Abfrage, enthält der Response-Text des XML-Objekts den kompletten Source Code der Website anstatt "true".
Hier ist bloß die Testfuntkion:

Code: Alles auswählen

function admin_saveNewPositions() {
        if($this->RequestHandler->isAjax()) {
            echo "true";
            $this->render(null,'ajax');
            exit;

        }
    }

Die Abfrage kommt von der Seite: root/admin/albums/edit/1

Der Source Code im Response-Text zeigt, dass der url-Parameter ignoriert wird, denn der verweist auf root/albums/edit

Was aber auch wieder komisch ist, denn es wird die Abfrage ignoriert, ob eine ID zum Abfragen übergeben wurde.

Ich kann mir echt nicht weiterhelfen. Vielleicht seh ich auch den kleinen Fehler einfach nicht mehr

Ich bin dankbar für jede Hile.

[Alex]

Also wenn AlbumId nicht übergeben wird, serial aber sehr wohl, dann kann es ja nur daran liegen das AlbumId nicht verfügbar bzw. gesetzt ist. Probier doch mal das Feld direkt in das data-Object zu übergeben. Also anstelle von ... { AlbumId: AlbumId ... } schreibst du dann ... { AlbumId: $('#AlbumId input').val() ... }

Zeig uns doch evtl. nochmal den passenden HTML-Code dazu.

Beim zweiten Problem könnte evtl. ein $this->layout = ajax; helfen. Zusätzlich sollte das Debugging an dieser stelle deaktiviert werden.

[euromark]

ich benutz immer:

Code: Alles auswählen

$this->autoRender=false;

im controller
damit wird auch unterbunden, dass ein view gerendert wird


im app controller sollte auch nicht fehlen:

Code: Alles auswählen

        if($this->RequestHandler->isAjax() /*|| $this->RequestHandler->isXml()*/) {
            Configure::write('debug', 0);
        }

sofern die Component benutzt wird, und man das zentral steuern will
damit spart man sich, dauernd bei jeder ajax methode das mit anzugeben - aber sonst klappts halt im debug modus nich

[Mathias]

Also wenn AlbumId nicht übergeben wird, serial aber sehr wohl, dann kann es ja nur daran liegen das AlbumId nicht verfügbar bzw. gesetzt ist. Probier doch mal das Feld direkt in das data-Object zu übergeben. Also anstelle von ... { AlbumId: AlbumId ... } schreibst du dann ... { AlbumId: $('#AlbumId input').val() ... }

Zeig uns doch evtl. nochmal den passenden HTML-Code dazu.

Beim zweiten Problem könnte evtl. ein $this->layout = ajax; helfen. Zusätzlich sollte das Debugging an dieser stelle deaktiviert werden.

Wenn ich input weglasse, funktioniert es
Mit der AJAX-Abfrage muss ich mal schauen. Hab mich die ganze Zeit an jquery ui effekten aufgehalten

[Mathias]

Ich steck schon wieder bei der AJAX-Sache fest. Ich muss irgendwas übersehen.

JavaScript

Code: Alles auswählen

<script type="text/javascript">

    $(document).ready(function() {
       
        $('#photoFloat').sortable({
            opacity:        0.75,
            revert:         false,
            tolerance:      'pointer',
            placeholder:    'itemHelper',
            containment:    'parent',
            beforeStop:     function(e, ui){
                                $('#data').append($('#photoFloat').sortable('toArray') + '<br />');
                                $.dimScreen(1000, 0.75, function() {
                                    /** $('#myElement').fadeIn(); **/
                                });
                   
                            },
            update:         function(e, ui){
                                /**alert($('#photoFloat').sortable('toArray'))**/
                                ui.item.effect("pulsate", { times: 1 }, 500);
                                var AlbumId = $('#AlbumId').val();
                                serial = $('#photoFloat').sortable('toArray');
                                $.ajax({
                                    type: "POST",
                                    timeout: 7000,
                                    data: {AlbumId: AlbumId, serial: serial},
                                    url: "admin_getPositions",
                                    success: function(r, t){
                                        $.dimScreenStop();
                                        alert(r);
                                    }
                                })                         
                            }
        });
                       
    });
</script>

HTML

Code: Alles auswählen

<div id="data"></div>
<?php if (!empty($album['Photo'])):?>
    <div id="photoListing">
        <div class="top"></div>
        <div class="middle" id="photoFloat">
            <?php foreach ($album['Photo'] as $photo):?>
            <div class="item" id="<?php echo $photo['id'];?>">
            <?php echo 
                                $html->image(
                                    'photos/thumbs/'.$photo['id'].'.jpg',
                                    array('alt' => $photo['caption'])
                                )
                            ;?>
            </div>
            <?php endforeach; ?>

weiter oben im Quelltext steht auch die AlbumId. Die wird ja jetzt auch übergeben.

PHP

Code: Alles auswählen

    function admin_edit($id = null) {
        if($this->RequestHandler->isAjax()) {
            $this->autoRender=false;
            Configure::write('debug', 0);
            echo 'true';
            $this->render(null,'ajax');exit;
            #$this->set('input', $_POST);
            # print_r($_POST);
            #$result =  $this->Photo->find('all', array('conditions' => array('Photo.album_id' => $_POST['AlbumId']), 'fields' => array('id', 'position', 'album_id'), 'order' => 'position ASC', 'recursive' => 0));
            #if(!empty($result)) { echo "true"; } else { echo "false"; }
        }
    }

    function admin_getPositions() {
        if($this->RequestHandler->isAjax()) {
            $this->autoRender=false;
            $this->layout = ajax;
            Configure::write('debug', 0);
            echo 'true';
            $this->render(null,'ajax');exit;
            #$this->set('input', $_POST);
            # print_r($_POST);
            #$result =  $this->Photo->find('all', array('conditions' => array('Photo.album_id' => $_POST['AlbumId']), 'fields' => array('id', 'position', 'album_id'), 'order' => 'position ASC', 'recursive' => 0));
            #if(!empty($result)) { echo "true"; } else { echo "false"; }
        }
    }
 

Ich habe also nun den ganzen Kram in admin_edit reingepackt. Und nun funktioniert es. Aber ich verstehe immer noch nicht, warum AJAX die url "adminPositions" ignoriert. Die Funktion soll ja noch ausgebaut werden und ich möchte nicht, dass die in "admin_edit" steht.

Any ideas?

[Mathias]

So, Problem gelöst.

Code: Alles auswählen

url: "/admin/albums/getPositions"