Magento 2结帐自定义字段验证


11

Magento2结帐-为我的自定义结帐字段添加验证的最佳方法是什么(取决于所选的送货方式)?

例如,我要在LayoutProcessor中的地址表单中添加字段,可以在其中指定验证规则。如果选择了我的自定义载体,则需要将此字段设为必填字段。

我的目标是在未填写我的自定义字段的情况下防止用户进入下一步。我知道我可以在下订单(“查看和付款”步骤)之前添加自定义验证,但是我需要在之前进行验证。


嗨,您如何解决这个问题?
simonthesorcerer18年

@ maciej-domski您解决了这个问题吗?
Ranjit Shinde '18


@Maciej Domski检查我的答案。我尝试使用它作为确认电子邮件,并且它的工作代码为
Ketan Borada

Answers:


1

试试这个,只需在LayoutProcessor插件中添加“ validation” => ['required-entry'=> true],如下所示

'config' => [
                'customScope' => 'shippingAddress',
                'template' => 'ui/form/field',
                'elementTmpl' => 'ui/form/element/input',
                'options' => [],
                'id' => 'custom_field'
            ],
            'dataScope' => 'customfield',
            'label' => 'custom field # :',
            'provider' => 'checkoutProvider',
            'validation' => ['required-entry' => true],
            'visible' => true,
            'sortOrder' => 250,
            'id' => 'custom_field'

0

是的,可以通过更改Magento_Checkout / js / model / shipping-save-processor / default.js来实现

我在结帐时添加了confirm email必须与email必填字段相同的字段,您可以根据需要自定义。

app\code\Ketan\Checkout\view\frontend\requirejs-config.js

var config = {
    "map": {
       "*": {
           "Magento_Checkout/js/model/shipping-save-processor/default" : "Ketan_Checkout/js/shipping-save-processor"
       }
   }
}

扩展js file app\code\Ketan\Checkout\view\frontend\web\js\shipping-save-processor.js

/*
* *
*  @author DCKAP Team
*  @copyright Copyright (c) 2018 DCKAP (https://www.dckap.com)
*  @package Dckap_CustomFields
*/
define(
   [
       'ko',
       'Magento_Checkout/js/model/quote',
       'Magento_Checkout/js/model/resource-url-manager',
       'mage/storage',
       'Magento_Checkout/js/model/payment-service',
       'Magento_Checkout/js/model/payment/method-converter',
       'Magento_Checkout/js/model/error-processor',
       'Magento_Checkout/js/model/full-screen-loader',
       'Magento_Checkout/js/action/select-billing-address',
       'jquery'
   ],
   function (
       ko,
       quote,
       resourceUrlManager,
       storage,
       paymentService,
       methodConverter,
       errorProcessor,
       fullScreenLoader,
       selectBillingAddressAction,
       $
   ) {
       'use strict';

       return {
           saveShippingInformation: function () {
               var payload;

               var username = $("#customer-email").val();
               var conformusername = $("#conformusername").val();

              /*============ Customization Start =============*/
              //if(quote.shippingMethod().method_code=='flaterate'){ // Check if flaterate is selected
                if(conformusername != username){
                  $("#conformusername-error").show(); // show hidden message
                  $("#conformusername").focus();      // move cursor to the point
                  return false;
                 }
              // }
              /*============ Customization End =============*/


               if (!quote.billingAddress()) {
                   selectBillingAddressAction(quote.shippingAddress());
               }
               payload = {
                   addressInformation: {
                       shipping_address: quote.shippingAddress(),
                       billing_address: quote.billingAddress(),
                       shipping_method_code: quote.shippingMethod().method_code,
                       shipping_carrier_code: quote.shippingMethod().carrier_code
                   }
               };
               fullScreenLoader.startLoader();

               return storage.post(
                   resourceUrlManager.getUrlForSetShippingInformation(quote),
                   JSON.stringify(payload)
               ).done(
                   function (response) {
                       quote.setTotals(response.totals);
                       paymentService.setPaymentMethods(methodConverter(response.payment_methods));
                       fullScreenLoader.stopLoader();
                   }
               ).fail(
                   function (response) {
                       errorProcessor.process(response);
                       fullScreenLoader.stopLoader();
                   }
               );
           }
       };
   }
);
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.