Tool tip showing but is invisible
Shane-01 opened this issue · 3 comments
Shane-01 commented
I'm trying to use your jquery validation to display my error messages in the tool tip, the problem i have is that the tool tip is invisible please check the image I attached.
Any help would be greatly appreciated
This is the code I have in my view.
ViewData["Title"] = "About";
}
@viewdata["Title"]
@viewdata["Message"]
Use this area to provide additional information.
Tooltip on right
Test
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.bundle.min.js" integrity="sha384-3ziFidFTgxJXHMDttyPJKDuTlmxJlwbSkojudK/CkRqKDOmeSbN6KLrGdrBQnT2n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.17.0/dist/jquery.validate.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.17.0/dist/additional-methods.min.js"></script>
<script src="~/lib/jquery-validate-bootstrap-tooltip/jquery-validate.bootstrap-tooltip.js"></script>
<script>
//
$(function () {
$('[data-toggle="tooltip"]').tooltip();
});
var validator = $("#Form").validate({
rules: {
FromAddress: { required: true }
},
messages: {
FromAddress: "Please Fill In this feild"
},
tooltip_options: {
FromAddress: { trigger: 'hover focus', placement: 'right' }
},
});
</script>
</div>
<input type="submit" value="Test"/>
Thrilleratplay commented
Shane-01 commented
@Thrilleratplay I Fixed the issue , I had different versions of bootstrap in my solution, so i made sure all references of bootstrap are 3.3.7 and it seems to be working fine now.
Thrilleratplay commented
Bootstrap made a few changes around v3.3.x that caused issues with this plugin. Glad you fixed the issue.