When you click on the link - the modal window does not open

Question

I have a project in php. I want to display a modal window (done in Bootstrap 3.1.1), so send email to this link:

$mylink = "<a href = 'http://localhost/index.php?id =". $str. "'data-target =' # myModal 'class ='btn btn-primary 'data-toggle ='modal'>My trial version</a>";
                        $mail -> MsgHTML($mylink), dirname(__FILE__));                  
                        $mail -> AddAddress($email, 'Client');
                        $mail -> Send();

$str - a special id - business requirement.

Modal Window (Bootrstrap):

<div class="modal fade" id="myModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
                <h4 class="modal-title">Title</h4>
            </div>

            <div class="modal-body">
                <h3>Overflowing text to show scroll behavior</h3>

                <p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.<br />

                Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.<br />

                Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.<br />

                Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.<br />

                Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.<br />

                Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.<br />

                Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.<br />

                Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.<br />

                Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
            </div>

            <div class="modal-footer">
                <a href="#" id="clk" class="btn" data-dismiss="modal">Cancel</a>
                <a href="#" class="btn btn-primary">OK</a>
            </div>
        </div>
    </div>
</div>

After reading the email - not open my modal window. Do I send the link of the bad attributes?

Answer 1

If you want to open a modal window and call a url as well, you need to do one thing at a time with javascript.

$("#linkId").on("click",function(e) {
    e.preventDefault(); // to prevent the default link action

    $('#myModal').modal('show', 'test'); //open modal

    var url = $(this).attr('href');

    $.ajax({
      url: url,
    }).done(function(data) {
      console.log(data);
    });
    return false;
});

Here is a demo: http://jsfiddle.net/SL4Tg/2/

Answer 2

To the link add an ID or unique class:

$mylink = "<a href = 'http://localhost/index.php?id =". $str. "'data-target =' # myModal 'class ='btn btn-primary 'data-toggle ='modal' id="linkId">My trial version</a>";

then in your click handler

$("#linkId").on("click",function(e) {
     e.preventDefault(); // to prevent the default link action
     $('#myModal').modal('show');
});