Hello,
I have the following view:
$this->widget('zii.widgets.jui.CJuiTabs', array(
'tabs' => array(
'Create' => array(
'id' => 'createProduct',
'ajax' => 'adminProduct/create'
),
'Manage' => array(
'id' => 'manageProducts',
'ajax' => 'adminProduct/manage'
)
),
'htmlOptions' => array(
'id' => 'productTab'
),
'options' => array(
'collapisible' => true
),
));
adminProduct/manage:
public function actionManage(){
$model=new Product('search');
$model->unsetAttributes(); // clear any default values
if(isset($_GET['Product'])) {
$model->attributes = $_GET['Product'];
}
$this->renderPartial('/product/manage', array('model'=>$model), false, true);
}
adminProduct/create:
public function actionCreate() {
$params = array();
$model = new Product();
//$this->performAjaxValidation($model);
$params['model'] = $model;
if(isset($_POST['Product'])) {
$model->attributes = $_POST['Product'];
if($model->save()) {
$params['model'] = new Product();
$params['success'] = 'Product has successfully been added to the store!';
}
$this->renderPartial('/product/_create', $params);
}
else {
$this->renderPartial('/product/_create', $params, false, true);
}
}
When the page initially loads it works fine. However if I then click on the "Manage" tab then click on the "Create" tab, the javascript inside the view is registered again. In this case it is some javascript attached to a CHtml::ajaxSubmitButton so when I submit the form it will in-fact submit twice. How can I solve this?
I’ve tried giving the ajaxSubmitButton a different ID each time it is rendered but I also have a CGridView with custom CButtonColumns so I need a more general solution. Ideally I’d like to just clear any existing event handlers but not sure how I do this.
Thanks for any input.
Edit:
For clarity I’ve attached the two views rendered by actionCreate and actionManage.
_create:
<div class="form">
<?php $form=$this->beginWidget('CActiveForm', array(
'id'=>'product-form',
//'enableAjaxValidation'=>true,
//'enableClientValidation'=>true
)); ?>
<?php if(isset($success)): ?>
<div class="flash-success">
<?php echo '<p>'.$success.'</p>'; ?>
</div>
<?php endif; ?>
<?php echo $form->errorSummary($model); ?>
<div class="row">
<?php echo $form->labelEx($model,'name'); ?>
<?php echo $form->textField($model,'name',array('size'=>60,'maxlength'=>256)); ?>
<?php echo $form->error($model,'name'); ?>
</div>
<div class="row">
<?php echo $form->labelEx($model,'description'); ?>
<?php echo $form->textField($model,'description'); ?>
<?php echo $form->error($model,'description'); ?>
</div>
<div class="row">
<?php echo $form->labelEx($model,'price'); ?>
<?php echo $form->textField($model,'price',array('size'=>10,'maxlength'=>10)); ?>
<?php echo $form->error($model,'price'); ?>
</div>
<div class="row">
<?php echo $form->labelEx($model,'quantity'); ?>
<?php echo $form->textField($model,'quantity'); ?>
<?php echo $form->error($model,'quantity'); ?>
</div>
<div class="row">
<?php echo $form->labelEx($model,'category_id'); ?>
<?php echo $form->dropDownList($model,'category_id', Category::getCategoryOptions()); ?>
<?php echo $form->error($model,'category_id'); ?>
</div>
<div class="row buttons">
<?php
echo CHtml::ajaxSubmitButton(
'Create',
CHtml::normalizeUrl('adminProduct/create'),
array(
'beforeSend' => 'function(){
$("#ajax-response").html("<div class=\'flash-notice\'><p>Creating product..</p></div>");
}',
'success' => 'function(data){
$("#createProduct").html(data);
}',
),
array('id' => 'productCreateSubmitButton')
);
?>
</div>
<?php $this->endWidget(); ?>
</div><!-- form -->
_manage:
<?php
Yii::app()->clientScript->registerScript('search', "
$('.search-button').click(function(){
$('.search-form').toggle();
return false;
});
$('.search-form form').submit(function(){
$.fn.yiiGridView.update('product-grid', {
data: $(this).serialize()
});
return false;
});
");
?>
<h1>Manage Products</h1>
<p>
You may optionally enter a comparison operator (<b><</b>, <b><=</b>, <b>></b>, <b>>=</b>, <b><></b>
or <b>=</b>) at the beginning of each of your search values to specify how the comparison should be done.
</p>
<?php echo CHtml::link('Advanced Search','#',array('class'=>'search-button')); ?>
<div class="search-form" style="display:none">
<?php $this->renderPartial('/product/_search',array(
'model'=>$model,
)); ?>
</div><!-- search-form -->
<?php $this->widget('zii.widgets.grid.CGridView', array(
'id'=>'product-grid',
'dataProvider'=>$model->search(),
'filter'=>$model,
'columns'=>array(
'name',
'description',
'price',
'quantity',
array(
'name' => 'category_id',
'value' => '$data->category->name'
),
array(
'class'=>'CButtonColumn',
'template' => '{update}',
'buttons' => array(
'update' => array(
'url' => '$this->grid->controller->createUrl("adminProduct/update", array("id" => $data->id))',
'click' => "function() {
var url = $(this).attr('href');
$.post(url, function(response) {
$('#productDialogContent').html(response);
$('#productDialog').dialog('open');
});
return false;
}"
)
)
),
),
));?>
<?php $this->beginWidget('zii.widgets.jui.CJuiDialog', array(
'id' => 'productDialog',
'options' => array(
'autoOpen' => false,
'modal' => true,
'width' => 500,
'height' => 500
)
)); ?>
<div id="productDialogContent"></div>
<?php $this->endWidget(); ?>
), generally solved by setting scriptMap[xxx] = false