2016-09-07 7 views
1

私は別のPHPコードから生成されたHTMLテーブルからセルの値を取得しようとしています。私は最終結果でランデブーを送信するために結果を使用することができます。Jqueryを使用してテーブルからセル値を取得しますか?

私の現在のJSFiddleはいくつかの値を取得できますが、私は望んでいません。私はTDのボタンからtitle & valueの属性を取得する必要があります。私の問題は現在、朝の日のコード戻り値のデータであり、翌朝の日にジャンプします。

どのように私は一日を返すことができますvalue & titleテーブルの利用可能な日ごとのデータはありますか?

コード:

$(document).ready(function(){  

    eachCell(); 

    function eachCell(){ 
    var cellInnerText = []; 
    var cellValue = []; 
    var out = document.getElementById("out"); 
    var out2 = document.getElementById("out2"); 
    $('#ft_agenda tbody tr').each(function(index) {   
     // console.log("index ", index, " this: " , this, "this.attr(rel)", $(this).attr('rel'), "$(this).text()", $(this).text()); 
     console.log($(":first-child", $(this))[0]); 
     cellInnerText.push($("td button", $(this)).attr('value')); 
     cellValue.push($("td button", $(this)).attr('title')); 
    }); 
    out.innerHTML = cellInnerText.join(" | "); 
    out2.innerHTML = cellValue.join(" | ");  
} 

}); 
+0

あなたは、PHPでこれをタグ付けしているのはなぜ? – jeroen

+0

jqueryを '$( '#ft_agenda tbody tr td button')というボタンを検索するだけで変更しないでください。each(function(index){'そして、 'console.log($ (これは).attr( 'value')+ '' + $(this).attr( 'title')); ' – depperm

答えて

1
// Try this code on your jsfiddle 
// https://jsfiddle.net/g60ogt8c/1/ 
$(function() { 

    function findColumnByDate(date) { 
    var col; 
    $('#ft_agenda thead th').each(function(idx) { 
     if ($(this).text().trim() == date.trim()) col = idx; 
    }); 
    return col; 
    } 

    function showAvailableTimes(date) { 
    var times = [], 
     column = findColumnByDate(date); 
    if (column) { 
     var $rows = $('#ft_agenda tbody td:nth-of-type('+column+')'); 
     if ($rows.length) { 
     times[0] = ''; 
     $rows.find('button').each(function() { 
      times[times.length] = $(this).attr('value')+' - '+$(this).attr('title'); 
     }); 
     times[0] = 'For date '+date+' found '+(times.length-1)+' free terms'; 
     } else { 
     times[0] = ['No free terms for date: '+date]; 
     } 
    } else { 
     times[0] = ['Invalid date '+date+' or date not found']; 
    } 
    return times; 
    } 

    // Function showAvailableTimes() now returns array. 
    // In index 0 is status message and if available times found, 
    // these lies on indexes 1 and more. 

    // Use it this way: 
    $('#out').html(''); 
    showAvailableTimes('15-09-2016').forEach(function(item) { 
    $('#out').append(item + '<br>'); 
    }); 

    // Or this way: 
    // Jsonify returned array and send it toSome.php. 
    var json = JSON.stringify(showAvailableTimes('09-09-2016')); 
    $.post('toSome.php', {times: json}); 

    // Or if there are free terms, filter status message 
    // and send just free terms - without status message. 
    var times = showAvailableTimes('09-09-2016'); 
    if (times.length > 1) { 
    var json = JSON.stringify(times.filter(function(itm,idx){return idx>0})); 
    $.post('toSome.php', {times: json}); 
    // Here you can see that status message was skipped 
    $('#out2').text(json); 
    } 

}); 
+0

完璧なWaldemarIce !!私はそれを自分の必要に合わせて適応しようとします。 (例:15-09-2016)、テーブル内に日付が一致するかどうかをチェックして、最後に 'value' +' title'を返さなければなりません。 – Peacefull

+0

助けてくれてありがとうございます。 ) – Peacefull

+0

ありがとう、ちょうど私の最初の答えを確認:) – Peacefull

関連する問題