I am using the yii2 auto complete widget, it is working fine, except when I update the form the field shows blank.
use yii\jui\AutoComplete;
use yii\web\JsExpression;
$data = app\models\Doctor::find()
->select(['doctor_name as value', 'doctor_name as label','id as id'])
->asArray()
->all();
and after that the auto-complete code like this
echo 'Doctor' .'<br>';
echo AutoComplete::widget([
'name' => 'Doctor',
'id' => 'ddd',
'clientOptions' => [
'source' => $data,
'autoFill'=>true,
'select' => new JsExpression("function( event, ui ) {
$('#appoinment-doctor_name').val(ui.item.id);
}")],
]);
<?= Html::activeHiddenInput($model, 'doctor_name')?>
What I am missing here? How can I get the value on update?
You have to explicitly set value:
echo AutoComplete::widget([
'name' => 'Doctor',
'id' => 'ddd',
'value' => $model->doctor_name,
...
This isn't necessary if you set model and attribute though.
Related
I Want to select value base on $_GET if exists soon.
Here is my code in view
<?php
/*if ($model->isNewRecord && !isset($model->agent_id_upper)) {
$model->agent_id_upper = 65;
} not working too*/
//$model->agent_id_upper = 65; ->not working
echo Select2::widget([
'model' => $model,
'name' => 'TbAgent[agent_id_upper]',
//'id' => 'to_id',
'initValueText' => '', // this only for ajax
'data' => $data,
'options' => [
'placeholder' => 'Choose Agent ...',
'multiple' => false,
//'selected' => 65, -> not working
//'value' => 65, -> not working
'class' => ''
],
]
);
?>
65 is ID of record, If selected then it should show username of thus ID.
But my problem is username of 65 is not selected, it only show place holder.
How I can fix this? and Please give me references.
already read this
yii2 select2 by kartik-v set default value
Yii2: Kartik Select2: Initial Value from Model Attribute
http://www.yiiframework.com/forum/index.php/topic/52278-kartik-select2-not-select-corretly/
but no luck with above.
Thanks in advance.
have you tried this? value is not inside options
<?= Select2::widget([
'model' => $model,
'name' => 'id',
'data' => $data,
'value' => 65,
'options' => [
'placeholder' => 'Choose Agent ...',
'multiple' => false,
]
]) ?>
I'm using CakePHP Form helper to create form input fields. When a user edit an item, it will pre-fill the fields with data. I use v-model on each input field to make sure data is correctly populated.
It's all good for the textboxes as data is bound correctly. But for <select> fields, v-model doesn't seem to work. I've tried using default property for the Form->input() but no help. Here's some code:
<div class="fields">
<?= $this->Form->input('email', [
'label' => __('Email'),
'type' => 'email',
'v-model' => 'emailModel',
'placeholder' => __('Required'),
'#keydown.enter.stop.prevent' => 'return false;',
'#keyup.enter.stop.prevent' => 'onSubmit()'
]); ?>
<?= $this->Form->input('status', [
'label' => __('Status'),
'type' => 'select',
'default' => '{{userStatus}}',
'options' => [
1 => 'Active',
2 => 'Inactive'
],
'#keydown.enter.stop.prevent' => 'return false;',
'#keyup.enter.stop.prevent' => 'onSubmit()'
]); ?>
</div>
The email textbox has correct data filled, but not for the status selectbox. But if I replace {{userStatus}} with, for example, 2, it will set the default option to Inactive, even though {{userStatus}} itself has value 2.
How do I go about solving this?
I am new to VueJS but I came across the same question. The VueJS documentation states:
v-model will ignore the initial value, checked or selected attributes found on any form elements. It will always treat the Vue instance data as the source of truth. You should declare the initial value on the JavaScript side, inside the data option of your component.
https://v2.vuejs.org/v2/guide/forms.html#Basic-Usage
Therefore, you need to assign your data.userStatus with your default value.
var vm = new Vue({
el: '#app',
data: {
statusModel: 2 // The default value goes here
}
});
PHP Side:
<div class="fields">
<?= $this->Form->input('email', [
'label' => __('Email'),
'type' => 'email',
'v-model' => 'emailModel',
'placeholder' => __('Required'),
'#keydown.enter.stop.prevent' => 'return false;',
'#keyup.enter.stop.prevent' => 'onSubmit()'
]); ?>
<?= $this->Form->input('status', [
'label' => __('Status'),
'type' => 'select',
'v-model' => 'statusModel',
'options' => [
1 => 'Active',
2 => 'Inactive'
],
'#keydown.enter.stop.prevent' => 'return false;',
'#keyup.enter.stop.prevent' => 'onSubmit()'
]); ?>
</div>
Hope this helps.
I am trying to use yii2 Jui autocomplete widget.
I have this code which is showing the auto-complete date correctly, but I am not able to save the data.
$data=ArrayHelper::map(State::find()->all(), 'id', 'state_name' );
$data=array_merge($data);
And then
echo 'State' .'<br>';
echo AutoComplete::widget([
'model'=>$model,
'attribute' => 'state_id',
'clientOptions' => [
'source' => $data,
],
]);
Any solution will be greatly appreciated.
Thanks.
Ok I found the solution, it goes like this:
use yii\jui\AutoComplete;
use yii\web\JsExpression;
Then:
$data = State::find()
->select(['state_name as value', 'state_name as label','id as id'])
->asArray()
->all();
Then
echo 'State' .'<br>';
echo AutoComplete::widget([
'name' => 'State',
'id' => 'ddd',
'clientOptions' => [
'source' => $data,
'autoFill'=>true,
'select' => new JsExpression("function( event, ui ) {
$('#city-state_name').val(ui.item.id);//#City-state_name is the id of hiddenInput.
}")],
]);
and Finally:
<?= Html::activeHiddenInput($model, 'state_name')?>
That is all.
Hope some one will find it useful.
Thanks.
I have a list of array called as datalist which contains the name of companies with id.when i use it with the typeahead widget,it captures the value of company with the variable coSearch(id of input).but i want to display the list of companies and when selected,it must give the vale of that id in variable .i am really messed with this problem working from three days.Please help me out.
Here is the code for my activeform which contains the widget.
<?php
$form = ActiveForm::begin([
'action' => ['search'],
'method' => 'get',
]);
$dataList=ArrayHelper::map($companies, 'id', 'name');
echo Typeahead::widget([
'model' => $companySearched,
'name'=>'coSearch',
'options' => ['placeholder' => 'Search company','id'=>'searchCompany1','class' => 'form- control','value'=>'1'],
'pluginOptions' => ['highlight'=>true],
'dataset' => [
[
'local' => $dataList,
'limit' => 10,
]
]
]);
?>
This can be solved with the help of a hidden field.I use autocomplete here
<?php
use yii\web\JsExpression;
use yii\jui\AutoComplete;
$data = Company::find()
->select(['name as value', 'name as label','c_id as id'])
->asArray()
->all();
echo AutoComplete::widget([
'name' => 'Company',
'id' => 'ddd',
'clientOptions' => [
'source' => $data,
'autoFill'=>true,
'minLength'=>'4',
'select' => new JsExpression("function( event, ui ) {
$('#model-company').val(ui.item.id);
}")],
]);
?>
<?= Html::activeHiddenInput($model, 'company')?>
Hope this help!
In Yii2 I want one of my input field to be autocomplete when user starts to type.Below is my code which uses Jui Autocomplete.
<?php
$items= ArrayHelper::map(Company::find()->all(), 'c_id', 'name');
echo AutoComplete::widget([
'model' => $model,
'attribute' => 'company',
'clientOptions' => [
'source' => $items,
],
]);?>
This is not working.When i printed my array, i got like
Array ( [1] => abc [2] => xyz [4] => pqr )
I got it working when i manually set like
$items=['abc','xyz','pqr'];
The reason may be my c_id's are not ordered?But i want to get the c_id value to be submitted!Any idea how to fix this?
This can be solved with the help of a hidden field input.Hope this will help somebody!
<?php
use yii\web\JsExpression;
$data = Company::find()
->select(['name as value', 'name as label','c_id as id'])
->asArray()
->all();
echo AutoComplete::widget([
'name' => 'Company',
'id' => 'ddd',
'clientOptions' => [
'source' => $data,
'autoFill'=>true,
'minLength'=>'4',
'select' => new JsExpression("function( event, ui ) {
$('#user-company').val(ui.item.id);
}")
],
]);
?>
<?= Html::activeHiddenInput($model, 'company')?>
Autocomplete just helps you fill the field with required value.
If you need to submit c_id look to dropdownList or Select2 plugin.
Check this http://demos.krajee.com/widget-details/select2 yii2 widget for ideas.
Here example code:
<?php
use kartik\widgets\Select2;
use app\models\Modelname;
$model = new Modelname;
$data = ['qwe1'=>'color1','key2'=>'color3']
?>
<?= Html::beginForm() ?>
<?= Select2::widget([
'model' => $model,
'attribute' => 'color',
'data' => array_merge(["" => ""], $data),
'options' => ['placeholder' => 'Select a state ...'],
'pluginOptions' => [
'allowClear' => true
],
]); ?>
<?= Html::submitButton('Submit', ['class' => 'btn btn-primary']) ?>
<?= Html::endForm() ?>
It also supports ajax loaded data: http://demos.krajee.com/widget-details/select2#ajax
I wanted to use the Jui Autocomplete so that when I click or focus on autocomplete textbox, it should display options.
I wrote following code and it seems to be working
$floorOptionsArray = ['Basement', 'Ground Floor', 'First floor', 'Second floor', 'Third floor'];
// $floorOptionsArray = array_combine($floorOptionsArray, $floorOptionsArray);
$model = new Customer();
echo $form->field($model, 'floor')
->widget(\yii\jui\AutoComplete::classname(), [
'value' => (!empty($model->floor) ? $model->floor : ''),
'clientOptions' => [
'source' => $floorOptionsArray,
'enabled' => true,
'minLength' => 0
],
'options' =>
[
'placeholder' => 'Floor',
'class' => 'form-control autocomplete-input-bg-arrow ',
'onclick' => "(function ( ) {
$( '#customer-floor' ).autocomplete( 'search', '' );
})();",
'onfocus' => "(function ( ) {
$( '#customer-floor' ).autocomplete( 'search', '' );
})();",
],
])->label(true);