CODEWITHSUNDEEP
phpjquery
Charlie
Charlie

Reputation: 147

Open modal when redirected only

Before, I had a view called "book-edit/[ID]" to edit a book but now I added the form to edit the book in the book details page. I have a button to edit in the list of books page and I want it to go to the book page and open de edit modal on click. This is what I have rn:

View: Books (datatable list with this buttons for each):

<a href="<?php setURL(); ?>./book/<?php echo $autor->fields["id"]; ?>" class="btn btn-sm btn-clean btn-icon btn-icon-md" title="View Book">
            <i class="fas fa-eye"></i>                       
        </a>
        <a href="<?php setURL(); ?>./copy-add/<?php echo $autor->fields["id"]; ?>" class="btn btn-sm btn-clean btn-icon btn-icon-md" title="Add Copy">                          
            <i class="fas fa-plus"></i>                       
        </a>
        <a href="<?php setURL(); ?>./book-edit/<?php echo $autor->fields["id"]; ?>" class="btn btn-sm btn-clean btn-icon btn-icon-md" title="Edit Book">                          
            <i class="fas fa-edit"></i>                       
        </a>

View: Book/[ID] (I have modals with id "#editBookModal" and "#addCopyModal")

When you click on the books list to edit the book or add the copy, I want it to go to book/[ID] and automatically open the intended modal. But only when buttons clicked, if you go to Book/[ID] to view the book, it shouldn't open the modals automatically. That's why I can't just open it with jquery in the book/[ID] page...

Any idea of how I can do this?

Thanks!

Upvotes: 0

Views: 44

Answers (1)

charlietfl
charlietfl

Reputation: 171669

One approach would be add hashes to the url in the links like:

<a href="<?php .... ?>#edit-book">....</a>

Then on the other page check the url hash and if it matches a modal then open that modal

const modalHashes = {
    '#edit-book':'#editBookModal',
    '#copy-book' : '#addCopyModal'
}

let hash = window.location.hash;

// inside document.ready and after modal script has loaded
if(hash && modalHashes[hash]){
   const modalSelector = modalHashes[hash];
   $(modalSelector).yourModalShowMethod()
}

You could even remove the hash when the modal gets closed so if user refreshes the page it won't pop up again

// in modal close event handler
window.location.hash =''

Upvotes: 1

Related Questions