Jump to content

Opening one Bootstrap Modal from another Not Working


Go to solution Solved by requinix,

Recommended Posts

Hi guys,

Not sure where this one should be posted but will post here. Please move to appropriate if needed.

I am trying to open a new modal by clicking a link inside another one. It doesn't seem to want to play ball and the open modal just closes.

Can anyone give me a punch bag or maybe just point me in the right direction?

The button:

<button type="button" id="viewcharterBtn" data-bs-toggle="modal" data-bs-target="#viewcharterModal<?php echo $row['id']; ?>" data-bs-dismiss="modal" class="btn btn-primary">View</button>

The modal I want to open:

<div tabindex="-1" class="modal" id="viewcharterModal<?php echo $row['id']; ?>" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header"><h4><i class="fa fa-map-marker fa-fw"></i><?php echo $row['charter_name']; ?></h4></div>
      <div class="modal-body">
	  <h3><?php echo $row['charter_name']; ?></h3>
	  <p>Leaving at <?php echo $row['dep_date']; ?></p>
	  <p>Customer's name is <?php echo $row['customer_name']; ?> and their contact number is <?php echo $row['customer_number']; ?>.</p>
	  <p>The vehicle for this trip is <?php echo $row['fleet_number']; ?></p>
	  </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-danger" data-bs-dismiss="modal"><i class="fa fa-ban"></i> <?php echo lang('CLOSE'); ?></button>
      </div>
    </div>
  </div>
</div>

Any help would be appreciated.

5 minutes ago, requinix said:

Been a while since I've done Bootstrap... Have you tried configuring it to open the other modal without closing the current one?

Yeah gave that a crack. Still same. Closes original one and doesn't open the new one.

8 minutes ago, requinix said:

Have you already compared what you have with their example of how to do two modals? Which worked for me...

Sure have. Same result. Closes first one but doesn't open the second one. 

7 minutes ago, requinix said:

Does their example work for you? Because if their example works then there's something different...

Doing exactly what they are doing in the example. Yet, their example works. How stupid is that?

  • Solution

Shot in the dark, but you don't happen to be reusing that second modal's ID for anything else on the page, are you?

Can you take the same (partial) markup, stick it into something like JSFiddle, and get it to work?

1 minute ago, requinix said:

Shot in the dark, but you don't happen to be reusing that second modal's ID for anything else on the page, are you?

Can you take the same (partial) markup, stick it into something like JSFiddle, and get it to work?

That could be the issue. I have a table setup on index.php and when I click View it opens that modal no issues. If I open the View All modal and click on View, it's where the thing uses a toilet.

I begin to ask myself why I decided to save space by using modals instead of separate files for each section.

 

21 minutes ago, requinix said:

Shot in the dark, but you don't happen to be reusing that second modal's ID for anything else on the page, are you?

Can you take the same (partial) markup, stick it into something like JSFiddle, and get it to work?

Changing the ID of the modal I want to open from the other modal works. So with that plan we shall go.

Thanks mate. Love your work.

Posted (edited)

Ok, that created a new issue. It opens the modal but only for one of the entries.

<button class="btn btn-primary" data-bs-target="#viewCharter<?php echo $row['id']; ?>" data-bs-toggle="modal">View</button>
<div tabindex="-1" class="modal fade" id="viewCharter<?php echo $row['id']; ?>" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header"><h4><i class="fa fa-map-marker fa-fw"></i><?php echo $row['charter_name']; ?></h4></div>
      <div class="modal-body">
	  <h3><?php echo $row['charter_name']; ?></h3>
	  <p>Leaving at <?php echo $row['dep_date']; ?></p>
	  <p>Customer's name is <?php echo $row['customer_name']; ?> and their contact number is <?php echo $row['customer_number']; ?>.</p>
	  <p>The vehicle for this trip is <?php echo $row['fleet_number']; ?></p>
	  </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-danger" data-bs-dismiss="modal"><i class="fa fa-ban"></i> <?php echo lang('CLOSE'); ?></button>
      </div>
    </div>
  </div>
</div>

No idea why but yeah.

Edited by Moorcam

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.