0

I am dynamically generating modals with form that look like described at the bottom. I searched and found How to handle multiple forms in one page but I unfortunately can't find out how I can handle posting one of the form if exactly that one has been clicked/submitted. Any help will be greatly appreciated.

    <td class="actions">
    <a href="#modalForm-1" class="modal-with-form on-default cancel-row">
        <i class="fas fa-edit"></i>
    </a>
    <div id="modalForm-1" class="modal-block modal-block-primary mfp-hide">
        <form method="post" action="/insurances/update">
            <section class="card">
                <header class="card-header">
                    <h2 class="card-title">Modification - Interhyp</h2>
                </header>
                <div class="card-body">
                    <div class="form-row">
                        <div class="form-group col-md-6">
                            <label for="name">Name</label>
                            <input type="text" class="form-control" id="name" value="Interhyp" name="name">
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group col-md-6">
                            <label for="msisdn">MSISDN</label>
                            <input type="text" class="form-control" id="msisdn" value="1234567" name="msisdn">
                        </div>
                        <div class="form-group col-md-6">
                            <label for="email">Email</label>
                            <input type="email" class="form-control" id="email" value="inter-daolwin@gmail.com"
                                   name="email_address">
                        </div>
                    </div>
                </div>
                <footer class="card-footer">
                    <div class="row">
                        <div class="col-md-12 text-right">
                            <input type="hidden" name="search_uuid" value="287b5e62-a434-4e67-9ce0-f24466876114">
                            <button type="submit" class="btn btn-primary modal-confirm">Submit</button>
                            <button class="btn btn-default modal-dismiss">Cancel</button>
                        </div>
                    </div>
                </footer>
            </section>
        </form>
    </div>
</td>
<td class="actions">
    <a href="#modalForm-2" class="modal-with-form on-default cancel-row">
        <i class="fas fa-edit"></i>
    </a>
    <div id="modalForm-1" class="modal-block modal-block-primary mfp-hide">
        <form method="post" action="/insurances/update">
            <section class="card">
                <header class="card-header">
                    <h2 class="card-title">Modification - Interhyp</h2>
                </header>
                <div class="card-body">
                    <div class="form-row">
                        <div class="form-group col-md-6">
                            <label for="name">Name</label>
                            <input type="text" class="form-control" id="name" value="Interhyp" name="name">
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group col-md-6">
                            <label for="msisdn">MSISDN</label>
                            <input type="text" class="form-control" id="msisdn" value="1234567" name="msisdn">
                        </div>
                        <div class="form-group col-md-6">
                            <label for="email">Email</label>
                            <input type="email" class="form-control" id="email" value="inter-daolwin@gmail.com"
                                   name="email_address">
                        </div>
                    </div>
                </div>
                <footer class="card-footer">
                    <div class="row">
                        <div class="col-md-12 text-right">
                            <input type="hidden" name="search_uuid" value="287b5e62-a434-4e67-9ce0-f24466876114">
                            <button type="submit" class="btn btn-primary modal-confirm">Submit</button>
                            <button class="btn btn-default modal-dismiss">Cancel</button>
                        </div>
                    </div>
                </footer>
            </section>
        </form>
    </div>
</td>

The other modals bear the ids "modalForm-3", "modalForm-4" and so on and can randomly be clicked/submitted.

D.

Daniel W.
  • 71
  • 7

0 Answers0