tomoya kitatani
portfolio site

EC-CUBE３で自動生成された規格部分のセレクトボックスを並び替える実装を行いました。

使用するのは『.sort()』メソッド

今回は「番号.カラー名」というオプションタグを並び替えます。

 

HTML

<select>

<option>1.ホワイト</option>

<option>3.ブラック</option>

<option>2.グレー</option>

</select>

 

jQuery

// 規格セレクトタグのソート
$(function(){
var $item = $(“セレクトボックス”).sort(function(a,b){

 

//テキストを取得
var sort_textA = a.text;
var sort_textB = b.text;

 

//テキストの.以前の部分を取得

var sortA = sort_textA.substring(0,sort_textA.indexOf(“.”));

var sortB = sort_textB.substring(0,sort_textB.indexOf(“.”));

 

//テキストを数値に
var sortA_number = Number(sortA);
var sortB_number = Number(sortB);

 

//並び替える処理

return sortA_number – sortB_number;
});

 

//セレクトボックスに加える
$(“セレクトボックス”).append($item);
});