0

I have added a custom function which checks if the product has already been added in a quote or not. This works fine and shows button text accordingly. The only issue that it requires to refresh the page when adding to a quote button is pressed. How to observe these vars in Knockout Js so it updates on change.

return Component.extend({
    addedToCart: ko.observable(false),
    quote: {},
    /**
     * @override
     */
    initialize: function () {
        this._super();
        this.quote = customerData.get('quote');
        return this._super();
    },

    checkProductAddedToQuote: function (id) {

        var items = this.quote().items;
        if (!_.isUndefined(items)) {
            if ($.inArray(id, $.map(items, function (item) { return item.product_id; })) > -1) {
                return true
            }
        }
        return false;
    },


});

in my phtml file I am accessing like this

<button data-bind="scope: 'quote'" type="button"
                    title="<?php /* @escapeNotVerified */ echo $buttonTitle ?>"
                    class="action primary toquote"
                    id="product-addtoquote-button">
        <span data-bind="text: quote().summary_count > 0 ? ( checkProductAddedToQuote('<?php /* @escapeNotVerified */ echo $_product->getId() ?>') === true ? 'Added to Quote' : 'Add to Quote' ): 'Request a Quote'"></span>
    </button>
3
  • this may help - magemonkeys.com/…
    – rex
    Oct 14 at 5:27
  • kamlesh, if you have to reflect immediately your ko function then you have to call a function on a click or any of the events that call your ko function immediate. Oct 19 at 12:29
  • Right now your function is called on refresh the page, not on events like click. so, you have to change your logic of word change on click event. Oct 19 at 12:32
0

please use below code.

define([
    'uiComponent',
    'ko',
    'Magento_Customer/js/customer-data'
], function (uiComponent, ko, customerData) {
    return uiComponent.extend({
        _config: '',
        _element: '',

        initialize: function (config, element) {
            this._super();
            this.cart = customerData.get('cart');
            this._config = config;
            this._element = element;
        },
        myConf: function () {
            return this._config;
        },
        getPrice: function () {
            var self = this;
            return ko.computed(function() {
                return self._config.min_price - self.cart().subtotalAmount;
            });
        },
        isEnable: function () {
            return this._config.is_enable;
        }
    });
});

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.