Agregar Campo Cjuidatepicker Atravez De Una Inserccion Html Con Ajax

International Spanish
1

Estimados:

Le cuento, lo que sucede que tengo el siguiente problema, tengo esta accion en el controlador que me agrega html atravez de ajax, EL PROBLEMA es que al agregar el campo con CJuiDatePicker me da error, nose cual sea la mejor forma de pordar hacerlo, si alquien tiene alguna idea de como tiene que ser ojala me pueda ayudar.

Accion Controlador




    public function actionAjaxFormadePago() {


        $count = Yii::app()->session['contador_pagos'];


       

               

        $respuesta2->row = '<tr>' .

                '<td><select id="mymenu" onChange="agregar_cheques()" name="formapago[' . $count . '][tipo]" >

                    <option value="1">Bono</option>

                    <option value="2">Efectivo</option>

                    <option value="3">Cheque</option>

                </select></td>' .

                '<td><input type="text" name="formapago[' . $count . '][numeroFP]"></td>' .

                 widget('zii.widgets.jui.CJuiDatePicker',array(

                                 'name'=>'fechaFP',    

                                 'value'=>date('d-m-Y'),

                                 'language' => 'es',

                                 'options'=>array(        

                                     'showButtonPanel'=>true,

                                      'dateFormat' => 'yy-mm-dd',

                                     ),

                                     'htmlOptions'=>array(

                                         'style'=>''

                                     ),

                ));

                '<td><input class="montoFormaPago" type="number" name="formapago[' . $count . '][montoFP]" onkeypress="valida_solo_numeros()" onkeyup="sumar(this)" onblur="sumar(this)" value="0"></td>' .

                '<td><input onclick="eliminar(this)" name="yt2" type="button" value="-"/></td>' .

                '</tr>';               

            


                

        Yii::app()->session['contador_pagos'] += 1;


        echo CJSON::encode($respuesta2);

        Yii::app()->end();

    }

En la Vista tengo lo siguiente:




Yii::app()->clientScript->registerScript('forma-pago', '$("#forma-pago").bind("click",function(){  

        var asiento_id = $.fn.yiiGridView.getSelection(\'asiento-grid\');


        if(asiento_id != ""){

        $.ajax({

            type: \'POST\',             

            url:\'' . Yii::app()->createUrl('/asiento/AjaxFormadePago') . '\',

            data:{},

            success: function(data) {

                data = JSON.parse(data);

                console.log(data)

                var objTabla=$(\'#formadepago\');

                $(objTabla).find(\'tbody\').append(data.row);

            }

      });

    }else{

      alert( \'Seleccione alguna DEUDA la cual desee pagar !!\' );

    }

         

    });'

);


<table align="center" width="450" id="formadepago">

                <thead>

                  <tr>

                    <th>Forma</th>

                    <th>N&uacute;mero</th>

                    <th>Fecha</th>

                    <th>Monto $</th>

                    <th width="22">&nbsp;</th>

                  </tr>

                </thead>

                <tbody>  

                </tbody>

</table>

SALUDOS…

2

Tambien probe asiendolo asi en en contolador




   public function actionAjaxFormadePago() {


        $count = Yii::app()->session['contador_pagos'];

       

        $respuesta2->row = '<tr>' .

                '<td><select id="mymenu" onChange="agregar_cheques()" name="formapago[' . $count . '][tipo]" >

                    <option value="1">Bono</option>

                    <option value="2">Efectivo</option>

                    <option value="3">Cheque</option>

                </select></td>' .

                "<td><input type='text' name='formapago[' . $count . '][numeroFP]'></td>" .

                "<td> $this->widget('zii.widgets.jui.CJuiDatePicker',array(

                                 'name'=>'formapago[' . $count . '][fechaFP]',    

                                 'value'=>date('d-m-Y'),

                                 'language' => 'es',

                                 'options'=>array(        

                                     'showButtonPanel'=>true,

                                      'dateFormat' => 'yy-mm-dd',

                                     ),

                                     'htmlOptions'=>array(

                                         'style'=>''

                                     ),

                ))</td>".

                '<td><input class="montoFormaPago" type="number" name="formapago[' . $count . '][montoFP]" onkeypress="valida_solo_numeros()" onkeyup="sumar(this)" onblur="sumar(this)" value="0"></td>' .

                '<td><input onclick="eliminar(this)" name="yt2" type="button" value="-"/></td>' .

                '</tr>';               

            


                

        Yii::app()->session['contador_pagos'] += 1;


        echo CJSON::encode($respuesta2);

        Yii::app()->end();

    }

PERO ME DA ERROR EL SIGUIENTE ERROR:

CException

La propiedad "AsientoController"."widget" no se encuentra definida. (/Users/Administrador/Sites/efficach/yii/framework/base/CComponent.php:130)

Ojala alguien me pueda orientar en el tema.

Gracias de antemano

Saludos…

3

En el primer mensaje, efectivamente te faltaba agregar $this antes de widget. Además, el datapicker no estaba dentro de <td></td>.

En tu segundo mensaje, yo sacaría el $this->wigdet de la cadena (de hecho en mi opinión no te debería funcionar).

Vamos, que lo haría como tienes en el primer mensaje pero añadiéndole el $this y los <td></td>.

Pero yo no lo haría de ninguna de las 2 formas.

Escribiría el código del datapicker directamente en el formulario pero con display:none para la fila <tr>, y mediante AJAX cambiaría los valores necesarios y lo mostraría o ocultaría dependiendo de la opción seleccionada.

Tu controlador Asiento extiende de Controller o CController?

Un saludo.

4

HOla:

Gracias contestar, extiende de Controller. Me podrias dar una idea de como hacerlo porfavor que estoy un poco perdido en ese tema.

saludos…

5

La primera opcion deberia funcionar, solo que te faltaria agregar el tercer parametro (true) a tu widget para que lo tome como cadena, si no, lo que intenta el widget es crearse y por lo tanto te muestra una excepcion.




"<td>" . 

    $this->widget('zii.widgets.jui.CJuiDatePicker',

                  array(

                      'name'=>'formapago[' . $count . '][fechaFP]',    

                      'value'=>date('d-m-Y'),

                      'language' => 'es',

                      'options'=>array(        

                          'showButtonPanel'=>true,

                          'dateFormat' => 'yy-mm-dd',

                      ),

                      'htmlOptions'=>array(

                          'style'=>''

                       ),

                   ), TRUE) . 

"</td>"

Saludos,

:D

6

Daniel, gracias tambien por contestar :D .

Tenias razon, el codigo funciona de la forma que dijiste , me agrega el campo de fecha. Pero al hacer click sobre el no me abre el calendar, solo me muestra e imput con la fecha actual, pero no entiendo porque no muestra el calendar al hacer click sobre el imput de fecha que agrega.

Ojala me puedas ayudar

Saludos…

7

mmmm, creo que nos falta invocar los JS del DatePicker

Agrega las siguientes lineas al inicio de tu metodo ajax (actionAjaxFormadePago)




    Yii::app()->clientScript->registerCoreScript('jquery');

    Yii::app()->clientScript->registerCoreScript('jquery.ui');

Aun si funciona podrias tener problemas o conflictos con JS, creo que la mejor manera de solucionar tu problema seria cambiando un poco tu codigo.

  1. Crear una vista _datePicker.php donde este el codigo de tu CJuiDatePicker

  2. Obtener el resultado final de tu vista-datepicker via renderPartial, al cual le puedes enviar los datos que necesita tu datepicker ($count)

$resultado_vista = $this->renderPartial(’_datePicker’, array(‘datos_para_tu_datepicker’=>$datos, true, true);

  1. Seguir el mismo flujo que tienes

    echo CJSON::encode($resultado_vista);

    Yii::app()->end();

Con esto evitas recargar los JS que DatePicker necesita para funcionar y le dejas ese trabajo al Widget.

B)

8

Solamente tienes que llamar a la libreria, pero la json devuelto por actionAjaxFormadePago debe tener el name del input.

Y en la vista


Yii::app()->clientScript->registerScript('forma-pago', '$("#forma-pago").bind("click",function(){  

        var asiento_id = $.fn.yiiGridView.getSelection(\'asiento-grid\');


        if(asiento_id != ""){

        $.ajax({

            type: \'POST\',             

            url:\'' . Yii::app()->createUrl('/asiento/AjaxFormadePago') . '\',

            data:{},

            success: function(data) {

                data = JSON.parse(data);

                console.log(data)

                var objTabla=$(\'#formadepago\');

                $(objTabla).find(\'tbody\').append(data.row);

                $( "input[name='"+data.name+"']" ).datepicker();//<--data.name debe ser nombre del input

            }

      });

    }else{

      alert( \'Seleccione alguna DEUDA la cual desee pagar !!\' );

    }

         

    });'

);
9

a18327:

Me da un error en esta la linea que me dijiste




 $( "input[name='"+data.name+"']" ).datepicker();//<--data.name debe ser nombre del input

No se si le faltara algun caracter o algo esta mal definido, la cosa es que la probe con el name de mi imut y nada.

A todo esto no puede ser mejor el id en ves de name ???

Esperando tu respuesta

SALUDOS

10

Si de hecho es mejor el id del input, sobre el error es porque no se esta escapando las comillas simples :D pero si usas el id ya no es necesario. Usando el id del inputs seria


$( "#"+data.idInput).datepicker();

solo recuerda mandar la variable idInput desde el action.

11

Estimados:

Gracias a todos por ayudarme, ya solucione mi problema:

en la accion




    public function actionAjaxFormadePago() {


        Yii::app()->clientScript->scriptMap['jquery.js'] = false;

        Yii::app()->clientScript->scriptMap['jquery-min.js'] = false;

        Yii::app()->clientScript->scriptMap['jquery-ui-i18n.min.js'] = false;

        Yii::app()->clientScript->scriptMap['jquery-ui.min.js'] = false;


        $count = Yii::app()->session['contador_pagos'];


        $respuesta2->row = '<tr>' .

                '<td><select id="mymenu" onChange="agregar_cheques()" name="formapago[' . $count . '][tipo]" >

                    <option value="1">Bono</option>

                    <option value="2">Efectivo</option>

                    <option value="3">Cheque</option>

                </select></td>' .

                "<td><input type='text' name='formapago[' . $count . '][numeroFP]'></td>" .

                "<td>" .

                $this->renderPartial('_datePicker', array('count' => $count), true, true) .

                "</td>" .

                '<td><input class="montoFormaPago" type="number" name="formapago[' . $count . '][montoFP]" onkeypress="valida_solo_numeros()" onkeyup="sumar(this)" onblur="sumar(this)" value="0"></td>' .

                '<td><input onclick="eliminar(this)" name="yt2" type="button" value="-"/></td>' .

                '</tr>';


        Yii::app()->session['contador_pagos'] += 1;

        echo CJSON::encode($respuesta2);

        Yii::app()->end();

    }

en la Vista Datepicker




   <?php

     $fecha = Yii::app()->getRequest()->getPost('fecha');


        $this->widget('zii.widgets.jui.CJuiDatePicker', array(

            'name' => 'formapago[' . $count . '][fechaFP]',

             'value'=>date('d-m-Y'),

            'language' => 'es',

            'htmlOptions' => array('readonly' => "readonly", 'width' => "150"),

            'options' => array(

                    'dateFormat' => 'yy-mm-dd',

                    'buttonImage' => Yii::app()->baseUrl . '/images/calendar.png',

                    'buttonImageOnly' => true,

                    'buttonText' => 'Fecha',

                    'selectOtherMonths' => true,

                    'showAnim' => 'slide',

                    'showButtonPanel' => true,

                    'showOn' => 'button',

                    'showOtherMonths' => true,

                    'changeMonth' => 'true',

                    'changeYear' => 'true',

            ),

        ));

    ?>

Como pudieron notar con estas lineas solucione el problema ya que tenia drmas con los JQuery




        Yii::app()->clientScript->scriptMap['jquery.js'] = false;

        Yii::app()->clientScript->scriptMap['jquery-min.js'] = false;

        Yii::app()->clientScript->scriptMap['jquery-ui-i18n.min.js'] = false;

        Yii::app()->clientScript->scriptMap['jquery-ui.min.js'] = false;
12

Excelente!!!, buen trabajo.