Click Twice Only Submit Form

Hi everyone,

I’m not sure why my submit button only submit form on second click.

It happen like this:

First click, input box has green border

Second click, submit form

I want it work like my other forms which submit form on first click.

Highly appreciate any help.

Below is my code:

Controller




public function actionUpdate($id)

{

    $orderModel = $this->findModel($id);

    $orderProdModel = OrderProd::find()

		     ->joinWith('product')

		     ->where(['order_id'=>$orderModel->order_no])

		     ->all();

							

    if($orderModel->load(Yii::$app->request->post()))

    {

        if(Yii::$app->request->post('submit') == 'confirm')

        {

	    $orderModel->f_status = 1;

	    $orderModel->save();

        }

	if(Yii::$app->request->post('submit') == 'decline')

	{

	    $orderModel->f_status = 4;

	    $orderModel->save();

	}


	return $this->redirect(['index']);

    }

    else

        return $this->render('update', ['orderModel' => $orderModel, 'orderProdModel' => $orderProdModel]);

}



View




<?php $form = ActiveForm::begin(['options' => ['class' => 'form-horizontal', 'method'=>'post'],]); ?>


<div class="form-group">

  <label class="col-sm-2 control-label">Order.No : </label>

  <div class="col-sm-4">

    <?= $form->field($orderModel, 'order_no')

    	    ->textInput(['class'=>'form-control', 'autofocus'=>'autofocus', 'readOnly'=>true])

	    ->label(false);

    ?>

  </div>

</div>


<!-- Some code -->


<div class="form-group">

  <div class="col-sm-1">

    <?= Html::submitButton('Confirm', ['class' => 'btn btn-success', 'name' => 'submit', 'value' => 'confirm']); ?>

  </div>

  <div class="col-sm-1">

    <?= Html::submitButton('Decline', ['class' => 'btn btn-danger',	'name' => 'submit', 'value' => 'decline']); ?>

  </div>

</div>


<?php ActiveForm::end(); ?>



Once even I got this problem, for that I had enabled or disabled , Ajax validation/Client validation.

You can randomly check by enable or disable (ie) change to true or false, May this will work out for you. (I did change it to true or false which works for me like a charm Hope it will help you too)

Or else you can use


$form.on('beforeSubmit', function () {

    $.ajax(...);

    return false;

}

It is because of the submit button, shouldn’t use name or id as “submit”.

Problem solved ;)

2 Likes

Thanks a lot this solution worked for me.