0

I have a button with its id and I want to pass this id to the modal body.how can I pass it to the modal body?

button with id with var=q

<td><button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal2" id="${q.id}">Confirm</button>

modal content

<div class="modal fade" id="myModal2" role="dialog">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">Send an Email</h4>
                </div>
                <div class="modal-body">
                    <g:form action="send">
                     <h4>Email to:</h4><g:textField name="email" placeholder="Enter email" value=""/><br>
                        <h4>Subject:</h4><g:textField name="subject" placeholder="Enter subject"/><br>
                       <h4>Description:</h4><g:textArea name="body" placeholder="Enter body"/><br>
                        <g:submitButton name="send" value="send"/>
                    </g:form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>
</div>
bhansa
  • 7,282
  • 3
  • 30
  • 55
Ashwin Karki
  • 52
  • 1
  • 11

1 Answers1

1

Not sure.. Try this way, Instead of giving Id use data-id to send the value

<td><button type="button" class="btn btn-info btn-lg custom_popup"  data-toggle="modal" data-target="#myModal2" data-id="${q.id}">Confirm</button>

JS 

<script>
    $(document).on("click", ".custom_popup", function () {
         var custom_id= $(this).data('id');
        document.getElementById("tem_id").id = "custom_id";
    });
</script>

In html add ID in your modal-body class

<div class="modal fade" id="myModal2" role="dialog">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">Send an Email</h4>
                </div>
                <div class="modal-body" id='tem_id'>
                    <g:form action="send">
                     <h4>Email to:</h4><g:textField name="email" placeholder="Enter email" value=""/><br>
                        <h4>Subject:</h4><g:textField name="subject" placeholder="Enter subject"/><br>
                       <h4>Description:</h4><g:textArea name="body" placeholder="Enter body"/><br>
                        <g:submitButton name="send" value="send"/>
                    </g:form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>
</div>
Vidya
  • 126
  • 9