Masterpage and Masterpage in jQuery UI Dialog giving same ID

StackOverflow https://stackoverflow.com/questions/20678265

Question

Background:

I have a main Masterpage that I use on all the pages of my website, certain pages in the website launch jQuery UI modal dialogs that in turn load other webforms that have their own special Modal MasterPage.

Directory Structure:

/
/templates/Main.master
/templates/Modal.master
/htmlmodals/popup.aspx
/main.aspx

The Problem: there appear to be two problems. Firstly when I complete any action within the Modal Masterpage that causes a postback, the (popup.aspx) page attempts to try and look within the directory of the file that called the modal, so I end up with an error like

Description: HTTP 404. The resource you are looking for ...blah blah blah...
Requested URL: /popup.aspx

Another issue that I have just found, is that the generated source code form main.aspx shows that I have two form fields with exactly the same ID, even though I specified the Modal to have a different one.

<form name="aspnetForm" method="post" action="main.aspx" id="aspnetForm">
...
</form>
<div id="modal-holder">
    <form name="aspnetForm" method="post" action="popup.aspx" id="aspnetForm">
    ...
    </form>
</div>

Query:

Do I need to specify a <html><head></head><body>... etc in the Modal.master file? I ask because the pages load exactly how I want them to (including processing of code behind), with the exception of postbacks, just using the following code:

Modal.master

<%@ Master Language="VB" AutoEventWireup="false" CodeBehind="modal.master.vb" Inherits="--REMOVED IDENTIFIER--.Web.Site.modal" %>
    <form id="modalForm" runat="server">
    <div>
        <div class="alert-box" id="error-area--modal">
            <p></p>
            <div class="error-content"></div>
            <div class="error-synopsis"></div>
            <div class="validity-summary-container">
                <ul></ul>
            </div>
        </div>
        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">

        </asp:ContentPlaceHolder>
    </div>
    <script>
        initialiseEvents();
    </script>
    </form>

A typical modal would be launched using the following jQuery code

$('#<%= btnPopup.ClientID %>').click(function(e){
    e.preventDefault(); 
    dHeight = ($(window).height()) * 0.95;
    baseDialog.dialog('option',{title:'Edit', width:'95%', height:dHeight, open:function (e, ui) {$('#modal-holder').load('/htmlmodals/popup.aspx');}}).dialog('open');
});

Update : Adding the relevant html/head/body tags to the modal master does NOT fix the postback/duplicate ID issue

Update 2 : Added an update panel around the part of the popup.aspx that posts back, doesn't appear to have worked either, still trying to do a normal postback to /popup.aspx

Was it helpful?

Solution

This SO question when-i-load-an-aspx-page-using-jquery appears to be very similar to my own question, so the answer looks like i'll have to write a javascript method to update my page instead of posting back.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top