I have the following code:
With your existing code, if you want to do down the jQuery route you can bind the click()
event like so:
<script type="text/javascript">
$(function() {
$('.btn').click(function(e) {
tinyMCE.triggerSave();
e.preventDefault();
});
});
</script>
This is binding the click event to all elements with the class .btn
. You could use a different selector if you want to be more specific.
The reason your existing code is not working is because the onclick cannot find your function because you defined it inside the jQuery $(document).ready
function.
HTML
<a class="btn btn-primary" id="btnSave">Save changes</a>
Script
$(function(){
$("#btnSave").click(function(){
//Your code for Save changes goes here
});
});
The function should be in the global scope
, if it's in an inner scope it's not accessible to the onclick=...
:
<script type="text/javascript">
function saveChanges () {
tinyMCE.triggerSave();
}
</script>
or with jQuery:
<a class="btn btn-primary"> Save changes</a>
<script type="text/javascript">
$(function(){
$('.btn-primary').click(function(){
tinyMCE.triggerSave();
});
});
</script>
It would be a good idea to give the <a>
an id
like this:
<a id="theAnchor"> Save changes</a>
Then...
$(function(){
$('#theAnchor').click(function(){
tinyMCE.triggerSave();
});
});