Skip to content

Commit

Permalink
added skippable step feature
Browse files Browse the repository at this point in the history
  • Loading branch information
@buttflattery
buttflattery committed Jan 10, 2020
1 parent e651e67 commit 4fb9198
Show file tree
Hide file tree
Showing 2 changed files with 48 additions and 30 deletions.
55 changes: 28 additions & 27 deletions src/FormWizard.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,20 +12,20 @@
*/
namespace buttflattery\formwizard;

use buttflattery\formwizard\assetbundles\bs3\FormWizardAsset as Bs3Assets;
use buttflattery\formwizard\assetbundles\bs4\FormWizardAsset as Bs4Assets;
use Yii;
use yii\base\InvalidArgumentException as ArgException;
use yii\web\View;
use yii\base\Widget;
use yii\bootstrap4\ActiveForm as BS4ActiveForm;
use yii\bootstrap4\BootstrapAsset as BS4Asset;
use yii\bootstrap\ActiveForm as BS3ActiveForm;
use yii\helpers\ArrayHelper;
use yii\helpers\Html;
use yii\helpers\Json;
use yii\web\JsExpression;
use yii\web\View;
use yii\helpers\ArrayHelper;
use yii\bootstrap4\BootstrapAsset as BS4Asset;
use yii\bootstrap\ActiveForm as BS3ActiveForm;
use buttflattery\formwizard\traits\WizardTrait;
use yii\bootstrap4\ActiveForm as BS4ActiveForm;
use yii\base\InvalidArgumentException as ArgException;
use buttflattery\formwizard\assetbundles\bs3\FormWizardAsset as Bs3Assets;
use buttflattery\formwizard\assetbundles\bs4\FormWizardAsset as Bs4Assets;

/**
* A Yii2 plugin used for creating stepped form or form wizard using
Expand Down Expand Up @@ -76,8 +76,8 @@ class FormWizard extends Widget
private $_tabularEventJs;

/**
* Used for adding limit var for the tabular steps to be used in javascript
*
* Used for adding limit var for the tabular steps to be used in javascript
*
* @var mixed
*/
private $_rowLimitJs;
Expand All @@ -89,7 +89,6 @@ class FormWizard extends Widget
*/
private $_persistenceEvents;


//options widget

/**
Expand Down Expand Up @@ -374,7 +373,6 @@ class FormWizard extends Widget
*/
public $classListGroupBadge = 'success';


/**
* ICONS
* */
Expand Down Expand Up @@ -417,7 +415,7 @@ class FormWizard extends Widget
self::THEME_ARROWS => 'Arrows',
self::THEME_MATERIAL => 'Material',
self::THEME_MATERIAL_V => 'MaterialVerticle',
self::THEME_TAGS => 'Tags'
self::THEME_TAGS => 'Tags',
];

/**
Expand Down Expand Up @@ -495,16 +493,16 @@ public function getPluginOptions()
'toolbarPosition' => $this->toolbarPosition,
'showNextButton' => false,
'showPreviousButton' => false,
'toolbarExtraButtons' => $this->toolbarExtraButtons
'toolbarExtraButtons' => $this->toolbarExtraButtons,
],
'anchorSettings' => [
'anchorClickable' => false,
'enableAllAnchors' => false,
'markDoneStep' => $this->markDoneStep,
'markAllPreviousStepsAsDone' => $this->markAllPreviousStepsAsDone,
'removeDoneStepOnNavigateBack' => $this->removeDoneStepOnNavigateBack,
'enableAnchorOnDoneStep' => $this->enableAnchorOnDoneStep
]
'enableAnchorOnDoneStep' => $this->enableAnchorOnDoneStep,
],
];
}

Expand Down Expand Up @@ -663,8 +661,8 @@ public function createFormWizard()
'type' => self::STEP_TYPE_PREVIEW,
'title' => 'Final Preview',
'description' => 'Final Preview of all Steps',
'formInfoText' => 'Click any of the steps below to edit them'
]
'formInfoText' => 'Click any of the steps below to edit them',
],
]
);
}
Expand Down Expand Up @@ -761,6 +759,8 @@ public function createBody($index, $formInfoText, $step)
//get the step type
$stepType = ArrayHelper::getValue($step, 'type', self::STEP_TYPE_DEFAULT);

$isSkippable = ArrayHelper::getValue($step, 'isSkippable', false);

//check if tabular step
$isTabularStep = $stepType == self::STEP_TYPE_TABULAR;

Expand All @@ -775,7 +775,8 @@ public function createBody($index, $formInfoText, $step)
//step data
$dataStep = [
'number' => $index,
'type' => $stepType
'type' => $stepType,
'skippable' => $isSkippable,
];

//start step wrapper div
Expand All @@ -791,7 +792,7 @@ public function createBody($index, $formInfoText, $step)
$html .= Html::button(
$this->iconAdd . ' Add',
[
'class' => $this->classAdd . (($this->_bsVersion == 3) ? ' pull-right add_row' : ' float-right add_row')
'class' => $this->classAdd . (($this->_bsVersion == 3) ? ' pull-right add_row' : ' float-right add_row'),
// 'id'=>'add_row'
]
);
Expand Down Expand Up @@ -887,7 +888,7 @@ function ($element) use ($model, $isTabularStep, $modelIndex) {
}
}

//generate the html for the step
//generate the html for the step
$htmlFields .= $this->_createStepHtml($attributes, $modelIndex, $index, $model, $isTabularStep, $fieldConfig, $stepHeadings);

//is tabular step
Expand Down Expand Up @@ -929,7 +930,7 @@ public function createCustomInput($model, $attribute, $fieldConfig)
[
'template' => $template,
'options' => $containerOptions,
'inputOptions' => $inputOptions
'inputOptions' => $inputOptions,
],
$isMultiField
);
Expand All @@ -954,10 +955,10 @@ public function createCustomInput($model, $attribute, $fieldConfig)
'options' => $options,
'labelOptions' => $labelOptions,
'label' => $label,
'itemsList' => $itemsList
'itemsList' => $itemsList,
];

//creae the field
//create the field
return $this->_createField($fieldType, $fieldTypeOptions, $hintText);
}

Expand All @@ -976,14 +977,14 @@ public function registerScripts()
//register plugin assets
$this->_bsVersion == 3
?
Bs3Assets::register($view)
Bs3Assets::register($view)
: Bs4Assets::register($view);

//is supported theme
if (in_array($themeSelected, array_keys($this->themesSupported))) {
$themeAsset = __NAMESPACE__ . '\assetbundles\bs' .
$this->_bsVersion . '\Theme' .
$this->themesSupported[$themeSelected] . 'Asset';
$this->_bsVersion . '\Theme' .
$this->themesSupported[$themeSelected] . 'Asset';

$themeAsset::register($view);
}
Expand Down
23 changes: 20 additions & 3 deletions src/assets/js/formwizard.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -247,20 +247,35 @@ $.formwizard = {
},
bindAfterValidate: function (form) {
$(form)
.on("beforeValidate", function (event, messages, deferreds) {
let formName = $(this).attr("id");
let currentIndex = $.formwizard.helper.currentIndex(form);
const isSkippableStep = $("#step-" + currentIndex).data('step').skippable;
if (isSkippableStep) {
$.each($.formwizard.fields[formName][currentIndex], function (index, fieldId) {
$("#" + formName).yiiActiveForm("remove", fieldId);
});
}
})
.on("afterValidate", function (event, messages, errorAttributes) {
//reset the current target button if not clicked on the next button

//reset the current target button if not clicked on the next button
if ($.formwizard.resetCurrentTarget) {
$.formwizard.currentButtonTarget = null;
}

event.preventDefault();

let formName = $(this).attr("id");
let currentIndex = $.formwizard.helper.currentIndex(form);
const isLastStep = currentIndex == $(form + " .step-anchor").find("li").length - 1;
const isPreviewEnabled = $.formwizard.options[formName].enablePreview && isLastStep;
const isSkippableStep = $("#step-" + currentIndex).data('step').skippable;

let res;

//check if the preview step then skip validation messages check
if ($.formwizard.options[formName].enablePreview && isLastStep) {
if (isPreviewEnabled || isSkippableStep) {
res = 0;
} else {
res = $.formwizard.fields[formName][currentIndex].diff(messages);
Expand Down Expand Up @@ -289,9 +304,11 @@ $.formwizard = {
return false;
})
.on("beforeSubmit", function (event) {
console.log('submit');
event.preventDefault();
if ($.formwizard.submit) {
$.formwizard.persistence.clearStorage();
console.log("returning");
return true;
}
return false;
Expand Down Expand Up @@ -875,4 +892,4 @@ Array.prototype.diff = function (arr2) {
}
}
return ret;
};
};

0 comments on commit 4fb9198

Please sign in to comment.