Расширенное использование составного поля

Задача: Показать общий принцип расширенного использования составного поля на примере вывода изображений в качестве элементов выбора. Примечание: Пример основан на стандартном шаблоне demodizzy (Интернет-магазин Современный).

Решение:

Если рассматривать стандартный шаблон, то если для какого-либо товара в его шаблоне данных Вы создадите группу Опционные свойства с идентификатором catalog_option_props, а в нём создадите нужное Вам поле, например "Цвет изделия" с произвольным идентификатором, выберите для него тип поля составное и нажмете сохранить, то в карточке товара появится возможность назначить ему опционные свойства, которые будут попадать в автоматически созданный справочник, но данные свойства будут только текстовые, а нам нужно выводить ещё картинку.

Для этого идём в шаблоны данных, в справочники и ищем созданный под наше опционное поле справочник, допустим он будет называться "Справочник для поля "Цвет изделия". Открыв его на редактирование, мы увидим пустой шаблон, добавим в него группу "Изображение изделия", добавим в группу поле "Картинка", тип поля выберем Изображение, сохранимся. Теперь если открыть справочник на просмотр и открыть для редактирования какой-либо пункт справочника, то мы увидим, что в нём появилось новое поле "Картинка". Добавим для выбранного нами пункта какую-нибудь картинку и сохранимся.

Перейдем в товар и назначим ему то опционное свойство, в которое мы заложили картинку.

Откроем товар на просмотр и допишем в конце страницы .xml и мы получим xml-представление страницы. В группе опционных свойств: <group id="346" name="catalog_option_props"> <title>Опционные свойства</title> <property id="381" name="color_product" type="optioned"> <title>Цвет изделия</title> <value> <option int="1"> <object id="688" name="Белый" type-id="125" ownerId="42" xlink:href="uobject://688"/> </option> <option int="1"> <object id="690" name="Коричневый" type-id="125" ownerId="42" xlink:href="uobject://690"/> </option> <option int="1"> <object id="689" name="Чёрный" type-id="125" ownerId="42" xlink:href="uobject://689"/> </option> </value> </property> </group>

Мы увидим для нашего пункта меню ссылку на объект: xlink:href="uobject://688" Это наше изображение.

На время разработки функционала, в файле config.ini включим доступ к протоколу uobect по http (потом следует эту возможность отключить) и в браузере дописав к адресу сайта uobject://688 посмотрим, что нам возвращается: <udata generation-time="0.020199"> <object id="688" name="Белый" type-id="125" ownerId="42"> <properties> <group id="353" name="product_image"> <title>Изображение изделия</title> <property id="407" name="picture_product" type="img_file"> <title>Картинка</title> <value path="./images/cms/data/color/white.jpg" folder="/images/cms/data/color" name="white" ext="jpg" width="160" height="168">/images/cms/data/color/white.jpg</value> </property> </group> </properties> </object> </udata>

И мы видим, что нам возвращается путь до картинки и её размеры.

Теперь необходимо вывести данную картинку в шаблоне.

Для этого открываем шаблон object-view.xsl, находим секцию <xsl:template match="option" mode="table_options">

и в столбце таблицы, где у нас выводится название опционного свойства вызываем новый темплейт с нашим object:

           <xsl:apply-templates select="document(concat('uobject://', object/@id))/udata/object/properties/group/property" mode="picture_product" />
               <xsl:value-of select="object/@name" />

Под него создадим собственно вызываемый нами темплейт: <xsl:template match="property" mode="picture_product"> <img src="{value}" width="{value/@width}"/> </xsl:template> Всё, картинка должна отображаться рядом с названием опционного свойства.