Cart Attributes Not Showing In Admin Order Backend

Technical Q&A

Topic summary

A developer encountered an issue where custom cart attributes weren’t appearing in Shopify’s admin order backend despite implementing the feature with AJAX.

The Problem:

  • Cart attribute values from a salesperson dropdown weren’t being passed to order information in the admin panel
  • Implementation included custom HTML in cart.liquid and JavaScript monitoring for value changes

The Solution:
The issue was resolved by correcting the attribute key structure:

  • Original (incorrect): Passing attributes: val in the POST request
  • Fixed: Changed to associate: val to match the HTML name="attributes[associate]" array format
  • The key in the JavaScript POST request must align with the bracket notation used in the HTML name attribute

Status: Resolved. The developer identified it as a minor syntax mismatch between the JS and HTML implementations.

Summarized with AI on November 20. AI used: claude-sonnet-4-5-20250929.
1

First time attempting to implement custom cart attributes but the value is not being passed to the Admin backend in the order info. Site is using AJAX.

cart.liquid file:

{% if section.settings.enable_sales_dropdown %}
              
                ## Salesperson
                

*Please choose the salesperson that you worked with on this order below. If you did not work with a salesperson, please choose "None"

                
                  

                  
                  
                

              

            {% endif %}

JS file (Copied logic from the notes to create the custom cart field):

/* Sales Agent Cart Select */
theme.cartSalesAgentMonitor = {
  load: function load($salesAgent) {
    $salesAgent.on('change.themeCartSalesAgentMonitor paste.themeCartSalesAgentMonitor keyup.themeCartSalesAgentMonitor', function () {
      theme.cartSalesAgentMonitor.postUpdate($(this).val());
    });
  },

  unload: function unload($salesAgent) {
    $salesAgent.off('.themeCartSalesAgentMonitor');
  },

  updateThrottleTimeoutId: -1,
  updateThrottleInterval: 500,

  postUpdate: function postUpdate(val) {
    clearTimeout(theme.cartSalesAgentMonitor.updateThrottleTimeoutId);
    theme.cartSalesAgentMonitor.updateThrottleTimeoutId = setTimeout(function () {
      $.post(theme.routes.cart_url + '/update.js', {
        attributes: val },
      function (data) {}, 'json');
    }, theme.cartSalesAgentMonitor.updateThrottleInterval);
  } };
/* End Sales Agent Cart Select */

/* Original Theme Code */
  theme.cartNoteMonitor = {
    load: function load($notes) {
      $notes.on('change.themeCartNoteMonitor paste.themeCartNoteMonitor keyup.themeCartNoteMonitor', function () {
        theme.cartNoteMonitor.postUpdate($(this).val());
      });
    },

    unload: function unload($notes) {
      $notes.off('.themeCartNoteMonitor');
    },

    updateThrottleTimeoutId: -1,
    updateThrottleInterval: 500,

    postUpdate: function postUpdate(val) {
      clearTimeout(theme.cartNoteMonitor.updateThrottleTimeoutId);
      theme.cartNoteMonitor.updateThrottleTimeoutId = setTimeout(function () {
        $.post(theme.routes.cart_url + '/update.js', {
          note: val },
        function (data) {}, 'json');
      }, theme.cartNoteMonitor.updateThrottleInterval);
    } };
/* Original Theme Code */

/* Code Located In Other Areas Of File Wrapped In Other Functions */
      theme.cartNoteMonitor.load($('.checkout-note [name="note"]', container));
      theme.cartSalesAgentMonitor.load($('.checkout-salesAgent [name="properties[Choose Associate]"]', container));

    this.onSectionUnload = function (container) {
      $(document).off('.cartTemplateSection');
      $(container).off('.cartTemplateSection');
      theme.cartNoteMonitor.unload($('.checkout-note [name="note"]', container));
      theme.cartSalesAgentMonitor.unload($('.checkout-salesAgent [name="properties[Choose Associate]"]', container));
    };
2

Hi @webb1 ,

We’re BSS Commerce - Shopify Partners & Experts providing Shopify apps and Store Development on Shopify & Shopify Plus.
We’ve carefully checked your website and found your problem quite complicated. This requirement needs time to research and write custom scripts directly on the theme.

So we suggest hiring a developer. It’s what we can help with an optimal solution. If you need help from our expert, kindly share your request with us via Shopify experts. We will check it and give you a detailed solution. We’re looking forward to working with you.

3

I found the issue, and really it was a very minor one.

Was passing in the key as attributes when it needs to match the array in the HTML name=“” the final changes are:

HTML:

JS:

$.post(theme.routes.cart_url + '/update.js', {
  associate: val
}

theme.cartSalesAgentMonitor.load($('.checkout-salesAgent [name="attributes[associate]"]', container));

this.onSectionUnload = function (container) {
  $(document).off('.cartTemplateSection');
  $(container).off('.cartTemplateSection');
  theme.cartNoteMonitor.unload($('.checkout-note [name="note"]', container));
  theme.cartSalesAgentMonitor.unload($('.checkout-salesAgent [name="attributes[associate]"]', container));
};