Fullcalendar modal button click runs more times - php

Question

I have a problem with button click in modal (using FullCalendar).
My plan is:
Click on event
Modal appears with 3 options
Confirm changes a value in mysql database / Refuse changes a value in mysql database
When I try one time is works very well. But when I close the modal and open an other i click on the refuse/confirm button then it runs more times (2, 4 ...).
What is the problem??
modal:
<div id="eventContent" title="Event Details" style="display:none;">
Name: <span id="name"></span><br>
Start: <span id="startTime"></span><br>
End: <span id="endTime"></span><br><br>
<p id="eventInfo"></p>
<button id="confirm_button" type="button">Confirm</button>
<button id="refuse_button" type="button">Refuse</button>
<button type="close_button">Close</button>
</div>
eventRender:
<script>
$(document).ready(function () {
$('#calendar').fullCalendar({
header: {
left: '',
center: 'prev title next',
right: ''
},
events: "http://localhost/calendar_directory/calendar_db_connect.php",
eventRender: function (event, element) {
element.click(function () {
var start = $.fullCalendar.formatDate(event.start, "YYYY-MM-DD");
var end = $.fullCalendar.formatDate(event.end, "YYYY-MM-DD");
$("#name").html(event.title);
$("#startTime").html(start);
$("#endTime").html(end);
$("#eventContent").dialog({modal: true, title: event.title, width: 350});
$("#refuse_button").click(function ()
{
var id = event._id;
var confirmed_number = 2;
var decision = confirm("Do you really want to refuse that?");
if (decision)
{
$.ajax({
url: "http://localhost/calendar_directory/confirm_events.php",
data: '&id=' + id + '&confirmed_number=' + confirmed_number,
type: "POST",
success: function (json)
{
console.log(id);
return;
}
});
}
});
$("#confirm_button").click(function ()
{
var id = event._id;
var confirmed_number = 1;
var decision = confirm("Do you really want to confirm that?");
if (decision)
{
$.ajax({
url: "http://localhost/calendar_directory/confirm_events.php",
data: '&id=' + id + '&confirmed_number=' + confirmed_number,
type: "POST",
success: function (json) {
console.log("confirmed");
return;
}
});
}
})
});
},
});
});
</script>
Database structure here:
confirmed column can be: 0,1 or 2

Answer 1

Assigned the same handler to the click event.
The solution is:
$("#refuse_button").unbind("click").click(function(){
/*Your code goes here*/
}
$("#confirm_button").unbind("click").click(function(){
/*Your code goes here*/
}