yii2 - How to set kartik select2 value in javascript - javascript

I try to set value to kartik select2 in javascript action but still no luck.
here is my code in view files:
<div class="col-xs-6">
<?= $form->field($model, 'item_id')->widget(kartik\select2\Select2::className(), [
'data' => \yii\helpers\ArrayHelper::map(\app\models\ItemProduction::find()->all(), 'id', 'name'),
'options' => ['placeholder' => 'Select item'],
'pluginOptions' => [
'allowClear' => true,
],
]) ?>
</div>
and my javascript code like this
$(document).on('click', '.select-row', function(){
// get id from custom button
var id = $(this).attr('data-id');
$.get('../ticket-timbangan/get-ticket', {id : id}, function(data){
var data = $.parseJSON(data);
alert(data.item_id);
$('#pengirimanproduksi-ticket_id').val(data.id);
$('#select2-pengirimanproduksi-item_id-container').val(data.item_id).trigger('change');
$('#pengirimanproduksi-bruto_tbg').val(data.bruto);
$('#pengirimanproduksi-tara_tbg').val(data.tara);
$('#pengirimanproduksi-remark').val(data.remark);
});
$('#modalTicketList').modal('hide');
});
this is I inspect kartik select2 element
<span class="select2-selection__rendered" id="select2-pengirimanproduksi-item_id-container"><span class="select2-selection__placeholder">Select item</span></span>
I try this code $('#select2-pengirimanproduksi-item_id-container').val(data.item_id).trigger('change'); but it changes nothing.
Please advice. thanks.

first id for select2 is wrong.
$('#select2-pengirimanproduksi-item_id-container')
don't confuse with this and use regular one according to your view name, like mine is $('#pengirimanproduksi-item_id').val(your_value).trigger('change') should work.
just reading select2 documentation.

you can give your own id:
'options' => ['placeholder' => 'Select item','id' => 'your_id'],

Related

Set a twig value with JS

I've seen many topics about questions like mine, but I can't get any solutions.
I'm using Symfony, and I have a twig template which displays a form.
Imagine that I have this line :
{{ form_row(demandeForm.distinction) }}
Thanks to this :
->add('distinction',null, [
'label_attr' => array('id' => "distinct_form"),
'required' => false,
'label' => 'distinction'
])
I also have a submit button. My wish is to modify the value of my row "distinction" when the button is clicked (id of the submit button : formDepot).
Here is my code :
$(document).ready(function(){
$('#formDepot').click(function(){
$('#distinct_form').value('555');
});
});
When I retrieve my datas on submit, I don't have any value in my "distinction".
Any ideas ?
Thanks
This is because you're applying the changes on the label value, not on the input itself.
'label_attr' => array('id' => "distinct_form") and in js : $('#distinct_form').val('555');
Change the form builder to this :
->add('distinction',
null,
[
'attr' => array('id' => "distinct_form"),
'required' => false,
'label' => 'distinction'
])
With attr for the field (not the label), you can try
$('#distinct_form').val('555'); not .value();
You are assigning a value, instead of getting the value, try this .....
$(document).ready(function(){
$('#formDepot').click(function(){
$('#distinct_form').val();
});

yii2 datepicker disable dates using javascript

I rewrited my question:
I'm using Kartick DatePicker to display a datepicker. On this datepicker, I want to disable dates using javascript. Here is what I have:
<?= DatePicker::widget([
'name' => 'mydate',
'language' => 'fr',
'clientOptions' => [
'autoclose' => true,
'format' => 'dd-M-yyyy'
]
]);?>
With the JS:
$(function(){
$("#w0").datepicker("setDatesDisabled", ['25-08-2017']);
});
I tried to change the format of the date to 2017/08/25 or 08/25/2017 but in any case nothing is displayed into the logs.
I also tried to use kvDatepicker() instead of datepicker() but this gave me
Uncaught TypeError: $(...).kvDatepicker is not a function
Any clue on what is wrong here? Thank's.
Your date is in the wrong format. It should be specified as:
$("#w0").datepicker("setDatesDisabled", ['08/25/2017']);
Of course make sure that w0 is the correct ID for the input element... it might also be that your selector doesn't match the input.
I've verified on the demo page that entering this in the browser's console correctly disables Aug 28:
$('#sandbox-container input').datepicker("setDatesDisabled", ['08/28/2017']);
If you are using Yii2 Specifically than this may help you
echo '<label id = "for-trigger">Date</label>';
echo DatePicker::widget([
'type' => DatePicker::TYPE_INPUT,
'id' => 'anyUniqueID',
'name' => 'date',
'value' => '2020-04-11',
'options' => ['placeholder' => 'Selectdate ...'],
'pluginOptions' => [
'format' => 'yyyy-M-dd',
'daysOfWeekHighlighted' => '2,3',
'todayHighlight' => true,
'datesDisabled' => ['2020-04-06', '2020-04-21']
],
'pluginEvents' => [
'changeDate' => "function(e) {
//something you want to do may be
}"
]
]);

Yii2: Get values to update form in modal window

I am using Yii2 modal to update a form in modal window but I am unable to fetch the values to be already filled in the form.
In this screen-shot link below:
http://awesomescreenshot.com/0f957qq367
When I click on edit option, It takes me to the update form which is opened in a modal window. But this form shows empty values in all fields. I want to update the form.
Please find this in this screen-shot below:
http://awesomescreenshot.com/0f257qqscb
This is the snippet for what I have tried yet:
<?php
use yii\bootstrap\Nav;
use yii\bootstrap\Modal;
Modal::begin([
'id'=>'modalEdit',
//'header' => '<h2>Hello world</h2>',
'size'=> 'modal-lg',
//'toggleButton' => ['label' => 'click me'],
]);
$newmodel = new Backlog();
// $newmodel->id;
echo $this->render('/backlog/update', ['model' => $newmodel]);
Modal::end();
echo Nav::widget([
'options' => ['class' => 'nav-pills navbar-right'],
'encodeLabels' => false,
'items' => [
['label' => '', 'items' => [
['label' => '<span data-toggle="modal" data-target="#modalEdit" style="cursor: pointer;">Edit</span>','url' => 'javascript:void(0);'],
'<li class="divider"></li>',
['label' => '<span>Assign</span>', 'url' => ['#']],
'<li class="divider"></li>',
['label' => '<span>Convert To Backlog</span>', 'url' => ['#']],
'<li class="divider"></li>',
['label' => '<span>Close</span>', 'url' => ['#']],
]],
],
]);
if Backlog is an ActiveRecord Replace the Line with this.
$newmodel = Backlog::findOne(['ID'=>$id]);
Finally, I solved the problem using javascript and ajax loading :
$(document).on("click",".edit-backlog",function(e){
var back_l_id=$(this).attr("b-id");
var modal_body=$("#modalEdit").find(".modal-body");
$.ajax({
url:getAjaxUrl('backlog','update'),
data:{'id':back_l_id},
success:function(res){
//console.log(res);
modal_body.html(res);
}
});
});
I added a class .edit-backlog to span and get the id ("b-id") and used in the above script. Hope this answer helps others too.

yii2 customize a bootbox modal instead of alert on data-confirm

For example here I want to change alert for a bootbox.alert(...
'delete' => function ($url, $model, $key) {
return Html::a('<span class="glyphicon glyphicon-trash"></span>', $url, [
'title' => Yii::t('yii', 'Delete'),
'class'=>'btn btn-primary',
'data-confirm' => Yii::t('yii', 'Are you sure you want to delete this item?'),
'data-method' => 'post',
'data-pjax' => '0',
]);
},
Just add a HTML class to the element, drop the "data-confirm" param and use a "click" event.
That way you can execute whatever you want when the link is clicked.
'delete' => function ($url, $model, $key) {
return Html::a('<span class="glyphicon glyphicon-trash"></span>', $url, [
'title' => Yii::t('yii', 'Delete'),
'class'=>'btn btn-primary delete-button',
'data-id' => $model->id, // For using when the button is clicked
]);
},
And inside your javascript file:
$(".delete-button").on("click",function(e){
e.preventDefault();
var modelId = $(this).data('id');
// Run bootbox.alert() here!!
// Based on the bootbox result, you can decide to fire the initial event again:
// $(this).unbind('submit').submit()
});
Hope it helps :)
Just assign a class name or id : "id"=>"btn-id"
Then override click event :
$("#btn-id").on("click",function(e){
e.preventDefault();
//Somethings and return here
}));
Link Overriding yii.js confirm --> bootbox.confirm.
Yii 2.0: Escape from Default's Yii2 Delete Confirm Box :

Get value of selectbox with JsHelper in CakePHP

I have a select box, and I want to use it to Ajax-update some other content on the page. So I have bound an event handler using the JsHelper (jQuery) like so:
<?php
echo $this->Form->select('car', $cars);
$this->Js->get("#car");
$this->Js->event('change', $this->Js->request(array(
'controller' => 'cars',
'action' => 'view',
???,
array('async' => true, 'update' => '#car-view', 'evalScripts' => true),
true
));
?>
But how can I get the value of the select box to send as an argument to the cars controller (at "???" in the code above)?
I could do everything in javascript, but is there any way to do this in cake?
To be honest, I struggled with this a while back. I couldn't find anything that worked, so I ended up just going the straight javascript route.
I think you are looking for this:
$this->Js->get('#selectbboxid1')->event('change',
$this->Js->request(array(
'action' => 'function'), array(
/*'before' => 'showLoader();',
'success' => 'hideLoader();',*/
'update' => '#selectboxid2',
'dataExpression'=>TRUE,
'method'=>'POST',
'async'=>TRUE,
'data' => $js->serializeForm(array('isForm' => TRUE, 'inline' => TRUE)) )));

Categories