Create a one-of-a-kind accessory with our customizable charm necklace. Select from a wide range of charms to design a piece that’s uniquely yours. Whether your style is simple and elegant or bold and expressive, you can mix and match charms to suit your personality. This versatile charm necklace also makes a thoughtful gift, offering the chance to craft something truly meaningful. With limitless combinations, it’s easy to design a necklace that tells your story.
========================================================================== */
jQuery(function ($) {
// Matches "Zone Name (+KShs 500.00)" or "Zone Name (KShs 500.00)"
// Captures: 1 = zone name, 2 = price (with currency), or undefined if free
var PRICE_PATTERN = /^(.*?)\s*\(\+?\s*(KShs?\s?[\d,]+(?:\.\d{2})?)\)\s*$/i;
function parseZoneOption(rawText) {
var match = rawText.match(PRICE_PATTERN);
if (match) {
return { zone: match[1].trim(), price: match[2].trim() };
}
// No price found in the text — treat as free / included
return { zone: rawText.trim(), price: 'Free' };
}
function formatZoneRow(state) {
// state.text is undefined for the placeholder / loading option
if (!state.id || !state.text) {
return state.text;
}
var parsed = parseZoneOption(state.text);
var $row = $(
'
' +
'' +
'' +
'
'
);
$row.find('.zone-option-name').text(parsed.zone);
$row.find('.zone-option-price').text(parsed.price);
return $row;
}
function formatZoneSelection(state) {
if (!state.id || !state.text) {
return state.text;
}
// Keep the selected/closed state as plain text (zone — price) so it
// still fits neatly in the collapsed input, same as before.
var parsed = parseZoneOption(state.text);
return parsed.zone + (parsed.price !== 'Free' ? ' — ' + parsed.price : '');
}
function enhanceZoneDropdown($select) {
// Skip if we've already enhanced this one
if ($select.data('zone-enhanced')) return;
// If Select2 is already attached (likely, since the dropdown already
// works), destroy and rebuild it with our custom templates
if ($select.hasClass('select2-hidden-accessible')) {
$select.select2('destroy');
}
$select.select2({
templateResult: formatZoneRow,
templateSelection: formatZoneSelection,
width: '100%'
});
$select.data('zone-enhanced', true);
}
function findAndEnhanceZoneSelects() {
// Detects the right