Hola, luego de mucho intentarlo, me decido a consultarles un problema que tengo con la utilización de ExpandRowColumn utilizando la extensión de Kartik. Espero ser claro en la explicación porque es algo larga.
Tratando de resumir el problema les comento que tengo 2 tablas relacionadas. Proyectos y Movimientos. Lo que hago es en el index de proyecto, en el Dynagrid tener una columna ExpandRowColumn que al hacer click me renderiza el index de la tabla movimientos. Hasta aquí funciona todo bien, le problema es que deseo que el create, el edit y el view de la tabla movimientos se hagan con ajax.
Por separado lo logro hacer utilizando la extensión johnitvn\ajaxcrud, pero no logro hacerlo funcionar dentro de la expandrowcolumn … lo que obtengo es el formulario renderizado sin ajax pero preparado para ajax, me aparecen muchos \n\n y con el diseño erroneo, es decir, el formulario está preparado para el ajax por ejemplo al presionar en CREATE, pero no se renderiza en una pantalla ejax.
Les adjunto una imagen de lo obtenido y el codigo para ver si pueden ayudarme
Les adjunto el código del create de movimientos
public function actionCreate($submit = false)
{
$model = new Movimientos();
if (isset($_GET['idProyecto'])){
$model->idProyecto = $_GET['idProyecto'];
}
$userId = \Yii::$app->user->identity->id;
$usuario = \Yii::$app->user->identity->username;
$model->usuario = $userId;
$model->nombreUsuario = $usuario;
if (Yii::$app->request->isAjax && $model->load(Yii::$app->request->post()) && $submit == false) {
Yii::$app->response->format = Response::FORMAT_JSON;
return ActiveForm::validate($model);
}
if ($model->load(Yii::$app->request->post())) {
if ($model->save()) {
$model->refresh();
Yii::$app->response->format = Response::FORMAT_JSON;
return [
'message' => '¡Éxito!',
];
} else {
Yii::$app->response->format = Response::FORMAT_JSON;
return ActiveForm::validate($model);
}
}
return $this->renderAjax('create', [
'model' => $model,
]);
}
A continuación les pongo el código del expand Row Column aunque funciona bien esa parte
public function actionDetail() {
if (isset($_POST['expandRowKey'])) {
$model = \app\models\Movimientos::findOne(['idProyecto' => $_POST['expandRowKey']]);
$searchModel = new MovimientosSearch();
$searchModel->idProyecto = $_POST['expandRowKey'];
$dataProvider = $searchModel->search(Yii::$app->request->queryParams);
$id = $_POST['expandRowKey'];
return $this->renderPartial('_movimientos', [
'model'=>$model,
'searchModel' => $searchModel,
'dataProvider' => $dataProvider,
'id' => $id,
]);
}
}
En el index de Movimientos que es el que renderizo en el expand tengo lo siguiente
<?php
use yii\helpers\Url;
use yii\helpers\Html;
use yii\bootstrap\Modal;
use kartik\grid\GridView;
use johnitvn\ajaxcrud\CrudAsset;
use johnitvn\ajaxcrud\BulkButtonWidget;
/* @var $this yii\web\View */
/* @var $searchModel app\models\MovimientosSearch */
/* @var $dataProvider yii\data\ActiveDataProvider */
$this->title = 'Movimientos';
$this->params['breadcrumbs'][] = $this->title;
CrudAsset::register($this);
?>
<div class="movimientos-index">
<div id="ajaxCrudDatatable">
<?=GridView::widget([
'id'=>'crud-datatable',
'dataProvider' => $dataProvider,
'filterModel' => $searchModel,
'pjax'=>true,
'columns' => require(__DIR__.'/_columns.php'),
'toolbar'=> [
['content'=>
Html::a('<i class="glyphicon glyphicon-plus"></i>', ['create'],
['role'=>'modal-remote','title'=> 'Nuevo Movimiento','class'=>'btn btn-default']).
Html::a('<i class="glyphicon glyphicon-repeat"></i>', [''],
['data-pjax'=>1, 'class'=>'btn btn-default', 'title'=>'Resetear Grid']).
'{toggleData}'.
'{export}'
],
],
'striped' => true,
'condensed' => true,
'responsive' => true,
'panel' => [
'type' => 'primary',
'heading' => '<i class="glyphicon glyphicon-list"></i> Listado de Movimientos',
'before'=>'<em></em>',
'after'=>BulkButtonWidget::widget([
'buttons'=>Html::a('<i class="glyphicon glyphicon-trash"></i> Borrar todo',
["bulk-delete"] ,
[
"class"=>"btn btn-danger btn-xs",
'role'=>'modal-remote-bulk',
'data-confirm'=>false, 'data-method'=>false,// for overide yii data api
'data-request-method'=>'post',
'data-confirm-title'=>'Está seguro?',
'data-confirm-message'=>'Está seguro que desea borrar este items'
]),
]).
'<div class="clearfix"></div>',
]
])?>
</div>
</div>
<?php Modal::begin([
"id"=>"ajaxCrudModal",
"footer"=>"",
])?>
<?php Modal::end(); ?>
Y también les pado el _form de movimientos
<?php
use yii\helpers\Html;
use yii\widgets\ActiveForm;
use yii\helpers\ArrayHelper;
use app\models\Proyecto;
use kartik\date\DatePicker;
/* @var $this yii\web\View */
/* @var $model app\models\Movimientos */
/* @var $form yii\widgets\ActiveForm */
?>
<div class="movimientos-form">
<?php // $form = ActiveForm::begin(); ?>
<?php $form = ActiveForm::begin([
'id' => 'movimiento-form',
'enableAjaxValidation' => true,
'enableClientScript' => true,
'enableClientValidation' => true,
]); ?>
<?php
echo $form->field($model, 'fecha')->widget(DatePicker::classname(), [
'options' => ['placeholder' => ''],
'pluginOptions' => [
'id' => 'fecha',
'autoclose'=>true,
'format' =>'dd/mm/yyyy',
//'startView' => 'year',
]
]);
?>
<?= $form->field($model, 'idProyecto')->dropDownList(ArrayHelper::map(Proyecto::find()->orderBy('nombre')->asArray()->all(), 'id', 'nombre'), ['prompt'=> 'Seleccione Proyecto']) ?>
<?= $form->field($model, 'detalle')->textarea(['rows' => 6]) ?>
<?php // $form->field($model, 'usuario')->textInput(['visible' => false]) ?>
<?php // $form->field($model, 'nombreUsuario')->textInput(['disabled' => !\Yii::$app->user->can('administrador')]) ?>
<?php // $form->field($model, 'campo')->textInput(['visible' => false]) ?>
<?php // $form->field($model, 'valorAnterior')->textInput(['visible' => false]) ?>
<?php // $form->field($model, 'valorActual')->textInput(['visible' => false]) ?>
<div class="form-group">
<?= Html::submitButton($model->isNewRecord ? 'Crear' : 'Actualizar', ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
</div>
<?php ActiveForm::end(); ?>
<?php
$this->registerJs('
// obtener la id del formulario y establecer el manejador de eventos
$("form#movimientos-form").on("beforeSubmit", function(e) {
var form = $(this);
$.post(
form.attr("action")+"&submit=true",
form.serialize()
)
.done(function(result) {
form.parent().html(result.message);
$.pjax.reload({container:"#solicitante-grid"});
});
return false;
}).on("submit", function(e){
e.preventDefault();
e.stopImmediatePropagation();
return false;
});
');
?>
</div>
Les agradecería cualquier ayuda
Saludos y disculpen lo extenso del mensaje