I have an asp.net usercontrol that I’m using to put a bunch of HTML and Jquery logic into to be shared on several pages. This usercontrol has some dropdown boxes loaded from json calls and has no added codebehind logic.
When I use this usercontrol on a normal page it works perfectly fine, and no issues at all.
However, when I wrap the usercontrol in a div, and use a jqueryUI modal dialog, everything in the usercontrol fires twice. Not only code in the initial $(document).ready(function() {});, but also every function is also fired twice when called.
Debugging this in Visual Studio, I see that everything is first being called from the external JS file, and then again from a “script block” file that is somehow getting generated on the fly.
This script block file isn’t getting generated on a page that doesn’t wrap the user control in a modal.
The same happens if I use IISExpress or IIS7.
The question is, why is this script block file getting created, and why is all my jQuery logic firing twice?
–edit–
Here is the div:
<div id="divMyDiv" title="MyDiv">
<uc1:MyUserControl runat="server" ID="MyUsercontrol" />
</div>
Here is the modal logic that uses it:
$("#divMyDiv").dialog({
autoOpen: false,
height: 400,
width: 400,
modal: true,
open: function (type, data) {
$(this).parent().appendTo("form");
}
});
Note: The problm still occurs, even if I remove the “open:” function. But, it does not occur if I remove the entire dialog block, so it is specific to this dialog call.
I was able to determine what was going on.
The link to the external JavaScript file was within the user control itself. Moving this link out of the user control and into the main page fixed it.
For whatever reason, this stopped that dynamic script block file from getting generated, and as a result, also stopped calling every function twice.
I just need to remember to add this JavaScript link to every page that uses this user control, or add it to my master page.
If anyone understands why this happens, I would love to know.