jQuery：Visualforce × jQueryでハマった話

今更すぎるけどjQueryの話

jQueryのセレクタを使って要素を取得→配列に入れ、ソートして再表示させたかった

結論

上手く動かないことがあるのでなるべく使わずに避けたほうが良い。

だめなやつ

function hoge(){
$var_id = $('#sortdata');

    for (i=0;i<30;i++){
        $k = $var_id[0].children[i].cells[1].children[0].value;
				$var_id[0].children[i].cells[1].children[0].value=$var_id[0].children[$k].cells[1].children[0].value;
	      var tr = $("#sortdata");//テーブルの全行を取得
				$var_id = $('#sortdata')[0].children; //テーブルの全行を取得
				data[i][j] =[];
				$('#sortdata')[0].children[3].cells[0].children[0].value;
				// $('#sortdata')[0].children[num] = tr
				// $('#sortdata')[0].children[3].cells[0] =td
}
}

だめなやつその2

function(){
var data = [];
var tr = $('#sortdata')[0].children;//テーブルの全行を取得

for (var i = 0, l = tr.length; i < l; i++) {
    var cells = $('#sortdata')[0].children[i].cells[0];  //1行目から順番に列を取得(th、td)
    for (var j = 0, m = tr[i].cells.length-1; j < m; j++) {
        var get_cells = tr[i].cells[j];
            data[i] = [];
        data[i][j] = get_cells.children[0].value; //i行目j列の文字列を取得
       
       
    }
    console.log("現在の行は：" + i);
    console.log("取得した配列は：" + data[i]);
}
$('#sortdata')[0].children[3].cells[0].children[0].value = data[1][1];
}

結果、こうやった

function Sort() {
    var data = [];
    var tr = document.getElementById("sortdata").children;//テーブルの全行を取得

    for (var i = 0, l = tr.length; i < l; i++) {
        //var cells = $('#sortdata')[0].children[i].cells[0];  //1行目から順番に列を取得(th、td)
        data[i] = [];
        for (var j = 0, m = tr[i].cells.length - 1; j < m; j++) {
            var get_cells = tr[i].cells[j];
            data[i][j] = [];
            data[i][j] = get_cells.children[0].value; //i行目j列の文字列を取得
            //console.log("取得した配列は：" + get_cells.children[0]);
            //console.log("現在の行は：" +i+", 現在の列は"+j);
            //console.log("取得した値は：" + get_cells.children[0].value);
        }
        data[i][0] = data[i][0] - 0;
        //console.log("現在の行は：" + i);
        //console.log("Dataは：" + data[i]);

    }
    console.log("Dataは：" + data[0]);

    /*  配列をソート  */
    data.sort(function (a, b) { return (a[0] - b[0]); });

    /* 配列を値に投入 */

    for (var i = 0, l = tr.length; i < l; i++) {
        for (var j = 0, m = tr[i].cells.length - 1; j < m; j++) {
            var get_cells = tr[i].cells[j];
            get_cells.children[0].value = data[i][j]; //i行目j列の文字列を取得
            //console.log("取得した配列は：" + get_cells.children[0]);
            //console.log("現在の行は：" +i+", 現在の列は"+j);
            //console.log("取得した値は：" + get_cells.children[0].value);
        }
    }
}

memo

後でHTMLを載せとく