Jump to content
Latest News: (loading..)

How to make a boostrap modal with external element in 2.4

Recommended Posts


I will have a big problem with the actual code when you want to insert a modal boostrap with a call to external files. The modal displays the header and the footer inside.

This tutorial help you to include a modal boostrap with an external element inside the modal without the header and the footer
Thank you to @Harald Ponce de Leon for this help.
I hope, it will be integrate inside the core.

1 step : include a new function
in /OM/PagesAbstract.php

just before

public function useSiteTemplate()


public function setUseSiteTemplate($bool)  {
  $this->use_site_template = ($bool === true);

2nd step : Modal boostrap

now we suppose you want to include a modal inside a file. For example in edit.php

Add this element : the modal boostrap where you want. (Sites/Admin/Pages/Home/template/edit.php)

  $( document ).ready(function() {
    $("#myModal").on("show.bs.modal", function(e) {
      var link = $(e.relatedTarget);

// call pop up inside Amin/Pages

<a href="<?php echo $OSCOM_Manager->link('PopUp'); ?>" data-remote="false" data-toggle="modal" data-target="#myModal" class="btn btn-default">Launch Modal</a>
<!-- Default bootstrap modal example -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      <div class="modal-body">
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>


3nd step : PoPup Actions

In Sites/Admin/Pages/Home/Actions
Create a class called PopUp.php

  namespace OSC\Apps\Communication\PageManager\Sites\Admin\Pages\Home\Actions;

  use OSC\OM\Registry;
  use OSC\OM\HTML;

  class PopUp extends \OSC\OM\PagesActionsAbstract  {

    public function execute()
      $this->page->setUseSiteTemplate(false); // ad this function inside the files


4 step : Popup template

In Sites/Admin/Pages/Home/templates
Create a class called pop_up.php


  use OSC\OM\HTML;
<div class="row">
  <div class="col-sm-12">
    <div class="panel panel-primary">
      <div class="panel-heading">Heading</div>
      <div class="panel-body">
        Put Your stuff in here
        <?php echo HTML::inputField('example', 'toto'); ?>

That's all !
After you can continue your code with save, insert, update ...



Edited by Gyakutsuki


Contact me by skype for business
Contact me @gyakutsuki for an answer on the forum

Tuto for 2.4 :
- How to Display a new page with app
- How to make Header Tags under app APP
- How to make a
boostrap modal with external element


Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now