CGridView 更新后 Ajax 请求不工作答案

【问题标题】：Ajax Request is Not Working After CGridView UpdateCGridView 更新后 Ajax 请求不工作
【发布时间】：2015-06-09 11:29:38
【问题描述】：

我想通过单击 CGridView CButtonColumn 视图按钮打开一个 CJuiModel，因为我的 CGridView 和 CJuiModel 如下：-

     <?php
                $dataProvider = new CArrayDataProvider($model->exhibitorLocation, array(
                    'keys' => array('productId'),
                ));


                $this->widget('zii.widgets.grid.CGridView', array(
                    'dataProvider' => $dataProvider,
                    'id' => 'exhibitor-location-grid',
                    'summaryText' => false,
                    'pager' => array(
                        'class' => 'CLinkPager',
                        'header' => false,
                    ),
                    'columns' => array(
                        array(
                            'header' => 'S No.',
                            'value' => '++$row',
                        ),
                        array(
                            'header' => 'Hall No',
                            'value' => '$data->location->hallNo',
                        ),
                        array(
                            'header' => 'Stand No',
                            'value' => '$data->standNo',
                        ),
                        array(
                            'class' => 'CButtonColumn',
                            'header' => 'Manage',
                            'template' => '{view}{delete}',
                            'buttons' => array(
                                'view' => array(
                                    'imageUrl' => $this->module->assetsUrl . "/images/info_icon.png",
                                    'options' => array('class' => 'exb-location'),
                                    'url' => 'Yii::app()->createUrl("admin/venuemap/viewExbLocation", array("exbLocId"=>$data->primaryKey))',
                                ),
                                'delete' => array(
                                    'imageUrl' => $this->module->assetsUrl . "/images/delete_icon.png",
                                    'url' => 'Yii::app()->createUrl("admin/venuemap/deleteExbLocation", array("exbLocId"=>$data->primaryKey))',
                                ),
                            ),
                            'htmlOptions' => array(
                                'style' => 'width:100px;float:center'
                            )
                        ),
                    ),
                    'rowCssClassExpression' => '($row%2 ? "visit2" : "visit1")',
                    'itemsCssClass' => 'visitor_list',
                    'htmlOptions' => array(
                    )
                ));
                ?>
                <div class="name_field">Hall No<span>*</span></div>
                <?php echo CHtml::dropDownList('hall-no', '', CHtml::listData(Venuemap::model()->findAll(), 'locationId', 'hallNo'), array('class' => 'name_input2', 'id' => 'hall-no')); ?>

                <div class="name_field">Stand No</div>
    <?php echo CHtml::textField('Stand No', '', array('class' => 'name_input', 'id' => 'stand-no')); ?> 

                <?php
                echo CHtml::ajaxLink("Add Location", Yii::app()->createUrl('admin/venuemap/addExbLocation'), array(
                    'type' => 'post',
                    'data' => array(
                        'exhibitorId' => $model->exhibitorId,
                        'standNo' => 'js: $("#stand-no").val()',
                        'locationId' => 'js: $("#hall-no").val()'
                    ),
                    'success' => 'function(html){  $.fn.yiiGridView.update("exhibitor-location-grid"); }'
                        ), array('class' => 'search_btn'));
                ?>

                 <?php
                    $this->beginWidget('zii.widgets.jui.CJuiDialog', array(
                        'id' => 'location-dialog',
                        'options' => array(
                            'title' => 'View Location',
                            'autoOpen' => false,
                            'modal' => true,
                            'width' => 'auto',
                            'height' => 'auto',
                            'resizable' => false
                        ),
                    ));
                    $this->endWidget();
                    ?>

    <?php 

    Yii::app()->clientScript->registerScript('view-location-ajax', "


    $('.exb-location').click(function(){
       url=$(this).attr('href');
       $.ajax({
       type: 'post',
       url: url,
       success: function(result){
            $('#location-dialog').html(result).dialog('open');
            $('#draggable').draggable(); 
            return false;
        }
    });
       return false;
    });


    ");
    ?>

View Button 工作正常并在单击时打开一个 CJuiModel 但是当我在 CGridView 添加一个新 Location 时。单击查看按钮时，我的 CJuiModel 未打开，页面重定向到 Url。为什么我的 jquery 在更新 CGridView 时失败。帮助..

【问题讨论】：

你必须检查发送的数据类型，如 post 或 get 可能是冲突。
type: 'post' 已经在我的 ClientScript 中提到了
让其中一个从两者中获取类型可能是这样解决冲突
更改了类型：'get' 但没有工作仍然相同的结果...
也许改变 ajax 调用使用 jquery 'on' 而不是直接事件绑定。 html元素在刷新cgridview后被销毁并重新生成，需要用jquery'on'事件引用

标签： php jquery yii

【解决方案1】：

使用 JQuery 'on' 更改 ajax 调用，而不是直接事件绑定：

这个：

...

$('.exb-location').click(function(){
...

更改为：

...

$('.exb-location').on('click', '.exb-location', function(){
...

Html 元素在 CGridview 刷新后被销毁并重新生成。 Direct JQuery 事件仅适用于 DOM 加载之前的现有元素。当它们被删除或稍后添加新元素时，direct events don't work。

【讨论】：