ASP.net JQuery: Div in a dialog
<p>I am trying to create an email share thing for a website. In the master page I have a link for which I have a jquery click event firing. In the click event, a div in master page is opened in jquery dialog. The div has some textboxes for email, sender name and message thing. Then it includes two buttons: one foe sending email and other one for cancelling. </p>

<p>Hyperlink in Master page</p>

<pre><code>&lt;a href="#" id="dialog_link" &gt;
    &lt;asp:Image ID="imgSendEmail" runat="server"  ImageUrl="~/images/icons/email.gif" AlternateText="Email"/&gt;
&lt;/a&gt;
</code></pre>

<p>Jquery code: it includes the click event for the above hyperlink wherein the dialog is opened.</p>

<pre><code>$(document).ready(function () {

    var dlg = $("#dialog").dialog({

        modal: true,
        draggable: true,
        resizable: true,
        show: 'Transfer',
        hide: 'Transfer',
        width: 550,
        title: 'Send Email',
        autoOpen: false,
        minHeight: 10,
        minwidth: 10,
        closeText: 'X',
        closeOnEscape: true,
        overlay: {
        backgroundColor: '#000',
        opacity: 0.65
    },

    });

    dlg.parent().appendTo(jQuery("form:first"));

    $("#dialog_link").click(function () {

        $("#dialog").dialog("open");
        var pgTitle = $(document)[0].title;
        $("span[id*='lblPageTitle']").text(pgTitle);
        var pgURL = window.location.pathname;
        $("span[id*='lblPageUrl']").text(pgURL);


    });

    $("#btnSend").click(function () {

        alert("In btn Email Send");
        $("#dialog").dialog("close");

    });

    $("#form1 input[name=btnSend]").click(function () {

        alert("In btn Email Send click 2");
        $("#dialog").dialog("close");

    });

});
</code></pre>

<p>Here is the div from master page which is opened in jquery dialog:</p>

<pre><code>&lt;div id="dialog" style="text-align: left; background-color: white;"&gt;
    &lt;h2&gt;Share this with your friends&lt;/h2&gt;
    &lt;hr style="width: 98%" /&gt;
    &lt;table width="98%"&gt;
        &lt;tr&gt;
            &lt;td colspan="2"&gt;
                Title:
                &lt;asp:Label ID="lblPageTitle" runat="server" CssClass="blue"&gt;&lt;/asp:Label&gt;&lt;br /&gt;
                Url:&amp;nbsp;&amp;nbsp;
                &lt;asp:Label ID="lblPageUrl" runat="server" CssClass="blue"&gt;&lt;/asp:Label&gt;
                &lt;asp:Label ID="lblTest" runat="server" BackColor="ActiveBorder"&gt;&lt;/asp:Label&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td colspan="2"&gt;
                &lt;hr /&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td width="15%"&gt;
                &lt;asp:Label ID="NameLabel" runat="server" AssociatedControlID="txtName" Text="Your Name" /&gt;
            &lt;/td&gt;
            &lt;td width="*"&gt;
                &lt;asp:TextBox ID="txtName" runat="server" TabIndex="1" Width="70%" /&gt;
                &lt;asp:RequiredFieldValidator ID="NameRequired" runat="server" Display="Dynamic" ControlToValidate="txtName" ErrorMessage="Name is required." ToolTip="Name is required." ValidationGroup="SendEmail"&gt;*&lt;/asp:RequiredFieldValidator&gt;
                &lt;br /&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td&gt;
                &lt;asp:Label ID="EmailLabel" runat="server" AssociatedControlID="txtEmail" Text="Email To"&gt;&lt;/asp:Label&gt;
            &lt;/td&gt;
            &lt;td&gt;
                &lt;asp:TextBox ID="txtEmail" runat="server" TabIndex="2" Width="70%"&gt;&lt;/asp:TextBox&gt;
                &lt;asp:RequiredFieldValidator ID="EmailRequired" runat="server" Display="Dynamic" ControlToValidate="txtEmail" ErrorMessage="Email is required." ToolTip="Email is required." ValidationGroup="SendEmail"&gt;*&lt;/asp:RequiredFieldValidator&gt;
                &lt;asp:RegularExpressionValidator ID="regexEmail" runat="server" ControlToValidate="txtEmail" CssClass="red" Display="Dynamic" ErrorMessage="Please enter a valid email address" ValidationGroup="SendEmail" ValidationExpression="^(([A-Za-z0-9]+_+)|([A-Za-z0-9]+\-+)|([A-Za-z0-9]+\.+)|([A-Za-z0-9]+\++))*[A-Za-z0-9]+@((\w+\-+)|(\w+\.))*\w{1,63}\.[a-zA-Z]{2,6}$"&gt;&lt;/asp:RegularExpressionValidator&gt;
                &lt;br /&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td&gt;
                &lt;asp:Label ID="MessageLabel" runat="server" AssociatedControlID="txtMessage" Text="Message"&gt;&lt;/asp:Label&gt;
            &lt;/td&gt;
            &lt;td&gt;
                &lt;asp:TextBox ID="txtMessage" runat="server" TabIndex="3" TextMode="MultiLine" Columns="6" Rows="6" Width="98%" Font-Size="Small" Text="Check this out!" /&gt;
                &lt;asp:RequiredFieldValidator ID="MessageRequired" runat="server" Display="Dynamic" ControlToValidate="txtMessage" ErrorMessage="Message is required." ToolTip="Message is required." ValidationGroup="SendEmail"&gt;*&lt;/asp:RequiredFieldValidator&gt;&lt;br /&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td colspan="2"&gt;
                &lt;asp:Button ID="btnSend" runat="server" Text="Send" ValidationGroup="SendEmail" CausesValidation="true" TabIndex="4" OnClick="btnSend_Click" /&gt;
                &lt;asp:Button ID="btnCancel" runat="server" Text="Cancel" TabIndex="5" OnClick="btnCancel_Click" /&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td colspan="2"&gt;
                &lt;asp:Label ID="lblError" runat="server"&gt;&lt;/asp:Label&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
    &lt;/table&gt;
&lt;/div&gt;
</code></pre>

<p>Here is the code behind event for email send button from the dialog:</p>

<pre><code>protected void btnSend_Click(object sender, EventArgs e)
{
    string _nameSender = txtName.Text;
    string _emailTo = txtEmail.Text;
    string _messageText = txtMessage.Text;
    string _automessage = string.Empty;

    MailMessage message = new MailMessage();
    message.From = new MailAddress("abbc@mycompany.com");
    message.To.Add(new MailAddress(_emailTo));
    message.Subject = _nameSender + " recommends " + Page.Title;

    _automessage = _nameSender + " has recommended this web page for your viewing.\n";
    _automessage += HttpContext.Current.Request.Url.AbsoluteUri;
    _automessage += "\n\n-------------------------------------------------------------------\n";
    _automessage += _nameSender + " said:\n";
    _automessage += _messageText;


    message.Body = _automessage;

    try
    {
        SmtpClient client = new SmtpClient();
        client.Send(message);
    }
    catch(SmtpException smptEx)
    {
      lblError.Text = smptEx.Message;
      txtEmail.Focus();
    }
}
</code></pre>

<p>The problem is in case an invalid email (e.g. xyz@xyz.com )is entered, which passes the validation, an exception is thrown. Before this exception is displayed to the user, the dialog window closes. If the hyperlink is clicked again, the dialog opens the div and all the previous data is still in the textboxes and the exception is displayed in the error label. 
So I want to keep the dialog window open and display the exception in the error label in the first place. Moreoever, on exiting the dialog, I want the div textboxes to be cleared so that next time the user opens the email hyperlink, there is no data in the textboxes.</p>

<p>One more strange thing that i noticed was that I have client side event for the email send button in jquery, which should fire after server side event for the same button completes. Hwoever it never fires.</p>

<pre><code>$("#btnSend").click(function () {

    alert("In btn Email Send");
    $("#dialog").dialog("close");

});

$("#form1 input[name=btnSend]").click(function () {

    alert("In btn Email Send click 2");
    $("#dialog").dialog("close");

});
</code></pre>

<p>None of these events fire ...</p>

<p>Any help will be appreciated.</p>
