Revisions to Click on custom button opens modal window

Add doTask to avoid PHP notice

Source Link

edited Aug 29, 2018 at 6:52

3.2k
1
14
29

It's actually pretty simple.

In view.html.php, load modal library, if it's not already done:

JHtml::_('bootstrap.modal');

For adding button to toolbar, use:

// Toolbar object
$toolbar = JToolBar::getInstance('toolbar');
$layout = new JLayoutFile('joomla.toolbar.popup');

// Render the popup button
$dhtml = $layout->render(array('name' => 'test', 'text' => JText::_('Custom button'), 'class' => 'icon-archive', 'doTask' => ''));
$toolbar->appendButton('Custom', $dhtml);

name must match modal id after -. You can change class for different icons.

In default.php or in any file in tmpl folder add modal div, what will be shown after clicking on link

<div class="modal hide fade" id="modal-test">
  <div class="modal-header">
    <button type="button" role="presentation" class="close" data-dismiss="modal">x</button>
    <h3>Modal title</h3>
  </div>
  <div class="modal-body">
    Modal content here
  </div>
  <div class="modal-footer">
    <button class="btn" type="button" data-dismiss="modal">
      <?php echo JText::_('JCANCEL'); ?>
    </button>
  </div>
</div>

It's actually pretty simple.

In view.html.php, load modal library, if it's not already done:

JHtml::_('bootstrap.modal');

For adding button to toolbar, use:

// Toolbar object
$toolbar = JToolBar::getInstance('toolbar');
$layout = new JLayoutFile('joomla.toolbar.popup');

// Render the popup button
$dhtml = $layout->render(array('name' => 'test', 'text' => JText::_('Custom button'), 'class' => 'icon-archive'));
$toolbar->appendButton('Custom', $dhtml);

name must match modal id after -. You can change class for different icons.

In default.php or in any file in tmpl folder add modal div, what will be shown after clicking on link

<div class="modal hide fade" id="modal-test">
  <div class="modal-header">
    <button type="button" role="presentation" class="close" data-dismiss="modal">x</button>
    <h3>Modal title</h3>
  </div>
  <div class="modal-body">
    Modal content here
  </div>
  <div class="modal-footer">
    <button class="btn" type="button" data-dismiss="modal">
      <?php echo JText::_('JCANCEL'); ?>
    </button>
  </div>
</div>

It's actually pretty simple.

In view.html.php, load modal library, if it's not already done:

JHtml::_('bootstrap.modal');

For adding button to toolbar, use:

// Toolbar object
$toolbar = JToolBar::getInstance('toolbar');
$layout = new JLayoutFile('joomla.toolbar.popup');

// Render the popup button
$dhtml = $layout->render(array('name' => 'test', 'text' => JText::_('Custom button'), 'class' => 'icon-archive', 'doTask' => ''));
$toolbar->appendButton('Custom', $dhtml);

name must match modal id after -. You can change class for different icons.

In default.php or in any file in tmpl folder add modal div, what will be shown after clicking on link

<div class="modal hide fade" id="modal-test">
  <div class="modal-header">
    <button type="button" role="presentation" class="close" data-dismiss="modal">x</button>
    <h3>Modal title</h3>
  </div>
  <div class="modal-body">
    Modal content here
  </div>
  <div class="modal-footer">
    <button class="btn" type="button" data-dismiss="modal">
      <?php echo JText::_('JCANCEL'); ?>
    </button>
  </div>
</div>

for toolbar button

Source Link

edited Aug 4, 2015 at 10:25

Rene Korss

3.2k
1
14
29

It's actually pretty simple.

In view.html.php, load modal library, if it's not already done:

JHtml::_('bootstrap.modal');

In default.php or in any file in tmpl folder addFor adding button to toolbar, use:

// LinkToolbar forobject
$toolbar opening= modalJToolBar::getInstance('toolbar');
<a$layout href="#modalDivID"= datanew JLayoutFile('joomla.toolbar.popup');

// Render the popup button
$dhtml = $layout-toggle="modal">render(array('name' class="btn">Open=> modal</a>'test', 'text' => JText::_('Custom button'), 'class' => 'icon-archive'));
$toolbar->appendButton('Custom', $dhtml);

andname must match modal id after -. You can change class for different icons.

In default.php or in any file in tmpl folder add modal div, what will be shown after clicking on link

<div class="modal hide fade" id="modalDivID">id="modal-test">
  <div class="modal-header">
    <button type="button" role="presentation" class="close" data-dismiss="modal">x</button>
    <h3>Modal title</h3>
  </div>
  <div class="modal-body">
    Modal content here
  </div>
  <div class="modal-footer">
    <button class="btn" type="button" data-dismiss="modal">
      <?php echo JText::_('JCANCEL'); ?>
    </button>
  </div>
</div>

It's actually pretty simple.

In view.html.php, load modal library, if it's not already done:

JHtml::_('bootstrap.modal');

In default.php or in any file in tmpl folder add:

// Link for opening modal
<a href="#modalDivID" data-toggle="modal" class="btn">Open modal</a>

and modal div, what will be shown after clicking on link

<div class="modal hide fade" id="modalDivID">
  <div class="modal-header">
    <button type="button" role="presentation" class="close" data-dismiss="modal">x</button>
    <h3>Modal title</h3>
  </div>
  <div class="modal-body">
    Modal content here
  </div>
  <div class="modal-footer">
    <button class="btn" type="button" data-dismiss="modal">
      <?php echo JText::_('JCANCEL'); ?>
    </button>
  </div>
</div>

It's actually pretty simple.

In view.html.php, load modal library, if it's not already done:

JHtml::_('bootstrap.modal');

For adding button to toolbar, use:

// Toolbar object
$toolbar = JToolBar::getInstance('toolbar');
$layout = new JLayoutFile('joomla.toolbar.popup');

// Render the popup button
$dhtml = $layout->render(array('name' => 'test', 'text' => JText::_('Custom button'), 'class' => 'icon-archive'));
$toolbar->appendButton('Custom', $dhtml);

name must match modal id after -. You can change class for different icons.

In default.php or in any file in tmpl folder add modal div, what will be shown after clicking on link

<div class="modal hide fade" id="modal-test">
  <div class="modal-header">
    <button type="button" role="presentation" class="close" data-dismiss="modal">x</button>
    <h3>Modal title</h3>
  </div>
  <div class="modal-body">
    Modal content here
  </div>
  <div class="modal-footer">
    <button class="btn" type="button" data-dismiss="modal">
      <?php echo JText::_('JCANCEL'); ?>
    </button>
  </div>
</div>

Source Link

created Aug 4, 2015 at 8:53

Rene Korss

3.2k
1
14
29

It's actually pretty simple.

In view.html.php, load modal library, if it's not already done:

JHtml::_('bootstrap.modal');

In default.php or in any file in tmpl folder add:

// Link for opening modal
<a href="#modalDivID" data-toggle="modal" class="btn">Open modal</a>

and modal div, what will be shown after clicking on link

<div class="modal hide fade" id="modalDivID">
  <div class="modal-header">
    <button type="button" role="presentation" class="close" data-dismiss="modal">x</button>
    <h3>Modal title</h3>
  </div>
  <div class="modal-body">
    Modal content here
  </div>
  <div class="modal-footer">
    <button class="btn" type="button" data-dismiss="modal">
      <?php echo JText::_('JCANCEL'); ?>
    </button>
  </div>
</div>

Stack Exchange Network

Return to Answer