CHtml::ajaxLink refresh problem

Yii 1.1 General Discussion
1

Hi All,

In render partial, I am displaying dynamic ajaxLink’s. If i click on ajaxlink it is not working. If I refresh the page then it is working.

I have observed that by default it is loading only one link.




<script type="text/javascript">

/*<![CDATA[*/

jQuery(function($) {

jQuery('body').delegate('#yt0','click',function(){jQuery.ajax({'type':'POST','url':'/exam/index.php?r=exam/next','cache':false,'data':jQuery(this).parents("form").serialize(),'success':function(html){jQuery("#exam-grid").html(html)}});return false;});

});

/*]]>*/

</script>

When i refresh the page it is loading more than one link like




<script type="text/javascript">

/*<![CDATA[*/

jQuery(function($) {

jQuery('body').delegate('#yt0','click',function(){jQuery.ajax({'type':'POST','url':'/exam/index.php?r=exam/next','cache':false,'data':jQuery(this).parents("form").serialize(),'success':function(html){jQuery("#exam-grid").html(html)}});return false;});

jQuery('body').delegate('#yt1','click',function(){jQuery.ajax({'type':'POST','data':{'id':'718'},'url':'/exam/index.php?r=exam/review','cache':false,'success':function(html){jQuery("#exam-grid").html(html)}});return false;});

jQuery('body').delegate('#yt2','click',function(){jQuery.ajax({'type':'POST','data':{'id':'719'},'url':'/exam/index.php?r=exam/review','cache':false,'success':function(html){jQuery("#exam-grid").html(html)}});return false;});

jQuery('body').delegate('#yt3','click',function(){jQuery.ajax({'type':'POST','data':{'id':'722'},'url':'/exam/index.php?r=exam/review','cache':false,'success':function(html){jQuery("#exam-grid").html(html)}});return false;});

jQuery('body').delegate('#yt4','click',function(){jQuery.ajax({'type':'POST','data':{'id':'720'},'url':'/exam/index.php?r=exam/review','cache':false,'success':function(html){jQuery("#exam-grid").html(html)}});return false;});

jQuery('body').delegate('#yt5','click',function(){jQuery.ajax({'type':'POST','data':{'id':'721'},'url':'/exam/index.php?r=exam/review','cache':false,'success':function(html){jQuery("#exam-grid").html(html)}});return false;});

});

/*]]>*/

</script>

How to refresh the page using ajaxlink.

I have tried ‘z controller’ but it is displaying more than one link.

Thanks in advance.

Thanks & Regards,

Gangadhar

2

Any one can help me please!!

3

Can you post your code… and explain what you need to be rendered…

4

I am working on online exam. In render view, I am displaying timer. In render partial view, I am displaying questions & answers and review questions. Under review questions, I am dynamically loading completed question numbers.If I click on question number then the action goes to review.

The problem is

1.If I click on question number for the first time then the browser displays empty page.

2.If I refresh the page then I click on question number then the action is working.

My render code




<?php 

$cs=Yii::app()->clientScript;

$cs->registerScriptFile(Yii::app()->baseUrl . '/js/jquery-1.4.4.pack.js', CClientScript::POS_HEAD);

$cs->registerScriptFile(Yii::app()->baseUrl . '/js/jquery.countdown.js', CClientScript::POS_HEAD);

$cs->registerScriptFile(Yii::app()->baseUrl . '/js/countdown.js', CClientScript::POS_HEAD);

$cs->registerCssFile(Yii::app()->baseUrl . '/css/jquery.countdown.css');

?>


<div id="defaultCountdown"></div>


<?php echo $this->renderPartial('_question',array('model'=>$model,'qdata'=>$qdata)); ?>

My render partial code




<?php $form=$this->beginWidget('CActiveForm'); ?>

<div class="form" id="exam-grid">

<h3 class="question-title">Question <?php echo $model->minQN ;?> of <?php echo $model->maxQN ;?></h3>


<div class="row">

<?php echo "<h2>".$qdata['question']."</h2>";?>

</div>

<div class="row compactRadioGroup">

<?php echo  CHtml::radioButtonList('answer_id',$model->answer_id,Answers::getAnswers($qdata['id']));?>

</div>

<div>&nbsp;</div>

<div class="row" align="center">

<?php

echo CHtml::ajaxButton(

                   $model->buttonText,

                   Yii::app()->createUrl('exam/next'),

                   array(

                   'update' => '#exam-grid',

                   'type'=>'POST'),

                   array('href' => Yii::app()->createUrl('exam/next')) 

                   );

echo CHtml::Button('Exit Test',array("onclick"=>"location.href='index.php?r=exam/exit'")); 

?>

</div>


<div class="row">

<?php 

if(count($model->answeredQns) != '0')  {

echo "<b>Review Answered Questions</b>";

foreach($model->answeredQns as $row) {

echo '&nbsp;&nbsp;'.CHtml::ajaxLink(

                   $row['ordering'],

                   Yii::app()->createUrl('exam/review'),

                   array(

                   'update' => '#exam-grid',

                   'type'=>'POST',

                   'data' => array( 'id' => $row['id'])

                   ),

                   array('href' => Yii::app()->createUrl('exam/review')) 

                   );

}

}

?>

</div>

</div>

<?php 

$this->endWidget();

?>

calling render partial from controller




$this->renderPartial('_question',array('model'=>$model,'qdata'=>$qdata));
5

The view seems OK… so if you get an empty page the problem could be in the reviewAction()…

But again reading the first post… on your first render you don’t get the “review” links… if that is the case… you need to check the $model->answeredQns if it returns proper result (is that a method?)

6

By default, I am displaying timer and questions. After completing the first question then it goes to second question. In render partial, I am displaying second question & answers and first question number.

I am getting question number properly but action is working only after refreshing the page.

I have tried like passing false and true parameters in render partial. Without refreshing the page it is working.

But the problem is it is repeating question numbers. Suppose for second question it is displaying like 1,1,2,2,2,2.

How to stop repeating question numbers.




<?php echo $this->renderPartial('_question',array('model'=>$model,'qdata'=>$qdata),false,true); ?>
7

Can’t help you more than this… as I cannot reproduce this to test…

You would need to debug your code… the controller (to check if proper data is sent to the view)… and the AJAX/jQuery code with Firefox/FireBug… to see what happens on AJAX requests…

As it works after the "refresh" it means that the problem is somewhere in the AJAX … not properly rendering the links…

…

Just by typing you the above lines (leaved intentionally so that you can see the line of thinking)… I think I got the problem…

Problem is that on AJAX request the CHtml::ajaxLink() renders only the input field… but not the jQuery code… as the code would be rendered only when the whole page is rendered… and that happens on refresh…

So the easiest solution would be not to use ajax links here… but normal one that will render a complete new page…

8

Hi!

I had similar problem, when after first ajax action the page needed to be reloaded to be able to make ajax calls again.

I have solved it by setting up a unique ids for every ajaxLink and ajaxButton if any.

Try to set up in each ajaxLink HtmlOptions something like array(‘id’=>‘link_id_0’) , array(‘id’=>‘link_id_1’) etc.

Also pay attention to ‘success’:function(html){jQuery("#exam-grid").html(html)}} part.

In some cases better to use ‘success’:function(html){jQuery("#exam-grid").replaceWith(html)}}

The difference is that in the first case you could get ‘exam-grid’ id doubled on the page. The replaceWith do not give such result.

See the ‘update’ and ‘replace’ Yii methods.

Cheers.