Display diffrent Gallery in einem modalen Ajax Codeiginter

Question

Hallo ich würde gerne wissen, wie ich eine andere Galerie für jede Schaltfläche anzeigen konnte, die ich klicke. Hier ist meine Ansicht Code:

 <div id="gallery-buttons"> 
     <div class="row"> 
      <div class="col-md-2 col-md-offset-3"> 
       <p>Eagle Fruit South Africa</p> 
       <img src="<?= base_url() ?>assets/img/site/apple.png" class="img-responsive" id="apple" 
        alt="apple"/> 
       <button type="button" onclick="saBtn()" class="btn btn-primary btn-sm" id="saBtn">View Gallery 
       </button> 
      </div> 
      <div class="col-md-2"> 
       <p>Eagle Fruit Kenya</p> 
       <img src="<?= base_url() ?>assets/img/site/avo.png" class="img-responsive" id="strawberry" 
        alt="avocado"/> 
       <button type="button" onclick="kenyaBtn()" class="btn btn-primary btn-sm" id="kenyaBtn">View 
        Gallery 
       </button> 
      </div> 
      <div class="col-md-2"> 
       <p>Eagle Fruit Egypt</p> 
       <img src="<?= base_url() ?>assets/img/site/strawberry.png" id="eorange" class="img-responsive" 
        alt="strawberry"/> 
       <button type="button" onclick="egyptBtn()" class="btn btn-primary btn-sm" id="egyptBtn">View 
        Gallery 
       </button> 
      </div> 
     </div> 
    </div> 
</div> 

Also wenn ich auf saBtn sagen, dass ich für diese Galerie der Bilder zu hergeholt aus der Datenbank möchte und in der modal angezeigt werden, wie würde ich dies erreichen mit Ajax

hier ist meine Javascript-Funktionen bisher

/* Gallery Modals */ 
function saBtn(){ 
    $('#modalGallery').modal('show'); 
    $('.modal-title').text('Eagle Fruit South Africa Gallery'); // Set Title to Bootstrap modal title 
} 

function kenyaBtn(){ 
    $('#modalGallery').modal('show'); 
    $('.modal-title').text('Eagle Fruit Kenya Gallery'); // Set Title to Bootstrap modal title 
} 

function egyptBtn(){ 
    $('#modalGallery').modal('show'); 
    $('.modal-title').text('Eagle Fruit Egypt Gallery'); // Set Title to Bootstrap modal title 
} 

ich habe folgendes Setup in meinem Modell:

function get_sa(){ 
    $this->db->select('*'); 
    $this->db->from('gallery'); 
    $this->db->join('gallery_images', 'gallery_images.gallery_id = gallery.name','left'); 
    $this->db->where('gallery.gallery_name' == 'South Africa'); 
    $query = $this->db->get(); 
    return $query->result('array'); 
} 

function get_egypt(){ 
    $this->db->select('*'); 
    $this->db->from('gallery'); 
    $this->db->join('gallery_images', 'gallery_images.gallery_id = gallery.name','left'); 
    $this->db->where('gallery.gallery_name' == 'Egypt'); 
    $query = $this->db->get(); 
    return $query->result('array'); 
} 

function get_kenya(){ 
    $this->db->select('*'); 
    $this->db->from('gallery'); 
    $this->db->join('gallery_images', 'gallery_images.gallery_id = gallery.name','left'); 
    $this->db->where('gallery.gallery_name' == 'Kenya'); 
    $query = $this->db->get(); 
    return $query->result('array'); 
} 

Wie übertrage ich nun die Ergebnisse zum Modal und baue die Galerie?

Answer 1

Verwenden Sie AJAX, um die Ergebnisse von codeigniter zu erhalten