Question

Any ideas why this doesn’t work?

$('a.uiAjaxModal').click(function (e) {

            e.preventDefault();

            $modalHtml = '<div class="uiModalWrapper"><div class="uiModal"><!--content here--></div></div>';

            $($modalHtml).find('.uiModal').load($(this).attr('href'));

            $('body').append($modalHtml);

        });

<a class="uiAjaxModal" href="/Organisations/New">New</a>

It appends the modal fine but the content isn’t loaded in and I get no errors in the Console!

Also how could I make it so that the modalHtml is ONLY appended to the dom on a click event like I have done in my code BUT make sure that only one instance of it can exist on the screen?

Answer 1

I ended up using .ajax() instead which works fine and has much better options