I am having a problem with modal window loading on staging server. Where my modal windows load on localhost (Apache) they fail to load content on staging (LiteSpeed). What is strange is that the modal opens and shows header, but no content. I get 503 error when I inspect elements.
Staging also doesn't load favicon. I suppose the problem is somewhere in configuration, but as I am just starting with Yii2, I don't know where to look anymore.
I have created the modal functionality as follows:
modal.js in web/js/modal.js
$(function(){
$(document).on('click', '.showModalButton', function(){
if ($('#modal').data('bs.modal').isShown) {
$('#modal').find('#modalContent')
.load($(this).attr('value'));
//dynamically set the header for the modal
document.getElementById('modalHeader').innerHTML = '<button type="button" class="close" ' +
'data-dismiss="modal" aria-label="Close">' +
'<span aria-hidden="true">×</span>' +
'</button> ' +
'<h4>' + $(this).attr('title') + '</h4>';
} else {
$('#modal').modal('show')
.find('#modalContent')
.load($(this).attr('value'));
//dynamically set the header for the modal
document.getElementById('modalHeader').innerHTML = '<button type="button" class="close" ' +
'data-dismiss="modal" aria-label="Close">' +
'<span aria-hidden="true">×</span>' +
'</button> ' +
'<h4>' + $(this).attr('title') + '</h4>';
}
});
});
Layout set in views/layouts/main.php (excerpt)
</footer>
<?php
Modal::begin([
'headerOptions' => [
'id' => 'modalHeader',
],
//'footer' => 'Close',
'id' => 'modal',
'size' => 'modal-lg',
//keeps from closing modal with esc key or by clicking out of the modal.
// user must click cancel or X to close
'clientOptions' => [
'backdrop' => 'static',
'keyboard' => false
],
]);
echo "<div id='modalContent'></div>";
Modal::end();
?>
<?php $this->endBody() ?>
View for index action (excerpt)
<p>
<?= Html::a('Create FAQ',
false,
[
'class' => 'showModalButton btn btn-success',
'value' => '/index.html?r=faq/create',
'title' => 'Create FAQ',
]) ?>
</p>
When I press button modal opens,but doesn't load the form.
If I missed some important information, please ask if it can shed light to this issue.
The page loads all the assets and I get the 503 error only on staging server.
use yii\bootstrap\Modal;
in your Grid View
'panel' => [
'before' => Html::a('<i class="glyphicon glyphicon-plus">Open Modal</i>', ['#'], ['data-toggle' => 'modal', 'class' => 'btn btn-md btn-success', 'data-target' => '#showModal']),
'type' => GridView::TYPE_PRIMARY,
]
At the bottom add this
Modal::begin([
'id' => 'showModal',
'header' => '<center><h4 class="modal-title">Allocate Work </h4></center>',
'closeButton' => [
'label' => 'Close',
'class' => 'btn btn-danger btn-sm pull-right',
],
]);
echo Yii::$app->controller->renderPartial('allocation');
Modal::end();
Related
Hello I am trying to make a button that would allow me to add 2 additional fields to my form: 1 text type fields and 1 multiple choice selector (see image)
fields
I would like to be able to add these 2 fields as many times and save it in the database here is what the code of these 2 fields looks like:
<div class="zone_prestations">
<div class="form-group">
<?php
echo $this->Form->label(
'Prestation.zone',
'Zone',
'col-sm-2 control-label'
);
echo $this->Form->input('Prestation.zone',
array('div' =>
array(
'class' => 'col-sm-10'
),
'class' => 'form-control'
));
?>
</div>
<div class="form-group">
<?php
echo $this->Form->label(
'Prestation.id_contract',
'Préstation',
'col-sm-2 control-label'
);
echo $this->Form->input(
'Prestation.id_prestation',
array(
'type' => 'select',
'options' => $prestations,
'empty' => 'Selectionnez les préstations',
'div' => array('class' => 'col-sm-10'),
'class' => 'form-control search-select',
'multiple' => true,
'value' => $selected,
'id' => 'prestation_selector'
)
);
?>
</div>
</div>
Do you know how I could do this knowing that I have a multiple choice field. Thank you for your help
Update 20/02/21
<script type="text/javascript">
$(document).ready(function() {
$("select").select2({ width: '100%' });
});
$(document).ready(function () {
var maxField = 10;
var addButton = $('#add_button');
var wrapper = $('#prestation_select');
var x = 1;
var fieldHTML = '<div class="form-group">';
fieldHTML += <?php echo $this->Form->label(
'Prestation.' + x + '.zone',
'Zone',
'col-sm-2 control-label'
);
echo $this->Form->input('Prestation.' + x + '.zone',
array('div' =>
array(
'class' => 'col-sm-10'
),
'class' => 'form-control'
));
?>
fieldHTML +='</div>';
$(addButton).click(function () {
if (x < maxField) {
x++;
$(wrapper).append(fieldHTML);
}
$("select").select2({ width: '100%' });
});
$(wrapper).on('click', '.remove_button', function (e) {
e.preventDefault();
$(this).parent('div').remove();
x--;
});
});
Your code for generating fieldHTML is run once when your page loads, with the current version of x. Every time you click your add button, you'll be getting exactly that, always with "1" in it; it's not re-evaluated with the new x. Solution should be simple, just move the calculation of that HTML inside the add function.
On a separate note, don't decrement x when you click the remove button. If you start with field 1, then add 2 and 3 and 4, then remove 2, x decrementing x will mean that adding another field will give you a duplicate of 4. There's no need for them to be sequential, you just need distinct numbers in there.
I got a modal like that. Now i want to add Kartik's Popover X to the injected form.
<div class="ensemble-form-add">
<?php
$content = '<p class="text-justify">sometext</p>';
echo PopoverX::widget([
'id' => 'ownShit',
'header' => 'Usage Information',
'size' => PopoverX::SIZE_LARGE,
'placement' => PopoverX::ALIGN_BOTTOM,
'content' => $content,
'toggleButton' => ['label'=>'<span class="glyphicon glyphicon-question-sign"></span>', 'class'=>'btn btn-lg btn-link'],
]); ?>
<?php $form = ActiveForm::begin(['id' => 'add ...
...
The popover button and dialog (hidden) is rendered correctly. But hitting the button within the modal doesn't do anything. If i open up the above form alone (not in modal) the button works and displays the dialog.
Has anyone tried this before? Do i have to set id's to get this working?
Finally i got it working. I used the code from this link :
public static function renderLabelHelp($label, $help) {
return Html::tag('label', $label, [
'data-toggle'=>'popover',
'data-trigger' => 'click hover',
'data-placement' => 'auto right',
'data-html' => 'true', // allow html tags
// 'data-title'=> 'Help',
'data-content'=>$help,
'style'=>'border-bottom: 1px dashed #888; cursor:help;'
]);
}
And added the following js to make it work like a charm!
$(function(){
// this will show the popover within a modal window
$('#modal').on('shown.bs.modal', function(){
$('[data-toggle="popover"]').popover();
});
});
<?php echo form_submit(['type'=>'submit', 'class'=>'btn login-btn', 'name'=>'btnLogin', 'i class'=>'icon-long-arrow-right' , 'value'=>'Login']); ?>
How to display an icon on button in Codeigniter.I tried this but it didn't show icon on button.Where to make change so that icon will displayed on button?
$data = array(
'name' => 'button',
'id' => 'button',
'value' => 'true',
'type' => 'submit',
'class'=>'btn btn-primary btn-sm icon-cancel-circle2',
'content' => '<i class="icon-long-arrow-right"></i>'
);
echo form_button($data);
you can use this.Hope it helps.
try this
<?php echo form_submit('btnLogin', 'Login', '"class"="btn login-btn" "i class"="icon-long-arrow-right"'); ?
the first parameter is the name, second is the value of your button.
Html button is
<button class="btn" type="submit"><i class="icon-search"></i> Go</button>
I changed it into Yii as
<?php
echo CHtml::submitButton('Go', array('id' => 'btSubmit',
'class' => 'btn',
'name' => 'files'
));
?>
How can i add to button
This will work
echo CHtml::tag('button', array(
'name'=>'btnSubmit',
'type'=>'submit'
), '<i class="icon-search"></i> Go');
will generate
<button name="btnSubmit" type="submit"><i class="icon-search"></i> Go</button>
According to the yii source code the CHtml::tag method requires a third parameter to submit internal content. The CHtml::button method does not pass this through, so you can't add internal HTML.
Using the tag method directly should work however:
echo CHtml::tag('button',[
'id'=>'btsubmit','class'=>'btn','name'=>'files','type'=>'submit'
],'<i class="icon-search"></i> Go');
<?php echo CHtml::submitButton(
CHtml::tag('i', array('class' => 'icon-search')) . ' Go',
array('id' => 'btSubmit',
'class' => 'btn',
'name' => 'files')
);
?>
Use CHtml::tag('i', array('class' => 'icon-search')) . ' Go' instead of 'Go' in your code.
<?php
$data = array(
'class' => "btn btn-primary btn-lg",
'name' => 'report'
);
echo '<span class="glyphicon glyphicon-exclamation-sign"></span> ';
echo form_submit($data, 'Report');
$data = array(
'class'=>"btn btn-primary btn-lg",
'name' => "search"
);
echo anchor("",'<span class="glyphicon glyphicon-search"></span> Search',$data);
echo form_close();
?>
I want to include <span class="glyphicon glyphicon-exclamation-sign"></span> on the form_submit. This span class is an image, I cant find a way to put it inside the button.
http://puu.sh/6UbE8.jpg
The second one "echo anchor", its second parameter has a span class which is also an image followed by a word "Search". This is exactly what I want the previous "form_submit" to be looks like. http://puu.sh/6UbFt.png
Use form_button instead of form_submit, and wrap your span around label.
$data = array(
'class' => "btn btn-primary btn-lg",
'name' => 'report'
);
echo form_button($data, '<span class="glyphicon glyphicon-exclamation-sign">Report</span>');
hope it will help
$data = array(
'name' => 'report',
'id' => 'report',
'value' => 'true',
'type' => 'submit',
'class' => 'btn btn-primary btn-lg'
);
echo form_button($data);
you can check http://ellislab.com/codeigniter/user-guide/helpers/form_helper.html