Avoiding Multiple Ajax Calls From Cguidialog

Hi,

I wrote a CGuiDialog based on this wiki http://www.yiiframework.com/wiki/72/cjuidialog-and-ajaxsubmitbutton/

In the dialog I have a dropdownlist which calls to ajax function on change event, and a submit function that execute javascript.

Here is the code:

<div>

<table class="cftable">

<tr>

<td>

&lt;?php


	&#036;cf = new commonFunctions;


	&#036;text = &quot;&quot;;


	&#036;dir =  &quot;xxx/images/&quot; . &#036;modelDir;


	&#036;list = &#036;cf-&gt;buildFilesList(&#036;dir, true); 





	if (isset(&#036;list))				


	{			


	echo CHtml::dropdownlist('_cmchoosePicDDL','',


		&#036;list,


		array('size' =&gt; 10,


		      'ajax' =&gt; array(


		      'type'=&gt;'POST',					        'url'=&gt;CController::createUrl('ImgPreview'), 


		     'data'=&gt;array('bfileNum'=&gt;'js:this.value', 'dirname' =&gt;&#036;dir),


				   'dataType'=&gt;'json',


				   'success' =&gt; 'function(data) {


				&#036;(&quot;#_cmfileImage&quot;).html(data.fileImage);}',


		)), array ('id' =&gt; '_cmchoosePicDDL'));


	} 


	else 


	{


		echo 'no files found';


	}





	?&gt;


	


	


&lt;/td&gt;


&lt;td&gt;		


	&lt;div id=&quot;_cmfileImage&quot;&gt;&lt;/div&gt;			


&lt;/td&gt;

</tr>

</table>

<div class="row buttons">

&lt;?php


echo CHtml::SubmitButton('select',


    		      array('onclick'=&gt;'var selectVal = &#036;(&quot;#_cmchoosePicDDL  option:selected&quot;).text();     

alert(selectVal); $("#carModelPic1").val(selectVal); ’ . ‘$("#carPicDialog1").dialog(“close”);’),

array('id'=&gt;'closePicDialog' )) ; ?&gt;

</div>

</div>

The problem is that the "change" event is executed multiple times.

One time at the first popup one 2 at the second 3 at the third etc….

I am working with firebug and I see that when ever I popup the dialog the script is reregister under assets/xxxxx/jquery.js/eval/seq/

But it only register the call for the dropdownlist and not the submitbutton

Here is the script (from the firefox):

/<![CDATA[/

jQuery(’#carPicDialog1’).dialog({‘title’:‘choose Picture’, ,‘autoOpen’:true,‘modal’:‘true’,‘width’:‘auto’,‘height’:‘auto’});

$(‘body’).on(‘change’,’#_cmchoosePicDDL’,function(){jQuery.ajax({‘type’:‘POST’,‘url’:’/carsforumAdmin/index.php?r=cfHpMiCarsmodel/ImgPreview’,‘data’:{‘bfileNum’:this.value,‘dirname’:’/xxxx/images/x3’},‘dataType’:‘json’,‘success’:function(data) {

$("#_cmfileImage").html(data.fileImage);

},‘cache’:false});return false;});

/]]>/

This is the code for poping up the dialog.

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


	&#036;this-&gt;renderPartial('PicDialog',


				array('modelDir'=&gt;&#036;modelDir),false,true);

Any idea?

Thanks

Hey,

I’ve had the same problem with an ajaxSubmitButton. This post helped me a lot.

More or less, it means that you have to unbind the event attached to your dropdown after having used it.

Good luck, … and post your solution :D

great thank!

it actually works.

I call undelegate function in "click" of my submit button.

echo CHtml::SubmitButton(‘select’,

    		 array('onclick'=&gt;'var selectVal = &#036;(&quot;#_cmchoosePicDDL option:selected&quot;).text();


                                       &#036;(&quot;#carModelPic'. &#036;picItem. '&quot;).val(selectVal); ' .

‘$(“body”).undelegate("#_cmchoosePicDDL" , “change”);’ .

				   '&#036;(&quot;#carPicDialog'. &#036;picItem. '&quot;).dialog(&quot;close&quot;);'),


					array('id'=&gt;'closePicDialog' )) ; ?&gt;

thanks a lot i tried to get raid of it for at least couple of days!

so do I until I’ve found the post I’ve mentionned !