Требуется сортировать варианты без группы и группы вариантов вместе. Текущий код правильно сортирует параметры без группы и группы параметров. Проблема в том, что все параметры без группы находятся после первой группы параметров, а остальные группы - после.
<select class="main-category" placeholder="Category"></select>
$('select').selectize({
options: [{
type: "Apparel & Accessories",
value: "100",
name: "Eyewear"
},
{
type: "Apparel & Accessories",
value: "101",
name: "Footwear"
},
{
type: "Apparel & Accessories",
value: "102",
name: "Handbags &Leather Goods"
},
{
type: "Apparel & Accessories",
value: "103",
name: "Jewelry &Accessories"
},
{
type: "Apparel & Accessories",
value: "104",
name: "Men's Clothing"
},
{
type: "Apparel & Accessories",
value: "105",
name: "Screen Printing"
},
{
type: "Apparel & Accessories",
value: "106",
name: "Seamstress"
},
{
type: "Apparel & Accessories",
value: "107",
name: "Vintage &Thrift"
},
{
type: "Apparel & Accessories",
value: "108",
name: "Women's Clothing"
},
{
value: "200",
name: "Architecture & Design"
},
{
value: "300",
name: "Art Gallery"
},
{
value: "400",
name: "Automotive"
},
{
type: "Beauty",
value: "500",
name: "Aesthetician"
},
{
type: "Beauty",
value: "501",
name: "Barbershops"
},
{
type: "Beauty",
value: "502",
name: "Beauty Supply Store"
},
{
type: "Beauty",
value: "503",
name: "Cosmetics"
},
{
type: "Beauty",
value: "504",
name: "Grooming Products"
},
{
type: "Beauty",
value: "505",
name: "Hair Care Products"
},
{
type: "Beauty",
value: "506",
name: "Hair Salon"
},
{
type: "Beauty",
value: "507",
name: "Hair Stylist"
},
{
type: "Beauty",
value: "508",
name: "Makeup Artists"
},
{
type: "Beauty",
value: "509",
name: "Nail Care"
},
{
type: "Beauty",
value: "510",
name: "Perfumes &Colognes"
},
{
type: "Beauty",
value: "511",
name: "Salons &Spas"
},
{
type: "Beauty",
value: "512",
name: "Skin Care Products"
},
{
value: "600",
name: "Blog"
},
{
value: "700",
name: "Bookstore"
},
{
value: "800",
name: "Cannabis"
},
{
value: "900",
name: "Churches"
},
{
type: "Cleaning",
value: "1000",
name: "Commercial Cleaning"
},
{
type: "Cleaning",
value: "1001",
name: "Janitorial Services"
},
{
type: "Cleaning",
value: "1002",
name: "Maid Services"
},
{
type: "Cleaning",
value: "1003",
name: "Snow Removal"
},
{
value: "1100",
name: "Concierge"
},
{
value: "1200",
name: "Construction"
},
{
value: "1300",
name: "Consulting"
},
{
type: "Education",
value: "1400",
name: "Child Care"
},
{
value: "1500",
name: "Electronics"
},
{
value: "1600",
name: "Energy"
},
{
value: "1700",
name: "Oil and Gas"
},
{
value: "1800",
name: "Engineering"
},
{
type: "Entertainment",
value: "1900",
name: "Family Friendly Entertainment"
},
{
type: "Entertainment",
value: "1902",
name: "Lounge"
},
{
type: "Entertainment",
value: "1903",
name: "Music"
},
{
type: "Entertainment",
value: "1904",
name: "Nightlife"
},
{
type: "Event Planning",
value: "2000",
name: "Wedding Planner"
},
{
type: "Event Venue",
value: "2100",
name: "Work Space"
},
{
value: "2200",
name: "Farms"
},
{
type: "Financial Services",
value: "2300",
name: "Accounting"
},
{
type: "Financial Services",
value: "2301",
name: "Banking"
},
{
type: "Financial Services",
value: "2302",
name: "Credit"
},
{
type: "Financial Services",
value: "2304",
name: "Insurance"
},
{
type: "Financial Services",
value: "2305",
name: "Insurance Agent"
},
{
type: "Financial Services",
value: "2306",
name: "Investment Management"
},
{
type: "Financial Services",
value: "2307",
name: "Loans"
},
{
type: "Financial Services",
value: "2308",
name: "Venture Capital"
},
{
type: "Fine Arts (Art, Dance, Theater)",
value: "2400",
name: "Art"
},
{
type: "Fine Arts (Art, Dance, Theater)",
value: "2401",
name: "Dance"
},
{
type: "Fine Arts (Art, Dance, Theater)",
value: "2402",
name: "Theatre"
},
{
type: "Fine Arts (Art, Dance, Theater)",
value: "2403",
name: "Firearms"
},
{
type: "Fine Arts (Art, Dance, Theater)",
value: "2404",
name: "Conceal Weapons Permit"
},
{
type: "Fine Arts (Art, Dance, Theater)",
value: "2405",
name: "Firearm Safety"
},
{
type: "Fine Arts (Art, Dance, Theater)",
value: "2406",
name: "Handgun Classes"
},
{
type: "Fitness",
value: "2500",
name: "Gym"
},
{
type: "Fitness",
value: "2501",
name: "Martial Arts"
},
{
type: "Fitness",
value: "2502",
name: "Personal Trainer"
},
{
type: "Fitness",
value: "2503",
name: "Yoga"
},
{
value: "2600",
name: "Floristry"
},
{
type: "Food & Beverages",
value: "2700",
name: "Bakery"
},
{
type: "Food & Beverages",
value: "2701",
name: "Bar"
},
{
type: "Food & Beverages",
value: "2702",
name: "Beverages"
},
{
type: "Food & Beverages",
value: "2703",
name: "Catering"
},
{
type: "Food & Beverages",
value: "2704",
name: "Dessert Shop"
},
{
type: "Food & Beverages",
value: "2705",
name: "Food Truck"
},
{
type: "Food & Beverages",
value: "2706",
name: "Grocery Store"
},
{
type: "Food & Beverages",
value: "2707",
name: "Restaurant"
},
{
type: "Food & Beverages",
value: "2708",
name: "Sauces &Spices"
},
{
type: "Food & Beverages",
value: "2709",
name: "Wine &Spirits"
},
{
type: "Food & Beverages",
value: "2710",
name: "Wineries &Breweries"
},
{
type: "For Kids",
value: "2800",
name: "Baby Essentials"
},
{
type: "For Kids",
value: "2801",
name: "Books"
},
{
type: "For Kids",
value: "2802",
name: "Children's Books"
},
{
type: "For Kids",
value: "2803",
name: "Kid's Accessories"
},
{
type: "For Kids",
value: "2804",
name: "Kid's Clothing"
},
{
type: "For Kids",
value: "2805",
name: "Toys"
},
{
value: "2900",
name: "Franchise"
},
{
value: "3000",
name: "Funeral Services"
},
{
value: "3100",
name: "Games"
},
{
value: "3200",
name: "Gas Station"
},
{
value: "3300",
name: "Gift Wrapping"
},
{
value: "3400",
name: "Graphic Design & Web Services"
},
{
value: "3500",
name: "Greeting Card & Stationery"
},
{
type: "Health & Wellness",
value: "3600",
name: "Chiropractor"
},
{
type: "Health & Wellness",
value: "3601",
name: "Dentistry"
},
{
type: "Health & Wellness",
value: "3602",
name: "Dietitian"
},
{
type: "Health & Wellness",
value: "3603",
name: "Doula"
},
{
type: "Health & Wellness",
value: "3604",
name: "Feminine Hygiene"
},
{
type: "Health & Wellness",
value: "3605",
name: "Health Insurance"
},
{
type: "Health & Wellness",
value: "3606",
name: "Nutritionist"
},
{
type: "Health & Wellness",
value: "3607",
name: "OB/GYN"
},
{
type: "Health & Wellness",
value: "3608",
name: "Optometry"
},
{
type: "Health & Wellness",
value: "3609",
name: "Pediatrician"
},
{
type: "Health & Wellness",
value: "3610",
name: "Pharmacy"
},
{
type: "Health & Wellness",
value: "3611",
name: "Podiatry"
},
{
type: "Health & Wellness",
value: "3612",
name: "Primary Care"
},
{
type: "Health & Wellness",
value: "3613",
name: "Therapy"
},
{
type: "Health Information Management",
value: "3700",
name: "Consulting"
},
{
type: "Health Information Management",
value: "3701",
name: "Financial"
},
{
value: "3800",
name: "Holding Company"
},
{
value: "3900",
name: "Home & Garden"
},
{
type: "Home Improvement & Installations",
value: "4000",
name: "Electrician"
},
{
type: "Home Improvement & Installations",
value: "4001",
name: "Plumbing"
},
{
value: "4100",
name: "Hospitality"
},
{
value: "4200",
name: "Human Resources"
},
{
value: "4300",
name: "Information Technology"
},
{
value: "4400",
name: "Job Seekers"
},
{
value: "4500",
name: "Laundry & Dry Cleaning Services"
},
{
value: "4600",
name: "Legal Services"
},
{
value: "4700",
name: "Manufacturing"
},
{
type: "Marketing",
value: "4800",
name: "Advertising Agency"
},
{
type: "Marketing",
value: "4801",
name: "Modeling Agency"
},
{
type: "Marketing",
value: "4802",
name: "Public Relations Agency"
},
{
type: "Mass Media",
value: "4900",
name: "Books"
},
{
type: "Mass Media",
value: "4901",
name: "Films"
},
{
type: "Mass Media",
value: "4902",
name: "Magazines"
},
{
type: "Mass Media",
value: "4903",
name: "Newspaper"
},
{
type: "Mass Media",
value: "4904",
name: "Podcasts"
},
{
type: "Mass Media",
value: "4905",
name: "Radio"
},
{
value: "5000",
name: "Mobile App"
},
{
value: "5100",
name: "Moving Services"
},
{
value: "5200",
name: "Museum"
},
{
value: "5300",
name: "Music"
},
{
value: "5400",
name: "Non-profits & Organizations"
},
{
type: "Office Goods",
value: "5500",
name: "Planner"
},
{
value: "5600",
name: "Online Community"
},
{
value: "5700",
name: "Online Shopping"
},
{
value: "5800",
name: "Personal Care"
},
{
value: "5900",
name: "Pets"
},
{
value: "6000",
name: "Photo & Video Services"
},
{
value: "6100",
name: "Printing Services"
},
{
value: "6200",
name: "Psychic"
},
{
value: "6300",
name: "Real Estate Agent"
},
{
value: "6400",
name: "Real Estate Firm"
},
{
value: "6500",
name: "Religious Institutions"
},
{
value: "6600",
name: "Security Services"
},
{
value: "6700",
name: "Speakers & Coaches"
},
{
value: "6800",
name: "Spirituality"
},
{
value: "6900",
name: "Sports"
},
{
value: "7000",
name: "Sports Agency"
},
{
value: "7100",
name: "Subscription Boxes"
},
{
value: "7200",
name: "Tattoo Studio"
},
{
value: "7300",
name: "Telecommunications"
},
{
type: "Travel",
value: "7400",
name: "Ground Transportation"
},
{
type: "Travel",
value: "7401",
name: "Travel Agency"
},
{
type: "Travel",
value: "7402",
name: "Waste Management"
},
{
type: "Travel",
value: "7403",
name: "Composting"
},
{
type: "Travel",
value: "7404",
name: "Recycling"
},
{
type: "Writing",
value: "7500",
name: "Copywriter"
},
{
type: "Writing",
value: "7501",
name: "Ghost Writing"
},
{
type: "Writing",
value: "7502",
name: "Resume Writing"
},
{
type: "Writing",
value: "7503",
name: "Transcription Services"
},
{
value: "7600",
name: "XXX Adult Only"
},
],
optgroups: [{
value: 'Apparel & Accessories',
label: 'Apparel & Accessories'
},
{
value: 'Beauty',
label: 'Beauty'
},
{
value: 'Cleaning',
label: 'Cleaning'
},
{
value: 'Education',
label: 'Education'
},
{
value: 'Entertainment',
label: 'Entertainment'
},
{
value: 'Event Planning',
label: 'Event Planning'
},
{
value: 'Event Venue',
label: 'Event Venue'
},
{
value: 'Financial Services',
label: 'Financial Services'
},
{
value: 'Fine Arts (Art, Dance, Theater)',
label: 'Fine Arts (Art, Dance, Theater)'
},
{
value: 'Fitness',
label: 'Fitness',
label_scientific: 'Fitness'
},
{
value: 'Food & Beverages',
label: 'Food & Beverages'
},
{
value: 'For Kids',
label: 'For Kids'
},
{
value: 'Health & Wellness',
label: 'Health & Wellness'
},
{
value: 'Health Information Management',
label: 'Health Information Management'
},
{
value: 'Home Improvement & Installations',
label: 'Home Improvement & Installations'
},
{
value: 'Marketing',
label: 'Marketing'
},
{
value: 'Mass Media',
label: 'Mass Media'
},
{
value: 'Office Goods',
label: 'Office Goods'
},
{
value: 'Travel',
label: 'Travel'
},
{
value: 'Writing',
label: 'Writing'
},
],
labelField: 'name',
valueField: 'value',
create: false,
sortField: [{
field: 'label',
direction: 'asc'
}],
optgroupField: 'type',
optgroupOrder: 'label',
optgroupLabelField: 'label',
searchField: ['name'],
render: {
option: function(data, escape) {
if (data.type)
return '<div class="select-optgroup-option">' + escape(data.name) + '</div>';
else
return '<div class="select-option"><b>' + escape(data.name) + '</b></div>';
},
optgroup_header: function(data, escape) {
return '<div class="select-optgroup-header"><b>' + escape(data.label) + ' </b></div>';
}
}
});
Fiddle link: https://jsfiddle.net/biggAye/9pdjqh6f/3/