How to disable a submitButton after the data is submitted in Yii2? Thanks.
<div class="form-group">
<?= Html::submitButton('Summit', ['class' => 'btn btn-primary', 'name' => 'test-button']) ?>
</div>
Add beforeSubmit event in js
$(document).on('beforeSubmit', 'form', function(event) {
$(this).find('[type=submit]').attr('disabled', true).addClass('disabled');
});
Get the id of the submit button then you can add in some javascript to listen to onclick button.
$('#submit_button_selector').on('click',function() {
$(this).prop("disabled",true);
});
A simple way is using an id and a onclick event eg:
<div class="form-group">
<?= Html::submitButton('Summit', ['class' => 'btn btn-primary', 'name' => 'test-button',
'id' => 'my_button', 'onclick' => '$("#my_button").attr("disabled", "disabled");' ]) ?>
</div>
try
'id' => 'my_button', 'onclick' => '$("#my_button").attr("disabled", "disabled"); return;'
or
'id' => 'my_button', 'onclick' => '$("#my_button").attr("disabled",true); return;'
Related
I want to update query when user field search field and click on button "search", but this is not send my get parameters to update action ..
here is view:
<?php
Pjax::begin([
'enablePushState' => true, // I would like the browser to change link
'timeout' => 100000 // Timeout needed
]);
echo LinkPager::widget([
'pagination' => $pagination,
'hideOnSinglePage' => true,
'prevPageLabel' => 'Предишна',
'nextPageLabel' => 'Следваща',
'firstPageLabel' => 'Начало',
'lastPageLabel' => 'Край'
]); ?>
<?php $form = ActiveForm::begin([
'action' => ['update'],
'method' => 'get',
]); ?>
<input type="text" id="fname" class="form-control search-option-input" placeholder="търси прецификация по име, номер" name="search-query-main" value=' '>
<div class="form-group">
<?= Html::submitButton(Yii::t('app', 'Search'), ['class' => 'btn btn-primary']) ?>
<?= Html::resetButton(Yii::t('app', 'Reset'), ['class' => 'btn btn-default']) ?>
</div>
i use pjax for pager with result of all specification, because they are over 600 ... this code is in view _form and i want to send it with this search word to controller action Update, who can not work without $_GET['id']
If you want to pass ID in URL you can add it into action URL of your form:
<?php $form = ActiveForm::begin([
'action' => ['update', 'id' => $id],
'method' => 'get',
]); ?>
following code will render an image:
<?= Html::img('#web/img/accept_all_you_see-wallpaper-1680x1050.jpg', ['alt' => 'PicNotFound', 'class' => 'scale-with-grid wp-post-image', 'style' => 'width:960;height:700']); ?>
following code will render an image as a link
<?= Html::a('', Yii::getAlias('#web') . '/img/pic1.jpg', ['target' => '_blank', 'alt' => 'PicNotFound', 'class' => 'icon-search']) ?>
How to code, if I want render another Conroller method by clicking on an image?
Following code will implement my intention by bootstrap icon, not by image!
<div class="col-md-12">
<?= Html::a('<span class="glyphicon glyphicon-paperclip"></span>', ['/dateianhang/dateianhang/index'], ['title' => 'Anlagen anzeigen', 'data' => ['pjax' => '0']]); ?>
</div>
<?= Html::a(
Html::img(
'#web/img/accept_all_you_see-wallpaper-1680x1050.jpg',
['alt' => 'PicNotFound', 'class' => 'scale-with-grid wp-post-image', 'style' => 'width:960;height:700']
),
['/dateianhang/dateianhang/index'],
['title' => 'Anlagen anzeigen', 'data' => ['pjax' => '0']]
) ?>
I have 2 modals in one active form. Let's say first one is modal-ticket and second one is contract-ticket. First time, I click button to show modal-ticket, and it was fine, but when I click button to show modal-contract, it also call script modal-ticket or otherwise. why?
this is my code.
<?php $form = ActiveForm::begin(); ?>
<div id="BtnSearchTicket">
<?= Html::button('Search Ticket', [
'value' => Url::to('../ticket-timbangan/list'),
'class' => 'btn btn-primary',
'id' => 'BtnModalTicketList',
'data-toggle'=>"modal",
'data-target'=>"#modalTicketList",
]) ?>
</div>
<div id="BtnSearchContract">
<?= Html::button('Search Contract', [
'value' => Url::to('../contract/list'),
'class' => 'btn btn-primary',
'id' => 'BtnModalContractList',
'data-toggle'=>"modal",
'data-target'=>"#modalContractList",
]) ?>
</div>
<?php ActiveForm::end(); ?>
<?php
Modal::begin([
'header' => 'Ticket List',
'id' => 'modalTicketList',
'size' => 'modal-lg',
'class' => 'style=width:auto'
]);
echo "<div id='modalContentTicket'></div>";
Modal::end();
?>
<?php
Modal::begin([
'header' => 'Contract List',
'id' => 'modalContractList',
'size' => 'modal-lg',
'class' => 'style=width:auto'
]);
echo "<div id='modalContentContract'></div>";
Modal::end();
?>
<?php
$script = <<< JS
$('#BtnModalTicketList').click(function(e){
e.preventDefault();
$('#modalTicketList').modal('show')
.find('#modalContentTicket')
.load($(this).attr('value'));
return false;
});
$('#BtnModalContractList').click(function(e){
e.preventDefault();
$('#modalContractList').modal('show')
.find('#modalContentContract')
.load($(this).attr('value'));
return false;
});
JS;
$this->registerJs($script);
?>
this are the error found in console web browser
GET http://localhost/pks/web/ticket-timbangan/get-ticket?id=1 404 (Not Found)
GET http://localhost/pks/web/contract/get-contract?id=2 404 (Not Found)
please help.
Try This: using one modal on your form:
<?php $form = ActiveForm::begin(); ?>
<div id="BtnSearchTicket">
<?= Html::button('Search Ticket', [
'value' => Url::to('../ticket-timbangan/list'),
'class' => 'btn btn-primary showModal',
'id' => 'BtnModalTicketList',
'title' => 'Search Ticket',
]) ?>
</div>
<div id="BtnSearchContract">
<?= Html::button('Search Contract', [
'value' => Url::to('../contract/list'),
'class' => 'btn btn-primary showModal',
'title' => 'Search Contract',
'id' => 'BtnModalContractList',
]) ?>
</div>
<?php ActiveForm::end(); ?>
<?php
Modal::begin([
'headerOptions' => ['id' => 'modalHeader'],
'id' => 'modal',
'size' => 'modal-lg',
'closeButton' => [
'id'=>'close-button',
'class'=>'close',
'data-dismiss' =>'modal',
],
'class' => 'style=width:auto',
'clientOptions' => [
'backdrop' => false, 'keyboard' => true
]
]);
echo "<div id='modalContent'></div>";
Modal::end();
?>
<?php
$script = <<< JS
$(document).on('click', '.showModal', function(){
if ($('#modal').hasClass('in')) {
$('#modal').find('#modalContent')
.load($(this).attr('value'));
document.getElementById('modalHeader').innerHTML = '<h4>' + $(this).attr('title') + '</h4>';
} else {
$('#modal').modal('show')
.find('#modalContent')
.load($(this).attr('value'));
document.getElementById('modalHeader').innerHTML = '<h4>' + $(this).attr('title') + '</h4>';
}
});
JS;
$this->registerJs($script);
?>
From viewing your code what calls my attention is how you use the Url::to() function. Not sure why you use ../. I have fiddled with using more than one modal in a form and the code is similar to what your are doing. I suggest you try changing your Url::to() function as follows:
Url::to('/ticket-timbangan/list')
and
Url::to('/contract/list')
Another suggestion would be to try with
Yii::$app->urlManager->createUrl('/ticket-timbangan/list')
and
Yii::$app->urlManager->createUrl('/contract/list')
Let me know if this helps.
First, many thanks to kalu who has helped me 2 days to solve my problem. Two modals which contains grid need to define different classes to prevent execute previous script.
'value' => Url::to('../ticket-timbangan/list') and 'value' => Url::to('../contract/list'), both has two gridview and same select-row class. This class is root cause of the problem, because it's same class and execute both script.
Thanks Kalu, you save my day.
how to disabled textInput in ActiveForm ?
i try like this but can't
<?= $form->field($model, 'title_series')->textInput(['class' => 'form-control class-content-title_series', 'placeholder' => 'Title', 'disabled' => 'disabled'])->label(false) ?>
'disabled' => 'disabled or 'disabled' => true
both of them can't too
I don't really know yii2/ActiveForm, but I believe you need to do it this way:
<?= $form->field($model, 'title_series')->textInput(['class' => 'form-control class-content-title_series', 'placeholder' => 'Title', 'disabled' => true])->label(false) ?>
To ensure that the field values are send on submit, use
echo $form->field($model, 'name')->textInput([
'readonly' => true,
]);
This solution won in 50 different tries.
I think issue was with your label thing
<?= $form->field($model, 'title_series')->textInput(['class' => 'form-control class-content-title_series', 'placeholder' => 'Title', 'disabled' => 'true'])->label(''); ?>
This is working, keep the disabled in same array than 'value'
<?= $form->field($model, 'type')->textInput(['value' => $type,'disabled' => true]) ?>
yii2 submit button needs to be clicked two times in form
I have a problem where I need to check more than one submit buttons in the controller. It works but I need to click submit buttons two times.
In controller :
switch(\Yii::$app->request->post('submit')) {
case 'submit_1' :
//my code
break;
case 'submit_2' :
//my code
In view
<?= Html::submitButton('NEXT', ['name' => 'submit', 'value' => 'submit_2','class'=>'btn btn-primary pull-right']) ?>
<?= Html::submitButton('PREVIOUS', ['name' => 'submit', 'value' => 'submit_3','id'=>'next_summary', 'class' => 'btn btn-primary pull-right']) ?>
There is an issue with using jquery reserved words as your attribute id or attribute names.
Search for "Be careful when naming form elements such as submit buttons" at
https://github.com/yiisoft/yii2/blob/master/docs/guide/input-forms.md
Search "Additional Notes" at https://api.jquery.com/submit/
Changing your submit names will fix your click twice problem:
<?= Html::submitButton('NEXT', ['name' => 'submit_next', 'value' => 'submit_2','class'=>'btn btn-primary pull-right']) ?>
<?= Html::submitButton('PREVIOUS', ['name' => 'submit_prev', 'value' => 'submit_3','id'=>'next_summary', 'class' => 'btn btn-primary pull-right']) ?>
try to change name of button as array
<?= Html::submitButton('NEXT', ['name' => 'submit[]', 'value' => 'submit_2','class'=>'btn btn-primary pull-right']) ?>
<?= Html::submitButton('PREVIOUS', ['name' => 'submit[]', 'value' => 'submit_3','id'=>'next_summary', 'class' => 'btn btn-primary pull-right']) ?>
and in your controller :
$submittedType = \Yii::$app->request->post('submit');
switch($submittedType[0]) {
//your code
}
To avoid double click disable validate on submit:
$form = ActiveForm::begin([
'validateOnSubmit' => false,
]);