Function being executed twice jQuery

Question

I got the following jQuery:

$("#salvar_festa").click(function() {

    var id_cliente = $("#id_cliente").val();
    var id_pacote = $("#id_pacote").val();
    var tipo_reserva = $("#tipo_reserva").val();
    var data_evento = $("#data_evento").val();

    var itens = "";
    $('.checados').each(function(){
        var tmp = this.value.split("|");
        var v = tmp[1],
            result = 0;
        v = v.toFloat();            
        itens += v +";";
    });

    $.ajax({
        url: basePath + 'evento/salvar_festa',
        type: 'POST',
        dataType: 'html',
        data: {
            id_cliente: id_cliente,
            id_pacote: id_pacote,
            tipo_reserva: tipo_reserva,
            itens: itens,
            data_evento: data_evento
        },
    })
    .done(function(ret) {
        console.log("success");
        $('#mensagePage').html(ret);
    })
    .fail(function() {
        console.log("error");
    })
    .always(function() {
        console.log("complete");
    }); 

});

It saves normal in the database, but saves duplicate. I put an Alert in the beginning, like this:

$("#salvar_festa").click(function() {
    alert('teste');

It appears two Alerts, when you click.

Can anyone tell me where the mistake is?

EDIT - JQUERY THAT CALLS PACKAGES

$(".pacote").change(function() {
    var pacote = $(".pacote").val();
    var data = $("#data").val();

    $.ajax({
        url: basePath + 'evento/get_pacotes_item',
        type: 'POST',
        dataType: 'html',
        data: {
            pacote: pacote,
            data: data
        },
    })
    .done(function(ret) {
        console.log("success");
        $('.pacotes_lista_itens').html(ret);
    })
    .fail(function() {
        console.log("error");
    })
    .always(function() {
        console.log("complete");
    });

});

EDIT HTML

<div class="row"> 
    <div class="col-md-12">
        <div class="row">
            <input type="hidden" id="data" name="data" value="<?php echo $_REQUEST['data']; ?>">
            <div class="col-md-6 form-group">
                <label>Selecione o Cliente</label>
                <select class="form-control" id="id_cliente" name="id_cliente">
                    <option value="0">Selcione um Cliente</option>
                    <?php foreach($lista_clientes as $valor){ ?>
                    <option value="<?php echo $valor->id; ?>"><?php echo $valor->nome_responsavel; ?></option>
                    <?php } ?>
                </select>
            </div>
            <div class="col-md-6 form-group">
                <label>Selecione o Pacote</label>
                <select class="form-control pacote" id="id_pacote" name="id_pacote">
                    <option value="0">Selcione um Pacote</option>
                    <?php foreach($lista_pacotes as $valor){ ?>
                    <option value="<?php echo $valor->id; ?>"><?php echo $valor->nome; ?></option>
                    <?php } ?>
                </select>
            </div>
            <div class="col-md-12">
                <div class="pacotes_lista_itens"></div>
            </div>  

            <div class="col-md-12 form-group">
                <br/>
                <button id="salvar_festa" class="btn btn-success">Salvar</button>
                <button onClick="close()" class="btn btn-warning">Cancelar</button>
            </div>
        </div>
    </div>
</div> 

Answer 1

To avoid duplicate events use the following code before assigning the click:

$("#salvar_festa").off("click")

And try to assign the click as follows:

$(document).on("click", "#salvar_festa", clicar);