代码之家  ›  专栏  ›  技术社区  ›  Sasha

Yii2-onsubmit事件被激发两次

  •  1
  • Sasha  · 技术社区  · 6 年前

    我正在尝试正确地设置submit事件(onsubmit设置为内联),但它将被触发两次,这不是期望的行为。

    我的 活性形式 代码:

    <?php
    
    use app\models\Countries;
    use app\models\States;
    use yii\bootstrap\ActiveForm;
    use yii\helpers\ArrayHelper;
    use yii\helpers\Html;
    
    $form = ActiveForm::begin(
        [
            'action'  => 'user-default-shipping/create',
            'options' => [
                'onsubmit' => 'Address.createDefault(event, this)'
            ]
    
        ]
    );
    
    if ($model->id)
        echo Html::activeHiddenInput($model, 'id');
    
    echo $form->field($model, 'city')->textInput();
    
    echo $form->field($model, 'address')->textInput();
    
    echo $form->field($model, 'zip')->input('text');
    
    echo $form->field($model, 'country_id')
        ->dropDownList(ArrayHelper::map(Countries::find()->all(), 'country_id', 'country_name'),
            ['role' => 'countries']
        )->hint('Choose your country.');
    
    echo $form->field($model, 'state_id')
        ->dropDownList(ArrayHelper::map(States::find()->all(), 'state_id', 'state_name'),
            [
                'role' => 'states'
            ]
        )->hint('Choose your state.');
    
    ?>
    
        <div class="form-group">
            <button type="submit" class="btn btn-green">Submit</button>
        </div>
    
    <?php ActiveForm::end(); ?>
    

    JS代码:

    const Address = {
    
        createDefault(event, form) {
            event.preventDefault();
    
            console.log(form);
    
        }
    
    }
    

    有没有办法防止这种行为?

    1 回复  |  直到 6 年前
        1
  •  8
  •   Community holdenweb    4 年前

    您可以使用 ActiveForm Js Library

    使用事件

    $('#contact-form').on('beforeSubmit', function (e) {
        if (!confirm("Everything is correct. Submit?")) {
            return false;
        }
        return true;
    });
    

    可用事件包括:

    • 在验证之前。

    • 后验证。

    • 在验证属性之前。

    • afterValidateAttribute。

    • 提交前。

    • ajaxBeforeSend。

    • Ajax完成。