Aaranihlus Aaranihlus -4 years ago 84
Javascript Question

Load DIV from another page into bootstrap modal, based on button Data Attribute

I am trying to load a DIV from another page, based on the data attribute of the button clicked. Here is what I have so far:

$('#quick_shop_modal').on('show.bs.modal', function (event)
{
var button = $(event.relatedTarget)
var product = button.data('product')
var modal = $(this)
modal.find('.modal-title').text('Quick Shop ' + product)
$('#quick_modal_body').load('product #prodDescMain')
});


So when the modal is opened, it should use the product data attribute of the button to load the #prodDescMain div of that page.

Data attribute example: Leather_Care_Kit.php

which means the last line should read:
$('#quick_modal_body').load('Leather_Care_Kit.php #prodDescMain')


However nothing shows up. If I hard code the filename it works though?

Answer Source

product is a variable, so you use string concatenation:

$('#quick_modal_body').load(product + ' #prodDescMain')
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download