Sending variable to a bootstrap modal

I have seen this asked before but a lot of the answers I found where people looking to get a variable into a modal to query a database. However thats not what I want. I just want to send a variable into s modal.

Here is my button the activated the bootstrap modal

<button class="btn btn-primary btn-xs" data-toggle="modal" data-target="#myModalNorm" data-id="<?php echo "$issueid";?>">Add New Followup</a>

Then I have a modal code as below. I want the value from data-id to show in the text box named caseid

    <!-- Modal -->
<div class="modal fade" id="myModalNorm" tabindex="-1" role="dialog" 
     aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <!-- Modal Header -->
            <div class="modal-header">
                <button type="button" class="close" 
                       <span aria-hidden="true">&times;</span>
                       <span class="sr-only">Close</span>
                <h4 class="modal-title" id="myModalLabel">
                    Modal title

            <!-- Modal Body -->
            <div class="modal-body">
                <form role="form" method="POST" action="./view_customer?cid=<?php echo "$cid";?>">
                  <input type="text" id="casenoteid" name="caseid" />
                  <div class="form-group">
                    <label for="exampleInputEmail1">The Issue</label>
                      <input type="text" class="form-control" name="issuenote" id="issuenote"/>
                  <input type="submit" class="btn btn-default" value="SAVE NOTE" name="savenote">


            <!-- Modal Footer -->
            <div class="modal-footer">
                <button type="button" class="btn btn-default"
                <button type="button" class="btn btn-primary">
                    Save changes

then I have the jquery

             $('#myModal').on('', function (e) {
                   var rowid = $(e.relatedTarget).data('casenoteid');

Magento Asked by Jayreis on February 19, 2021

1 Answers

One Answer

This should do:

var $j = jQuery.noConflict(); // you didn't mention any conflicts, though, this would probably be the next issue since you most likely will conflict with the prototype lib

  $j('button[data-toggle="modal"]').click('', function (e) { // or simply give your button an id to refer to it, i.e. $j('#theButtonId')
    var rowid = $j(this).data('id'); // get the value - .data('id') for " data-id='' ", .data('target') for " data-target='' "
    $j("#casenoteid").val(rowid); // set the value

Answered by Christoph Farnleitner on February 19, 2021

Add your own answers!

Related Questions

How to place sizes in order

1  Asked on December 7, 2020 by stefaniiia


Magento 2.4 disable UI/Theme part

0  Asked on December 7, 2020 by bogdan-hepting


Add same product to quote as a separate item in Magento 2

1  Asked on December 1, 2020 by chirag-dodia


Ask a Question

Get help from others!

© 2021 All rights reserved.