Modal does not run javascript

Question

Here a print of the functionality before using the modal, worked perfectly, both the autocomplete of the cities and the function of tracing the routes: http://imgur.com/a/Z9ZbP

But when using a modal the autocomplete does not work and consequently does not trace the routes: http://imgur.com/a/f8UDH

Here the modal code

    <div id="cadastrarOferecer" class="modal">
        <div class="modal-content">
            <div class="row">
                <div class="card-todo-modal col s12 m3 l3">
                    <h5 align="center" class="txt-oferecer header">Oferecer Carona</h5>
                        <form name="form" method="post" onblur="return validacao();" action="carona/oferecer_carona.php">
                            <div class="input-field col s12">
                                <input id="txtEnderecoPartida" name="txtEnderecoPartida" placeholder="" type="text" class="autocomplete validate" onchange="CalculaDistancia()" onblur="CalculaDistancia()" required="required">
                                <label for="txtEnderecoPartida">De onde vai sair?</label>
                            </div>
                            <div class="input-field col s12">
                                <input id="txtEnderecoChegada" name="txtEnderecoChegada" placeholder="" type="text" class="autocomplete validate" onchange="CalculaDistancia()" onblur="CalculaDistancia()" required="required">
                                <label for="txtEnderecoChegada">Pra onde você vai?</label>
                            </div>
                            <div class="input-field col s12">
                            <input id="data" type="date" class="datepicker" name="data" required="required">
                            <label for="data">Data</label>
                        </div>
                            <input class="btn waves-effect waves-light btn-modal-oferece" type="submit" name="procurar" value="Cadastrar" onchange="Materialize.toast('Cadastrado com sucesso', 4000)">
                            <input class="btn waves-effect waves-light btn-modal-oferece" type="submit" name="fechar" value="Fechar">
                        </form>
                </div>
                    <div style="padding: 0px" class="col s12 m9 l9">
                    <div class="google-maps">
                            <iframe class="z-depth-2" width="600" scrolling="no" height="auto" frameborder="0" id="mapaModal" marginheight="0" marginwidth="0" src="//maps.google.com/maps?output=embed"></iframe>
                    </div>
                </div>
            </div>
        </div>
    </div>

Here below the code before using modal, which as you can check in the first print worked normally:

        <section id="roteiro">
        <div class="container">
            <form class="col s12" name="form" method="post" action="cadastro.php" onblur="return validacao();">
                <div class="row">
                    <div class="col s12 m6 l6">
                        <h4 class="header">Seu roteiro</h4>
                        <div class="input-field col s12">
                            <input id="txtEnderecoPartida" type="text" class="validate" name="txtEnderecoPartida" onchange="CalculaDistancia()" onblur="CalculaDistancia()" required="required">
                            <label for="txtEnderecoPartida">De onde vai sair?</label>
                        </div>
                        <div class="input-field col s12">
                            <input id="txtEnderecoChegada" type="text" class="validate" name="txtEnderecoChegada" onchange="CalculaDistancia()" onblur="CalculaDistancia()" required="required">
                            <label for="txtEnderecoChegada">Pra onde você vai?</label>
                        </div>
                        <div class="input-field col s12">
                            <input id="data" type="date" class="datepicker" name="data" required="required">
                            <label for="data">Data</label>
                        </div>
                        <div align="center">
                            <div class="col s6">
                                <div class="row">
                                    <button class="btn waves-effect waves-light procura" type="submit" name="procurar">
                                        Procurar Carona
                                    </button>
                                </div>
                            </div>
                            <div class="col s6">
                                <button class="btn waves-effect waves-light oferece" type="submit" name="oferecer">
                                    Oferecer Carona
                                </button>
                            </div>
                        </div>
                    </div>
                    <div class="col s12 m6 l6">
                        <div class="google-maps">
                            <iframe width="600" scrolling="no" height="auto" frameborder="0" id="mapa" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?output=embed"></iframe>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </section>