将数据发送到jquery以模态显示

Question

I have a problem with sending data to modal using jquery I want to show the details when the user clicks on readme this is the html code:

<a id="readMore"  class="george" href="" name="" data-toggle="modal"  data-
target=".bs-example-modal-lg" data-id="(string)<?=$ourExpertiseTitle?>">Read More</a>

and this is script:

 <script>
      $(document).on('click',".george",function(){
           var myourid = $(this).data('id');
           $(".modal-body").val(myourid);
           $('#mymodal').modal('show');
      });
</script>

modal code:

 <div id="mymodal" class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog">
      <div class="modal-dialog modal-lg">
           <div class="modal-content">
                <div class="modal-body">
                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                          <span aria-hidden="true">&times;</span>
                     </button>
                     <div class="col-md-4">
                          <img class="img-fullwidth mt-15" alt="" src="images/team/avatar1.jpg">
                     </div>
                     <div class="col-md-8">
                          <h4 class="text-uppercase text-theme-colored font-weight-600 mt-0" id="bookId"><?=$ourExpertiseTitle?></h4>
                          <h6 class="text-gray font-13 font-weight-400 line-bottom"><?= $ourExpertiseSecondTitle ?></h6>
                          <p><?= $ourExpertiseDescriptionFull ?></p>
                     </div>
                     <div class="clearfix"></div>
                </div>
           </div>
      </div>
 </div>

so how can I send data to modal with different ids.

Answer 1

Use $("#bookId").val(myourid); instead of $(".modal-body").val(myourid);

This will set the ID at your h4 element on the modal.

To show the "Second Title" and "Full Description" you'll need to retrieve the data using AJAX.