ajaxSubmitButton Issue

Hi guys, I have an ajaxSubmitButton that is supposed to send an ajax request that will be returned to a DIV on the page. When I press the button, the Ajax request is made, the controller processes it correctly and sends back the correct response, but the response is simply placed at the beginning of the return page, not in the target div.

The button code is:

<?php echo CHtml::ajaxSubmitButton(‘Search’,’’,array(‘update’=>‘mainForm’),array(‘id’=>‘lookup’)); ?>

On the page, I have:

<div id="mainForm">

</div><!----- mainForm --------->

The JQuery code that is generated:




/*<![CDATA[*/

jQuery(function($) {

$('body').on('click','#lookup',function(){jQuery.ajax({'type':'POST','url':'/listings/newListing','cache':false,'data':jQuery(this).parents("form").serialize(),'success':function(html){jQuery("mainForm").html(html)}});return false;});

});

/*]]>*/



The result is my response html, then the DOCTYPE for the existing page.

Any ideas?

try this


...'success': function(html) {$('#mainForm').html(html);},...

Interestingly enough, I already tried that, and it did not change anything.

You may have forgot the ‘#’ in the update part:




<?php echo CHtml::ajaxSubmitButton('Search','',array('update'=>'#mainForm'),array('id'=>'lookup')); ?>