Php Foreach Array-Index HTML-modal? Verwenden Sie PHP-Variablen in Modal?

Question

In meinem Code ein array von Artikel/Design Rückkehr Ich bin die HTML mit im, die Vorschau, wie Sie im folgenden Screenshot sehen:

Sobald ich auf einem Punkt bin Klick/ein Formular entwerfen modal wird eingeblendet und bietet dem Benutzer einige Felder selects und input.

Der Code sieht wie folgt aus:

<?php foreach($designs as $design): ?> 
    <!-- HTML code to display designs which are returned from a PHP class --> 
<?php endforeach; ?> 
<div id="modal_form_vertical" class="modal fade"> 
    <!-- Modal HTML code --> 
</div> 

Wie Sie ich bin Speichern der modal Code außerhalb der foreach Schleife sehen.

Da ich verschiedene Elemente/Designs klicken kann, bin ich mir nicht sicher, wie man die URLs/Namen/IDs verwendet, die von der Indexposition des Arrays zurückgegeben werden.

Frage: Wie würde ich die PHP variables, die innerhalb der modal innerhalb der foreach Schleife aviable sind? Muss ich wirklich einen modalforeach Entwurf/Einzelteile schaffen, indem ich den modal Code innerhalb der foreach Schleife setze?

Answer 1

Was Sie brauchen, ist die variable auf den Modal-Triggertaste als data attribute hinzufügen, gegen die können Sie die betreffenden Informationen aus der Datenbank über modalevent Zuhörer & ajax Methode

Modal Trigger

<?php foreach($designs as $design): ?> 
    <button data-toggle="modal" data-target="#modal_form_vertical" data-designid="<?php echo $variableId;?>" class="btn btn-default">Modal</button> 
<?php endforeach; ?> 

buttorn holen oder abrufen

Modal event listener & Ajax Methode

$(document).ready(function(){ 
    $('#modal_form_vertical').on('show.bs.modal', function (e) { 
     var designid = $(e.relatedTarget).data('designid'); //get the id 
     alert(designid); 
     var dataString = 'designid=' + designid; 
     $.ajax({ 
      type: "POST", 
      url: "includes/design_content.php", 
      data: dataString, 
      cache: false, 
      success: function(data){ 
       $("#designcontent").html(data); 
      } 
     }); 
    }); 
}); 

Erstellen

design_content.php

<?php 
    //Include DatabaseConnection 
    //$_POST['designid']; 
    //Run query 
    //Fetch Data 
    //Echo data to show in Modal 
?> 

Modal HTML

<div id="modal_form_vertical" class="modal fade"> 
    <!-- Modal HTML code --> 
    <div id="designcontent"></div> //Here will show the data fetched via ajax. 
</div>