Reveal modal failed to open Fondation 6

Question

I'm trying to make a modal reveal for every Edit button just when i clicked onto the Edit button it doesnt open i did as mentionned onto the documentation for Foundation 6 .Here is my code.Please any help.

<ul class="button-group">

i give to every reveal modal an id based on the field id with that i would have different ids and linked every Edit button with its modal

    <li>
        <a class="button tiny" data-open="editModal<?php echo $contact->id ;?>"
           data-contact-id="<?php echo $contact->id;?>">Edit</a>
        <!-- the modal edit start here -->

        <div class="reveal large editmodal" id="editModal<?php echo $contact->id ;?>"
             data-cid="<?php echo $contact->id ;?>" data-reveal>


            <div class="grid-x grid-margin-x">
                <div class="cell large-12"><h1>Edit Contact</h1></div>
            </div>

form of the edit modal

            <form action="#" id="editadress" method="post">
                <div class="grid-x grid-margin-x">
                    <div class="cell large-6">

first name input field

                        <label>First Name
                            <input type="text" name="first_name" placeholder="Enter Your First Name"
                                   value="<?php echo $contact->first_name; ?>">
                        </label>

                    </div>
                    <div class="cell large-6">

last name input field

                        <label>Last Name
                            <input type="text" name="last_name" value="<?php echo $contact->last_name; ?>"
                                   placeholder="Enter Your Last Name">
                        </label>
                    </div>
                </div>

submit button of the form

                <div class="grid-x grid-margin-x">
                    <div class="cell large-12">
                        <input class="button big abutton right small" name="submit" type="submit" value="Submit"/>
                    </div>
                </div>
            </form>

close button of the modal

            <button class="close-button" data-close aria-label="Close modal" type="button">
                <span aria-hidden="true">&times;</span>
            </button>

        </div>
        <!--The modal edit ends here-->
    </li>
    <li>
        <a class="button alert tiny">Delete</a>
    </li>

</ul>