Question 37039 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

Making data passed to modal usable for further code execution by concatenating to <embed> src string – Jquery

I am passing a dynamic string of data to booststrap modal using data-val in an HTML table.

<td <button type="button" class="btn btn-success btn-xs" data-val="<?php echo $row['order_id']; ?>" data-toggle="modal" data-target="#my-modal" data-order-id ="<?php echo $row['order_id']; ?>">Update</button></td>

I then have a script which submits the data using class(I don’t have to use class here) to the modal.

<script>
    $('#my-modal').on('show.bs.modal', function (event) {
      var myVal = $(event.relatedTarget).data('val');
      //$(this).find("#modal-body").text(myVal);
      $(this).find(".modal-body").text(myVal);
      //$(this).find("<h6></h6>").text(myVal);
      //$( "p" ).find( "span" ).text(myVal);
    });
</script/

The modal then displays the string within the class statement as it should.

<div class="modal-body">

I need to then be able to concatenate the contents of the "class" string into an HTML embed statement within the modal, that then displays a pdf file. I do not know how to "extract" the class "string information" so that I may concatenate it within the src statement. I have tried using h6, p and span options instead of class to no avail.
So, the embed code in the modal should look something like:

<embed
                src="https://www.xx-xxxxx.com/image/waybill/ICE000??CLASS STRING??.pdf"
                type="application/pdf"
                frameBorder="0"
                scrolling="auto"
                height="70%"
                width="150%"
            ></embed>

As you may see, I have very limited knowledge of JS and JQuery, so any guidance is greatly appreciated.

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    In case this could help anybody with a similar problem in the future. By targeting the embed element and the src attribute as advised, this code worked for me.

    <script>
    $('#editModal').on('show.bs.modal', function (event) {
      var myVal = $(event.relatedTarget).data('val');
      $(this).find('embed').attr("src",myVal);
    });
</script/

    The concatenated string was created in the data-val within the Button statement.


  2. 0

    You have the value that you want to dynamically insert into the embed URL in myVal already.

    So the next step would be the select the embed element inside your modal (find), and then setting its scr attribute to a different value, using .attr(), https://api.jquery.com/attr/

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search