Hello Experts,
I was checking one simple JS in my system. I found strange behavior of the Submit Button. My codes are as below:
Controller:
class IncremController extends Controller
{
public function actionIncre(){
return $this->render('Incre');
}
}
View Code:
div class="site-incrementtest">
<h1><?= Html::encode($this->title) ?></h1>
<p>Test Increment</p>
<script>
var i = 1;
function tesFunction() {
++i;
document.getElementById('test').innerHTML=i;
}
</script>
<button onclick="tesFunction();">Click Me</button> <!-- Button1 -->
</div>
<div class="row">
<?php $form = ActiveForm::begin([
'id' => 'form-Increment',
'options' => ['class' => 'form-horizontal'],
])?>
<div class="container-fluid" align="center">
<div class="col-xs-2">
<?= Html::submitButton('Inside Form', ['class' => 'btn btn-success', 'onclick'=>"tesFunction()"]) ?> <!-- Button2 -->
</div>
<div id="test" style="display:inline">1</div>
</div>
<div class="container-fluid" align="center">
<div class="form-group">
<?php ActiveForm::end(); ?>
</div>
</div>
</div>
<div class="row">
<?= Html::submitButton('Outside Form Button', ['class' => 'btn btn-success', 'onclick'=>'tesFunction();']) ?> <!-- Button3 -->
</div>
Issue:
1st Button (Regular PHP Button Syntax): working fine and increment the value as expected.
2nd Button (Yii2 submit button inside the ActiveForm) : On button click, increment by 1 and instantly it returns to the initialized Value.
3rd Button: Yii2 submit button outside the ActiveForm): working fine and increment the value as expected.
Can you please guide me, why 2nd Button could not hold the incremented value?
Any idea?
Thanks in advance.
Regards,
Sid