Question

Okay, so I’ve been looking for an answer for this for a couple of hours now and found nothing that works.

I have a page that I load inside a div after a .click event, so that looks like this:

$('#mybutton').click( function () { $('#mydiv').load('myinnerpage.aspx'); });

Then I have inside myinnerpage.js I have:

$(document).on('change', 'input[name=rbfileByNameOrID]:radio', function () {
if ($('input#rbByFileName').attr('checked'))
    fileSelectionBy('filename');
else
    fileSelectionBy('fileid'); 
});

the change function never gets fired, unless I open myinnerpage.aspx by itself.

Answer 1

Can you put your myinnerpage.js code in your main javascript, instead of in your included page ?

If you can’t, i’ve not the “good-solution”, but this can help you : jQueryMobile-Navigation had the same problem when they loaded page with ajax, and they used a non-jquery solution to solve that. In their $.ajax->success, they use innerHTML :

[...]

//workaround to allow scripts to execute when included in page divs
all.get( 0 ).innerHTML = html;

[...]

You can see their full code here.

It works with script-tag AND inline-javascript included in page divs.