Getting qTip to work
Part of qTip forum discussion at http://craigsworks.com/projects/forums/thread-trouble-getting-started-with-qtip
by eventide
HTML
<script src="http://craigsworks.com/projects/qtip2/packages/1.0.0-rc3/jquery.qtip-1.0.0-rc3.js"></script>
<form id="addClassesToDoc" action="" style="margin-top: 50px;">
<select type="select" id="docsList" name="docsList">
<option id="defaultDocsListItem" value="0">Select a Document...</option>
<option value="38">Channel Sales Process</option>
<option value="35">Generic Annotation Format</option>
<option value="46">Riva CRM Integration Server Guide</option>
</select>
<input type="submit" id="submitAddClassesToDoc" name="submitAddClassesToDoc" class="docAdminFormSubmit" value="Add Checked Classes to Selected Document" />
</form>
JavaScript
$(function() {
/*
* Detect which button/link was clicked and call the appropriate function
*/
var buttonClicked;
$('.docAdminFormSubmit').click(function() {
buttonClicked = $(this).attr('name');
//alert('buttonClicked: ' + buttonClicked);
if (buttonClicked == 'submitUploadDocAddClasses') {
ValidateFileUploadForm();
} else if (buttonClicked == 'submitAddClassesToDoc') {
AddClassesToDoc();
return false;
} else if (buttonClicked == 'submitRemoveDocs') {
// Confirm that the user wants to delete the selected doc(s)
$('#confirmDeleteDocDialog').dialog('open');
return false;
} else if (buttonClicked == 'submitRemoveClasses') {
RemoveClasses();
return false;
} else if (buttonClicked == 'submitEditDoc') {
EditDoc();
return false;
} else if ($(this).text() == 'Edit') {
OpenEditDialog($(this));
return false;
}
}); // End submit button function call
/*
* Define the qtip
*/
$('#docsList').qtip({
prerender: true,
content: 'Please select a document.',
show: false,
position: {
corner: {
target: 'topLeft',
tooltip: 'bottomMiddle'
}
},
style: {
width: 225,
padding: 5,
background: '#FFCCCC',
color: '#FF0000',
textAlign: 'center',
border: {
width: 1,
radius: 2,
color: '#FF0000'
},
}
});
/*
* Add Class(es) to a Document
*/
function AddClassesToDoc() {
// Reset the qtip
$('#docsList').qtip('api').hide();
// Check if doc selected in dropdown
var selectedDocID = '';
if ($('select#docsList option:selected').val() === '0') {
//...