I am getting the below error after applying the validation in my form:
Magento2: TypeError: $.validator.methods[method] is undefined
Here is my validation code:
I have extended the customer address edit form, want to stop the default validation and added my custom validation.
<?php
/**
* Copyright © Magento, Inc. All rights reserved.
* See COPYING.txt for license details.
*/
// @codingStandardsIgnoreFile
/** @var \Magento\Customer\Block\Address\Edit $block */
// 18id="form-validate"
?>
<?php $_company = $block->getLayout()->createBlock('Magento\Customer\Block\Widget\Company') ?>
<?php $_telephone = $block->getLayout()->createBlock('Magento\Customer\Block\Widget\Telephone') ?>
<?php $_fax = $block->getLayout()->createBlock('Magento\Customer\Block\Widget\Fax') ?>
<form class="form-address-edit"
action="<?= $block->escapeUrl($block->getSaveUrl()) ?>"
id="validate-form"
method="post"
enctype="multipart/form-data">
<fieldset class="fieldset samefield_affecting">
<legend class="legend block-title"><span><?= $block->escapeHtml(__('Contact Information')) ?></span></legend><br>
<?= $block->getBlockHtml('formkey') ?>
<input type="hidden" name="success_url" value="<?= $block->escapeUrl($block->getSuccessUrl()) ?>">
<input type="hidden" name="error_url" value="<?= $block->escapeUrl($block->getErrorUrl()) ?>">
<?= $block->getNameBlockHtml() ?>
<?php if ($_company->isEnabled()): ?>
<?= $_company->setCompany($block->getAddress()->getCompany())->toHtml() ?>
<?php endif ?>
<?php if ($_telephone->isEnabled()): ?>
<?= $_telephone->setTelephone($block->getAddress()->getTelephone())->toHtml() ?>
<?php endif ?>
<?php if ($_fax->isEnabled()): ?>
<?= $_fax->setFax($block->getAddress()->getFax())->toHtml() ?>
<?php endif ?>
</fieldset>
<fieldset class="fieldset">
<legend class="legend block-title"><span><?= $block->escapeHtml(__('Address')) ?></span></legend><br>
<?php $_streetValidationClass = $this->helper('Magento\Customer\Helper\Address')->getAttributeValidationClass('street'); ?>
<div class="field street">
<label for="street_1" class="label">
<span><?= $block->escapeHtml(__('Street Address')) ?></span>
</label>
<div class="control">
<input type="text"
name="street[]"
value="<?= $block->escapeHtmlAttr($block->getStreetLine(1)) ?>"
title="<?= $block->escapeHtmlAttr(__('Street Address')) ?>"
id="street_1"
class="input-design input-text <?= $block->escapeHtmlAttr($_streetValidationClass) ?>"/>
<div class="nested">
<?php $_streetValidationClass = trim(str_replace('required-entry', '', $_streetValidationClass)); ?>
<?php for ($_i = 1, $_n = $this->helper('Magento\Customer\Helper\Address')->getStreetLines(); $_i < $_n; $_i++): ?>
<div class="field additional">
<label class="label" for="street_<?= /* @noEscape */ $_i + 1 ?>">
<span><?= $block->escapeHtml(__('Street Address %1', $_i + 1)) ?></span>
</label>
<div class="control">
<input type="text" name="street[]"
value="<?= $block->escapeHtmlAttr($block->getStreetLine($_i + 1)) ?>"
title="<?= $block->escapeHtmlAttr(__('Street Address %1', $_i + 1)) ?>"
id="street_<?= /* @noEscape */ $_i + 1 ?>"
class="input-design input-text">
</div>
</div>
<?php endfor; ?>
</div>
</div>
</div>
<?php if ($this->helper('Magento\Customer\Helper\Address')->isVatAttributeVisible()) : ?>
<div class="field taxvat">
<label class="label" for="vat_id">
<span><?= $block->escapeHtml(__('VAT Number')) ?></span>
</label>
<div class="control">
<input type="text"
name="vat_id"
value="<?= $block->escapeHtmlAttr($block->getAddress()->getVatId()) ?>"
title="<?= $block->escapeHtmlAttr(__('VAT Number')) ?>"
class="input-design input-text"
id="vat_id">
</div>
</div>
<?php endif; ?>
<div class="field city">
<label class="label" for="city"><span><?= $block->escapeHtml(__('City')) ?></span></label>
<div class="control">
<input type="text"
name="city"
value="<?= $block->escapeHtmlAttr($block->getAddress()->getCity()) ?>"
title="<?= $block->escapeHtmlAttr(__('City')) ?>"
class="input-design input-text"
id="city">
</div>
</div>
<div class="field region">
<label class="label" for="region_id">
<span><?= $block->escapeHtml(__('State/Province')) ?></span>
</label>
<div class="control">
<select id="region_id" name="region_id"
title="<?= $block->escapeHtmlAttr(__('State/Province')) ?>"
class="select_img validate-select" <?= /* @noEscape */ !$block->getConfig('general/region/display_all') ? ' disabled="disabled"' : '' ?>>
<option value=""><?= $block->escapeHtml(__('Please select a region, state or province.')) ?></option>
</select>
<input type="text"
id="region"
name="region"
value="<?= $block->escapeHtmlAttr($block->getRegion()) ?>"
title="<?= $block->escapeHtmlAttr(__('State/Province')) ?>"
class="input-design input-text "<?= !$block->getConfig('general/region/display_all') ? ' disabled="disabled"' : '' ?>/>
</div>
</div>
<div class="field zip">
<label class="label" for="zip">
<span><?= $block->escapeHtml(__('Zip/Postal Code')) ?></span>
</label>
<div class="control">
<input type="text"
name="postcode"
value="<?= $block->escapeHtmlAttr($block->getAddress()->getPostcode()) ?>"
title="<?= $block->escapeHtmlAttr(__('Zip/Postal Code')) ?>"
id="zip"
class="input-design input-text">
</div>
</div>
<div class="field country">
<label class="label" for="country"><span><?= $block->escapeHtml(__('Country')) ?></span></label>
<div class="control">
<?= $block->getCountryHtmlSelect() ?>
</div>
</div>
<?php if ($block->isDefaultBilling()): ?>
<div class="message info">
<span><?= $block->escapeHtml(__("It's a default billing address.")) ?></span>
</div>
<?php elseif ($block->canSetAsDefaultBilling()): ?>
<div class="field choice set billing">
<label class="submit_head phone_rig yes" for="primary_billing">
<input class="input-design" type="checkbox" id="primary_billing" name="default_billing" value="1" class="checkbox"><?= $block->escapeHtml(__('Use as my default billing address')) ?>
<span class="submit_class"></span>
</label>
</div>
<?php else: ?>
<input type="hidden" name="default_billing" value="1" />
<?php endif; ?>
<?php if ($block->isDefaultShipping()): ?>
<div class="message info">
<span><?= $block->escapeHtml(__("It's a default shipping address.")) ?></span>
</div>
<?php elseif ($block->canSetAsDefaultShipping()): ?>
<div class="field choice set shipping">
<label class="submit_head phone_rig yes" for="primary_shipping">
<input class="input-design" type="checkbox" name="default_shipping"
id="primary_shipping" checked="checked" value="1"><?= $block->escapeHtml(__('Use as my default shipping address')) ?>
<span class="submit_class"></span>
</label>
</div>
<?php else: ?>
<input type="hidden" name="default_shipping" value="1">
<?php endif; ?>
</fieldset>
<div class="actions-toolbar">
<div class="primary save_add">
<button type="submit"
class="action submit primary save_width"
data-action="save-address"
title="<?= $block->escapeHtmlAttr(__('Save Address')) ?>">
<?= $block->escapeHtml(__('Save Address')) ?>
</button>
</div>
<div class="secondary">
<a class="action back" href="<?= $block->escapeUrl($block->getBackUrl()) ?>">
<span><?= $block->escapeHtml(__('Go back')) ?></span>
</a>
</div>
</div>
</form>
<style type="text/css">
.fieldset>.field.required>.label:after, .fieldset>.fields>.field.required>.label:after, .fieldset>.field._required>.label:after, .fieldset>.fields>.field._required>.label:after {
font-size: 18px !important;
margin: 0px !important;
padding: 0px 3px 0px 3px !important;
top: 5px !important;
position: relative;
}
.fieldset>.field .additional, .fieldset>.fields>.field .additional {
margin-top: 20px;
}
div.mage-error[generated] {
color: #ff0000;
font-size: 14px;
position: absolute;
margin-top: 0px !important;
font-weight: 700;
}
@media(max-width: 767px) {
.actions-toolbar,legend.legend.block-title {
margin: 20px 0;
}
}
#country option:nth-child(3){
display: none;
}
</style>
<script type="text/javascript">
require([
'jquery',
'jquery/validate'
], function(jQuery)
{
jQuery(document).ready(function()
{
alert("Amy11");
jQuery("#validate-form").validate(
{
rules:
{
firstname: {
required:true
},
lastname: {
required:true
},
telephone: {
required:true
},
"street[]": {
required:true
},
country_id: {
required:true
},
city: {
required:true
},
postcode: {
required:true
},
},
messages:
{
firstname: "Please enter your First Name",
lastname: "Please enter your Last Name",
telephone: "Please enter your Phone Number",
"street[]": "Please enter your Street",
country_id: "Please enter your Country",
city: "Please enter your City",
postcode: "Please enter your Zip/Postal Code",
},
submitHandler: function(form, event)
{
event.preventDefault();
//console.log("aaaaaaaaaaa");
form.submit();
}
});
});
});
</script>
Any help would be appreciated.