我想爲網站創建一個電子郵件分享的東西。在母版頁我有一個鏈接,我有一個jQuery點擊事件觸發。在click事件中,主頁中的div在jquery對話框中打開。該div有一些電子郵件,發件人名稱和消息的文本框。然後它包含兩個按鈕:一個發送電子郵件和一個取消郵件。ASP.net JQuery:在對話框中的Div
超鏈接在母版頁
<a href="#" id="dialog_link" >
<asp:Image ID="imgSendEmail" runat="server" ImageUrl="~/images/icons/email.gif" AlternateText="Email"/>
</a>
jQuery代碼:它包括上述的超鏈接,其中被打開的對話框中單擊事件。
$(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");
});
});
下面是從母版頁中的div這是在jQuery的對話框打開:
<div id="dialog" style="text-align: left; background-color: white;">
<h2>Share this with your friends</h2>
<hr style="width: 98%" />
<table width="98%">
<tr>
<td colspan="2">
Title:
<asp:Label ID="lblPageTitle" runat="server" CssClass="blue"></asp:Label><br />
Url:
<asp:Label ID="lblPageUrl" runat="server" CssClass="blue"></asp:Label>
<asp:Label ID="lblTest" runat="server" BackColor="ActiveBorder"></asp:Label>
</td>
</tr>
<tr>
<td colspan="2">
<hr />
</td>
</tr>
<tr>
<td width="15%">
<asp:Label ID="NameLabel" runat="server" AssociatedControlID="txtName" Text="Your Name" />
</td>
<td width="*">
<asp:TextBox ID="txtName" runat="server" TabIndex="1" Width="70%" />
<asp:RequiredFieldValidator ID="NameRequired" runat="server" Display="Dynamic" ControlToValidate="txtName" ErrorMessage="Name is required." ToolTip="Name is required." ValidationGroup="SendEmail">*</asp:RequiredFieldValidator>
<br />
</td>
</tr>
<tr>
<td>
<asp:Label ID="EmailLabel" runat="server" AssociatedControlID="txtEmail" Text="Email To"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtEmail" runat="server" TabIndex="2" Width="70%"></asp:TextBox>
<asp:RequiredFieldValidator ID="EmailRequired" runat="server" Display="Dynamic" ControlToValidate="txtEmail" ErrorMessage="Email is required." ToolTip="Email is required." ValidationGroup="SendEmail">*</asp:RequiredFieldValidator>
<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][email protected]((\w+\-+)|(\w+\.))*\w{1,63}\.[a-zA-Z]{2,6}$"></asp:RegularExpressionValidator>
<br />
</td>
</tr>
<tr>
<td>
<asp:Label ID="MessageLabel" runat="server" AssociatedControlID="txtMessage" Text="Message"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtMessage" runat="server" TabIndex="3" TextMode="MultiLine" Columns="6" Rows="6" Width="98%" Font-Size="Small" Text="Check this out!" />
<asp:RequiredFieldValidator ID="MessageRequired" runat="server" Display="Dynamic" ControlToValidate="txtMessage" ErrorMessage="Message is required." ToolTip="Message is required." ValidationGroup="SendEmail">*</asp:RequiredFieldValidator><br />
</td>
</tr>
<tr>
<td colspan="2">
<asp:Button ID="btnSend" runat="server" Text="Send" ValidationGroup="SendEmail" CausesValidation="true" TabIndex="4" OnClick="btnSend_Click" />
<asp:Button ID="btnCancel" runat="server" Text="Cancel" TabIndex="5" OnClick="btnCancel_Click" />
</td>
</tr>
<tr>
<td colspan="2">
<asp:Label ID="lblError" runat="server"></asp:Label>
</td>
</tr>
</table>
</div>
這裏是背後事件的代碼的電子郵件從對話框發送按鈕:
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("[email protected]");
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();
}
}
的問題是如果輸入無效的電子郵件(例如[email protected]),通過驗證,則會引發異常。在向用戶顯示此異常之前,對話窗口關閉。如果再次單擊超鏈接,對話框將打開div,並且所有先前的數據仍在文本框中,並且異常顯示在錯誤標籤中。 所以我想保持對話窗口打開並在錯誤標籤中首先顯示異常。更重要的是,在退出對話框時,我希望清除div文本框,以便下次用戶打開電子郵件超鏈接時,文本框中不會有數據。我注意到
一個更奇怪的是,我對jQuery的電子郵件發送按鈕,對於同一按鈕完成應服務器端事件發生火災後的客戶端事件。但它永遠不會燃燒。
$("#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");
});
這些事件引發的無...
任何幫助將不勝感激。
在#3,加一注:如果您使用.NET 4,你可以設置'的ClientIDMode = 「靜態」'的按鈕標識強制留下'btnSend' – ShaneBlake 2011-06-03 18:42:57
@ gbs ..感謝您的建議...我不想使用ajax ...並且我定義了一個服務器端關閉事件...是的,可以定義對話的關閉事件...關於#3 ..didnt不得不打電話給客戶端事件...它與它一起工作...但感謝您的所有建議... – shazia 2011-06-06 17:28:25