lundi 24 octobre 2016

how to add checkboxes in cells of first column of HTML table?

I am working on an app development which will read through my mailbox and list all the unread e-mails in a HTML table on my web-app upon click of a button. Below is the code which I have made while researching through google which solves for the purpose.

<!DOCTYPE html>
<html>
<body>

<button onclick="groupFunction()">Click me</button>

<table id="tblContents">
   <tr onclick="tableClickTest()">
    <th>Sender</th>
    <th>Sent_Date</th> 
    <th>Received_By</th>

<th>Received_Date</th>
<th>Subject</th>
</tr>

</table> 


<script>

function RowSelection()
{
var table = document.getElementById("tblContents");
if (table != null) {
    for (var i = 0; i < table.rows.length; i++) {
        for (var j = 0; j < table.rows[i].cells.length; j++)
        table.rows[i].cells[j].onclick = function () {
            tableText(this);
        };
    }
}
}


function tableText(tableCell) {
    alert(tableCell.innerHTML);
}



function PopulateTable()
            {

                var objOutlook = new ActiveXObject("Outlook.Application");
                var session = objOutlook.Session;
//alert(session.Folders.Count)                
                for(var folderCount = 1;folderCount <= session.Folders.Count; folderCount++)
                {
                    var folder = session.Folders.Item(folderCount);
//alert(folder.Name)                
                    if(folder.Name.indexOf("Premanshu.Basak@genpact.com")>=0)
                    {
                        for(var subFolCount = 1; subFolCount <= folder.Folders.Count; subFolCount++)
                        {
                            var sampleFolder = folder.Folders.Item(subFolCount);
//alert(sampleFolder.Name)
                            if(sampleFolder.Name.indexOf("test1")>=0)
                            {
                                for(var itmCount = 1; itmCount <= sampleFolder.Items.Count; itmCount++)
                                {                                    
                                    var itm = sampleFolder.Items.Item(itmCount);
                                    if(!itm.UnRead)
                                        continue;
                                    var sentBy = itm.SenderName;
                                    var sentDate = itm.SentOn;
                                    var receivedBy = itm.ReceivedByName;
                                    var receivedDate = itm.ReceivedTime;
                                    var subject = itm.ConversationTopic;
//                                    var contents = itm.Body;

                                    var tbl = document.getElementById("tblContents");
                                    if(tbl)
                                    {
                                     var tr = tbl.insertRow(tbl.rows.length);
//                  tr.onclick(tableClickTest())                                  

                                     if(tbl.rows.length%2 != 0)
                                     tr.className = "alt";

                                     var tdsentBy = tr.insertCell(0);
                                     var tdsentDate = tr.insertCell(1);
                                     var tdreceivedBy = tr.insertCell(2);
                                     var tdreceivedDate = tr.insertCell(3);
                                     var tdsubject = tr.insertCell(4);
//                                     var tdcontents = tr.insertCell(5);        

                                     tdsentBy.innerHTML = sentBy;    
                                     tdsentDate.innerHTML = sentDate;
                                     tdreceivedBy.innerHTML = receivedBy;
                                     tdreceivedDate.innerHTML =    receivedDate;
                                     tdsubject.innerHTML = subject;
//                                     tdcontents.innerHTML = contents;
                                     }
                                   //itm.UnRead = false;    
                                 }
                                break;    
                            }
                        }
                        break;
                      }
                    }
                return;
            }    

function groupFunction()
{
PopulateTable()
RowSelection()
}


</script>

</body>
</html> 

The thing that I am now looking for and is unable to do is how do I add a checkbox in the first column in each row. Also upon checking this checkbox the entire row should get highlighted so that I can perform specific task on all the selected items.




Aucun commentaire:

Enregistrer un commentaire