You have that, when a product is on development they can change its API anytime. This change is quite important though, its related on how to set the events of your form, for example, the useful beforeSubmit.
Before, we could do that easily on an 'ActiveForm's property but now we have to do some extra work and register the javascript event your self.
Now, lets imagine we wish to deal with a 'beforeSubmit' event on our form:
<?php $form = ActiveForm::begin(
[
// make sure you set the id of the form
'id' => $model->formName(),
'action' => ['yada/create']
]
);?>
<!-- more stuff here -->
<?php ActiveForm::end();?>
In order to register your beforeSubmit event, we will have to register the event this way:
<?php
$js = <<<JS
// get the form id and set the event
$('form#{$model->formName()}').on('beforeSubmit', function(e) {
var \$form = $(this);
// do whatever here, see the parameter \$form?
// is a jQuery Element to your form
}).on('submit', function(e){
e.preventDefault();
});
JS;
$this->registerJs($js);
And thats it... hope you find it useful. Its a bit confusing at first when you do not know what has just happened.
NOTE: You can prevent the form from being submitted by returning false. Returning either true, null or undefined will cause the form to be submitted. See below:
$js = <<<JS
$('body').on('beforeSubmit', 'form#{$model->formName()}', function () {
var form = $(this);
if (form.find('.has-error').length) {
return false;
}
// return undefined; // form gets submitted
// return null; // form gets submitted
// return true; // form gets submitted
return false; // form does not get submitted
});
JS;
$this->registerJs($js);
When using return false
to prevent submission, there is no need to use e.preventDefault()
on the submit
event:
<?php
$js = <<<JS
// get the form id and set the event
$('form#{$model->formName()}').on('beforeSubmit', function(e) {
// return false to prevent submission
return false;
}).on('submit', function(e){ // can be omitted
e.preventDefault(); // can be omitted
});
JS;
$this->registerJs($js);
web development has never been so fun
www.2amigos.us
thanks
nice,thanks
Good to mention
I forgot to mention that we should look into the yii.activeForm.js file in order to know which events are available:
JSExpression usage instead of outcasting?
Hi,
wouldn't it be easier to just JSExpression($js) before you pass it over to the view?
Otherwise great how-to!
@PinkBrainPlan
Yep... that is up to you. What I exposed on the tuto is just a demo.
If you have any questions, please ask in the forum instead.
Signup or Login in order to comment.