qTip2 - My test case
by bthorn
HTML
<script src="http://qtip2.com/v/stable/jquery.qtip.js"></script>
<link rel="stylesheet" href="http://qtip2.com/v/stable/jquery.qtip.css">
<div class="tips" title='title test' placeholder="shade" name="shade">Paragraph</div>
<button>
Add more
</button>
<br>
<br>
<div id="divEmpResult" style="margin-left: 15px"></div>
CSS
.tooltiptext {
display: none;
}
.tips {
display: inline-block;
margin: 10px;
}
.nameField:hover {
color: red !important;
background-color: yellow;
}
JavaScript
function addTooltips() {
$('.tips:not([data-hasqtip])').each(function() {
$(this).qtip({
content: {
text: $(this).attr('title') || 'This is the message!'
},
hide: {
fixed: false
},
position: {
corner: {
target: 'topLeft',
tooltip: 'bottomRight'
}
}
});
});
}
$('button').on('click', function() {
$('<div/>', {
class: 'tips',
text: 'Dynamically inserted.'
}).insertBefore(this);
addTooltips();
});
addTooltips();
////////////////
$(document).on('click', '.nameField', function() {
var x = $(this).text();
console.log(x);
var z = $(this).find(".alias").html();
var z = $(this).siblings('.alias').text();
console.log(z);
});
function fillData() {
var data = [{
'Email': '[email protected]',
'LastFirst': 'abcsaker,b',
'FIRST_NAME': 'b',
'INITIALS': 'W ',
'LAST_NAME': 'abcsaker',
'ALIAS_NAME': 'BWabcSAK',
'OFFICE': 'sdfdf ',
'TITLE': 'rrr EQUIPMENT 3',
'DEPARTMENT': 'Construction East',
'EMPLOYEE_NUMBER': '444 '
}, {
'Email': '[email protected]',
'LastFirst': 'stillman,abcter',
'FIRST_NAME': 'abcter',
'INITIALS': 'A ',
'LAST_NAME': 'Streeper',
'ALIAS_NAME': 'HASTREEP',
'OFFICE': 'adfafd ',
'TITLE': 'TRADES HELPER 2ND YEAR',
'DEPARTMENT': 'ee Locating - West',
'EMPLOYEE_NUMBER': '6666 '
}, {
'Email': '[email protected]',
'LastFirst': 'abckele,brad',
'FIRST_NAME': 'brad',
'INITIALS': 'J ',
'LAST_NAME': 'abckele',
'ALIAS_NAME': 'CJabcKEL',
'OFFICE': 'adffg ',
'TITLE': 'DESIGNER d SR - (asfe)',
'DEPARTMENT': 'afe Design A',
'EMPLOYEE_NUMBER': '999 '
}];
writeRegister(data);
}
function writeRegister(allData) {
//console.log(allData);
//$('#matchText').text(allData.length + ' matches.');
var strResult = "<table id='headerTable'...