table row selection 2

by Craig Martin

HTML

<button onclick="resetSelection()" id "reset">reset</button><div id="out2"></div>
<table id="grid">
    <tr id="row-1" class="">
        <td class="cf_id">id 1</td>
        <td class="name">name 1</td>
        <td>
            <button class="selectrow">select row</button>
        </td>
    </tr>
    <tr id="row-2">
        <td class="id">id 2</td>
        <td class="name">name 2</td>
        <td>
            <button class="selectrow">select row</button>
        </td>
    </tr>
</table>
<div id="code"></div>
<div id="out"></div>

CSS

.merge {
    background-color: lime;
    transition: All .7s;
}
.posted {
    background-color: red;
    transition: All .7s;
}
.norm {
    background-color: transparent;
    transition: All .7s;
}
table {
    width: 100%;
}

JavaScript

$(document).ready(function () {
    $("tr").click(function () {
        var $row = $(this).closest("tr");
        var $cf_id = $row.find(".cf_id").text();
    });
 });    
        if ($($row).hasClass("merge")) { 
            $("#out2").html("has merge");
      //      $($row).toggleClass("merge");
      //      $($row).addClass("posted");

        } else if ($($row).not('.posted')) { 
            $("#out2").html("new select");
            $($row).toggleClass("merge");
            $($row).toggleClass("posted");
            $("#out").append("<div class='idresult'>" + $idtext + "</div>");
            $("#out").append("<div class='nameresult'>" + $nametext + "</div>");
            
        } else if ($($row).hasClass("posted")) { 
            $("#out2").html("has posted");
            $($row).toggleClass("merge");
            $($row).toggleClass("posted");
        }

    });



});

function hasMerge() {
    document.getElementById("out").innerHTML = "";
    $("tr").removeClass("merge");
};


function resetSelection() {
    document.getElementById("out").innerHTML = "";
    $("tr").removeClass("merge");
};



// <!-- 
// $(document).ready(function () {
// 
// $("tr").click(function () {     
//     var prep = ($(this).text());
//     var xcheck = $(".selectadded").find($(this).text());
//     if ($(this).hasClass("merge")) {
//         if (prep = xcheck){
//             var removetarget = $(".selectadded").find($(this).text());
//             removetarget.remove();
//            // alert('prep = xcheck');
//         }
//     } 
//     else if ($(this).not(".merge")) {
//     $("#out").append(('<div class="selectadded">')+($(this).text())+('</div>'));
//     $(this).toggleClass("merge"); 
//        // alert('not merge');
//     } else {
//     $("#out").append(('<div class="selectadded">')+($(this).text())+('</div>'));
//   //  $(this).toggleClass("merge"); 
//                 alert('else');
//     } 
// });
//     
// $("#sendselected2").click(function () {       ...