CODEWITHSUNDEEP
javascriptjquerymodal-dialog
user3189734
user3189734

Reputation: 665

Passing parameters to modal

I'm having problems passing parameters to my modal window. I'd specifically like to pass a button href but nothing seems to appear in my modal.

Can anyone point me in the right direction please?

Javascript

<script>

$(document).ready(function() {
    $('#confirm-delete').on('shown.bs.modal', function(event) {
        $("#roomId").val($(event.relatedTarget).data('id'));
         var roomId = $(e.relatedTarget).data('id');
        $(e.currentTarget).find('input[name="roomId"]').val(roomId);
        $('.url').html('Delete URL: <strong>' + $(this).find('.btn-danger').attr('href') + '</strong>');
    });
});
</script>

Modal

<div class="modal fade" id="confirm-delete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
    <div class="modal-content">

        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Confirm Delete</h4>
        </div>

        <div class="modal-body">
            <p>You are about to delete.  Do you want to proceed?</p>
            <input type="text" name="roomId" value=""/>
            <div class="url"></div>
        </div>

        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
            <a href="#" class="btn btn-danger danger">Delete</a>
        </div>
    </div>
</div>

Link to Modal

<button data-href="/admin/rooms/delete/{{ $room->id }}" data-id="{{ $room->id}}" data-toggle="modal" data-target="#confirm-delete" href="#"  type="button" class="btn btn-danger">Delete</button>

Upvotes: 0

Views: 1873

Answers (1)

tliokos
tliokos

Reputation: 3636

I think this is what you need

$(function(){

    $('#confirm-delete').on('shown.bs.modal', function(e) {

        var button = $(e.relatedTarget);

        // this refers to Modal

        $('input', this).val(button.data('id'));

        $('.url', this).html('Delete URL: <strong>' + button.data('href') + '</strong>');
    });

});

Upvotes: 1

Related Questions