Dynamisch wechselnder Inhalt eines Posts (CMS)

Question

Ich versuche ein einfaches CMS zu erstellen. Bearbeiten von Posts funktioniert gut, aber ich habe Schwierigkeiten, wie ich den "aktuellen" Beitrag, den Sie bearbeiten (Ajax) wechseln würde.

Ich fand heraus, dass ich ein zusätzliches Eingabefeld mit der aktuellen Post-ID zu jedem "Übersicht" -Element hinzufügen könnte (das mit css ausgeblendet wird).

Was ich suche (oder andere Lösung): Wenn einer der "Übersicht-Post-Box" geklickt wird, findet die Verwendung von jquery/js das Element mit der Klasse: "Post-ID" (in diesem bestimmten Element Na sicher). Und sendet eine XHR-Anfrage an eine andere Seite, die diese ID enthält, gibt dies den angeforderten Post zurück, der in den "Post bearbeiten" -Feldern platziert ist.

Alle Ideen dazu sind willkommen! Danke im Voraus!

<?php foreach($projects as $project){ ?> 
    <a href="<?php echo $project['project_link'] ?>" class="overview-post-box"> 
     <div class="overview-post"> 
      <div class="post-id"><?php echo $project['project_id']; ?></div> 
       <div class="title"> 
        <?php echo $project['project_title']; ?> 
       </div> 
       <div class="content"> 
        <?php echo substr($project['project_content'], 0, strpos($project['project_content'], ' ', 40)) ?> 
       </div> 
     </div> 
    </a> 
<?php }; ?> 

Answer 1

Es gibt viele Möglichkeiten, diese Aufgabe speziell VueJs zu erreichen klingt wie ein Gewinner, diese Aufgabe zu tun, aber für jQuery denke ich, dass Sie so etwas tun kann.

1. Zuerst mit einem Daten anhängen Attribut die ID des Projekts

<a data-id="<?php echo $project['project_id']; ?>" href="<?php echo $project['project_link'] ?>" class="overview-post-box"> 

2.- die jQuery-Handler Binden Sie die Post-Daten zu erhalten und Ihre Formularelemente zu aktualisieren.

$(document).ready(function(){ 
    $('.overview-post-box').click(function(event){ 
     event.preventDefault(); //Stop default <a> behavior 
     var id = $(this).data('id'); //get the current clicked post id 
     //do an ajax request to fetch post data 
     $.get('/getpostdata.php?id='+id,function(response){ 
     //return a json from your php side something like 
     // {data: { title: 'post title', body: 'post body' } 

     /* asign the json values to your inputs */ 
     $('your_input_class or id to the hidden id').val(id); 
     $('your_input_class or id to the title').val(response.data.title); 
     $('your_input_class or id to the body').val(response.data.body); 
     } 
    }); 
});