I'm trying to make a website where you can write and customize a mail then send it. I have a problem where the line breaks from a text-area doesn't preserve. When I send the mail with c#, there are no line breaks (sorry for my bad English, not my first language).
Here's my code:
C#:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Mail;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace Web_Mail_Manager
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button1_Click(object sender, EventArgs e)
{
string YourUsername = "(Just gonna cover my Email)";
string YourPassword = "(Just gonna cover my password)";
string Destination = DestinationAdress.Value;
string YourMessageSubject = MailSubject.Value;
string YourMessageBody = MailBody.Value;
try
{
using (SmtpClient client = new SmtpClient("smtp.gmail.com", 587))
{
client.EnableSsl = true;
client.DeliveryMethod = SmtpDeliveryMethod.Network;
client.UseDefaultCredentials = false;
client.Credentials = new NetworkCredential(YourUsername, YourPassword);
System.Net.Mail.MailMessage msgObj = new System.Net.Mail.MailMessage();
msgObj.To.Add(Destination);
msgObj.From = new MailAddress(YourUsername);
msgObj.Subject = YourMessageSubject;
msgObj.Body = YourMessageBody;
msgObj.IsBodyHtml = true;
client.Send(msgObj);
}
}
catch (Exception)
{
}
}
}
}
ASPX:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="Web_Mail_Manager.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet" />
<style>
body {
background-color: lightgray;
font-family: 'Poppins', sans-serif;
}
.mailPreview {
background-color: white;
position: absolute;
top: 10%;
left: 50%;
transform: translate(-50%);
width: 45vw;
height: fit-content;
padding: 15px;
}
#MailBody {
white-space: pre-wrap;
}
#MailbodyContent {
white-space: pre-line;
}
#MailBody {
white-space: pre-line;
}
</style>
<script>
function changeTo(val) {
document.getElementById("toMail").innerHTML = val;
}
function changeSubject(val) {
document.getElementById("subject").innerHTML = val;
}
function changeBody(val) {
var text = val;
document.getElementById("MailbodyContent").textContent = text;
document.getElementById("MailbodyContent").innerHTML.replace(/\n/g, '<br>\n');
}
</script>
</head>
<body>
<form id="form1" runat="server">
<input id="DestinationAdress" oninput="changeTo(value)" runat="server" type="text" placeholder="Recievers E-mail adress" /><br />
<input id="MailSubject" oninput="changeSubject(value)" runat="server" type="text" placeholder="Subject" /><br />
<textarea id="MailBody" oninput="changeBody(value)" runat="server" cols="40" rows="5" placeholder="Content"></textarea><br />
<br />
<div class="mailPreview" id="mailPreview">
<h3>To: <span id="toMail"></span></h3>
<h3>From: (Just gonna cover my email)</h3>
<br />
<h3>Subject: <span id="subject"></span></h3>
<br />
<h3>Content:</h3>
<h4 runat="server" id="MailbodyContent"></h4>
<asp:HiddenField ID="HiddenField1" runat="server" />
</div>
<asp:Button ID="Button1" runat="server" Text="Send mail!" OnClick="Button1_Click" />
</form>
</body>
</html>
Any help would be greatly appriciated!
Since you are sending HTML E-Mails (msgObj.IsBodyHtml = true;) you need to replace newlines with the <br /> tag.
Replace the line
string YourMessageBody = MailBody.Value;
with
string YourMessageBody = MailBody.Value.Replace(Environment.NewLine, "<br />");
Related
Good Morning
I have a webpage with a button pad on it. It is used at a gas station with bad network so everytime they click on the button to add a number to the textbox it will load forever so I changed the button clicks to javascript.
It works perfectly but now the code behind gets an empty value (Not null) when i retrieve the value from the textbox.
This is my code
The buttons used to add the numbers to the textbox
and the textbox
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="OVKWEBAPP.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link rel="stylesheet" type="text/css" href="mainstyle.css" />
<style type="text/css">
.modal
{
position: fixed;
top: 0;
left: 0;
/*background-color: black;*/
z-index: 99;
opacity: 0.8;
filter: alpha(opacity=80);
-moz-opacity: 0.8;
min-height: 100%;
width: 100%;
}
.loading
{
font-family: Arial;
font-size: 10pt;
border: 5px solid #67CFF5;
width: 200px;
height: 100px;
display: none;
position: fixed;
background-color: White;
z-index: 999;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:TextBox ID="txtRknr" runat="server" CssClass="txtBoxRknr" PlaceHolder="Rekening Nommer" Enabled="False" autocomplete="off" Width="175px"></asp:TextBox>
<input type="button" id="btnPad1" runat="server" value="1" class="buttonsb" onclick="input(this);"/>
<input type="button" id="btnPad2" runat="server" value="2" class="buttonsb" onclick="input(this);"/>
<asp:Button ID="btnMsg1" runat="server" Text="Gaan Voort" CssClass="buttonsa" OnClick="btnMsg1_Click" />
</form>
</body>
<script type="text/javascript">
function input(e) {
document.getElementById("<%=txtRknr.ClientID %>").value = document.getElementById("<%=txtRknr.ClientID %>").value + e.value;
}
</script>
</html>
And this is my code in the code behind file
protected void btnMsg1_Click(object sender, EventArgs e)
{
lblError.Text = "";
//string user = txtRknr.Text;
string user = ((TextBox)FindControl("txtRknr")).Text;
if(user == "")
//if (txtRknr.Text == "")
{
lblError.Text = "ONGELDIGE REKENING NOMMER";
return;
}
}
Basically all this needs to do is add an account number to a textbox from an button pad on the website.
After the account is added they would click on continue button and then the code behind checks if the textbox is empty if it is not empty it connects to database to check if it is valid.
But no matter how many numbers i add to the textbox it is still empty when i access it from code behind.
Enabled="False" means that your input field will have a disabled attribute. Disabled form elements do not get posted in HTML forms, which means that when you access it from the code-behind, it's using the default value of the textbox.
Try ReadOnly="True" instead of Enabled="False" if you don't want the field to be edited by hand.
EDIT
I guess ASP.NET prevents you from reading the value from a ReadOnly=True textbox, to prevent you from doing exactly what you're trying to do. A <asp:HiddenField> creates an <input type="hidden">, which you should be able to write the value and have it posted properly to the codebehind.
In the line
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="OVKWEBAPP.WebForm1" %>
replace in Inherits="OVKWEBAPP.WebForm1" with Inherits="OVKWEBAPP.default"
try this.
Request.Form["by-name-attribute"];
I have implemented some web-page in ASP.NET. I want to add a progress bar to my page. Because the page takes several minutes to load.
I want to put show Progress bar function at the start of Page_Load function. And hide it at the end of the Page_Load function. How can I implement this?
Please give me some advice. Thank you in advance.
<%# Page Language="C#" AutoEventWireup="true" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type="text/javascript" src="Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<style type="text/css">
#loading
{
font-family: Arial;
font-size: 10pt;
border: 5px solid #67CFF5;
width: 220px;
height: 20px;
display: none;
position: fixed;
background-color: White;
z-index: 999;
text-align: center;
line-height: 20px;
}
</style>
<script type="text/javascript">
function ToggleProgressBar() {
var loading = window.jQuery('#loading');
if (loading.is(':visible')) {
loading.hide();
}
else {
var top = Math.max(parseInt($(window).height() / 2 - loading.height() / 2), 0);
var left = Math.max(parseInt($(window).width() / 2 - loading.width() / 2), 0);
loading.css({ top: top, left: left });
loading.show();
}
}
function blahblah(s, e) {
// some blah blah function contents
}
function blahblah2(s, e) {
// some blah blah function contents
}
</script>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
**// TODO: Show Progress Bar**
DelayTime(); // dummy function to delay page load
**// TODO: Hide Progress Bar**
}
protected void DelayTime()
{
txt_delay.InnerText = "";
for (int i = 0; i < 3000; i++)
{
txt_delay.InnerHtml += i.ToString("0000") + ", ";
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<span id="txt_delay" runat="server"></span>
<div id="loading" align="center" runat="server">
Loading...
<%--<img src="/Images/progress-indicator.gif" alt="" />--%>
</div>
</div>
</form>
</body>
</html>
Another way would be to give your css a class. Then put a div as a placeholder where you want the window to show. Give the div an id and assign it's css class the id of your class and set the display attribute to none. Then when you are ready use a bit of jquery to change the display from none to say block. assuming you have done something like div id='myWait' display='none' class='mycssclass'
then jquery along the lines ('#myWait').attr('display','block');
I am displaying a floating feedback form in my website and using JQuery to handle the slide in and out functionality. Following is the code.
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="SlidingWindow.Default" %>
<%# Register TagPrefix="ajax" Namespace="AjaxControlToolkit" Assembly="AjaxControlToolkit"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.js"></script>
<form id="form1" runat="server">
<asp:ScriptManager runat = "server"></asp:ScriptManager>
<div class="feedback-panel">
<asp:UpdatePanel ID="UpdatePanel1" runat = "server">
<ContentTemplate>
<a class="feedback-tab" href="#"></a>
<asp:Panel ID = "panel1" runat = "server">
<table>
<tr style="height:100%;white-space:nowrap;"><td><asp:Label ID="Label1" runat = "server" Text = "Name"></asp:Label></td></tr>
<tr style="height:100%;white-space:nowrap;"><td><asp:TextBox runat = "server" ID = "txtName" CssClass = "feedbacktextbox"></asp:TextBox></td></tr>
<tr style="height:100%;white-space:nowrap;"><td><asp:Label ID="lblEmail" runat = "server" Text = "Email"></asp:Label></td></tr>
<tr style="height:100%;white-space:nowrap;"><td><asp:TextBox runat = "server" ID = "txtEmail" CssClass = "feedbacktextbox"></asp:TextBox></td></tr>
<tr style="height:100%;white-space:nowrap;"><td><asp:Label ID="lblFeedback" runat = "server" Text = "Comments"></asp:Label></td></tr>
<tr style="height:100%;white-space:nowrap;"><td><asp:TextBox runat = "server" ID = "txtFeedback" TextMode="MultiLine" CssClass = "width"></asp:TextBox></td></tr>
<tr style="height:100%;white-space:nowrap;"><td><asp:Button runat = "server"
ID = "btnFeedbackSubmit" Text = "Submit" onclick="btnFeedbackSubmit_Click" />
</td></tr>
</table>
</asp:Panel>
<asp:Panel ID = "panel2" runat = "server"><asp:Label runat = "server" ID = "lblFeedbackMsg"></asp:Label></asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
<script type="text/javascript">
$(document).ready(function () {
var feedbackTab = {
speed: 300,
containerWidth: $('.feedback-panel').outerWidth(),
containerHeight: $('.feedback-panel').outerHeight(),
tabWidth: $('.feedback-tab').outerWidth(),
init: function () {
$('.feedback-panel').css('height', feedbackTab.containerHeight + 'px');
$('a.feedback-tab').click(function (event) {
if ($('.feedback-panel').hasClass('open')) {
$('.feedback-panel')
.animate({ left: '-' + feedbackTab.containerWidth }, feedbackTab.speed)
.removeClass('open');
} else {
$('.feedback-panel')
.animate({ left: '0' }, feedbackTab.speed)
.addClass('open');
}
//event.preventDefault();
});
}
};
feedbackTab.init();
});
</script>
<style type="text/css">
.feedback-panel {
padding:5px;
width: 250px;
background:#C4C4FF;
border: 5 solid #8080FF;
font-family: Arial, Helvetica, Sans-Serif;
font-size: 12px;
color: White;
position:fixed;
top:77px;
left:-261px;
}
.feedback-panel a.feedback-tab {
background: url(/images/feedbackbutton.gif) no-repeat scroll 0 0;
display:block;
height:122px;
left:45px;
bottom:5px;
position:relative;
float:right;
text-indent:-9999px;
width:40px;
outline:none;
}
.feedbackformtable
{
width: 215px;
}
.feedbacklabel
{
font-family: Arial Helvetica Sans-Serif;
font-size: medium;
color: Black;
}
.feedbacktextbox
{
width: 200px;
font-family: Verdana;
font-size: 12px;
border: 1px solid #8080FF;
}
</style>
The form is used to send feedback as an email. As soon as the submit button is clicked, the form is closed. Is there any way to keep the form open after clicking the submit button? I want to display a message on the form instead of closing it. Much appreciate any help.
Thanks.
This code works only with the 2 alerts active in the script block, if you comment the first or the second alert the geocode function doesn't work.
It is a simple asp.net page that try to obtain latitude and longitude from an address, in this case hard coded:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Test.aspx.cs" Inherits="Test" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="/Global/js/jquery-1.8.3.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div style="width: 100%">
<div style="width: 50%; clear: left; float: left; text-align: right;">
Latitudine:
</div>
<div style="width: 50%; float: left; text-align: left;">
<asp:TextBox ID="TxbLatitudine" runat="server" Columns="20" />
<asp:Button ID="BtnFind" runat="server" Text="Cerca cordinate" OnClientClick="javascript: findLocation();" />
</div>
</div>
<div style="width: 100%">
<div style="width: 50%; clear: left; float: left; text-align: right;">
Longitudine:
</div>
<div style="width: 30%; float: left; text-align: left;">
<asp:TextBox ID="TxbLongitudine" runat="server" Columns="20" ></asp:TextBox>
</div>
</div>
</form>
<script type="text/javascript">
function findLocation() {
var geocoder = new google.maps.Geocoder();
alert("before"); //if you remove this doesn't work
geocoder.geocode({ 'address': "Cagliari, Italy" }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
$('#<%= TxbLatitudine.ClientID %>').val("a");
} else {
$('#<%= TxbLongitudine.ClientID %>').val("not OK");
}
});
alert("after"); //if you remove this doesn't work
}
</script>
</body>
</html>
I replaced the asp:Button with html input button:
<input id="Button1" type="button" value="Find..." onclick="javascript: findLocation();" />
the first one caused page postback that interfered with the client script block function.
The idea of the code was to make a separate text box and button so i can create class for each one and make them work like fileupload.
But the javascript runs twice and the fileupload value gets erased.
<style type="text/css">
div.fileinputs
{
position: relative;
}
div.fakefile
{
position: absolute;
top: 0px;
left: 0px;
z-index: 1;
}
input.file
{
visibility:hidden;
}
</style>
<script type="text/javascript" language="javascript">
function uploadFileChange() {
alert("start");
document.getElementById('FileName').value = document.getElementById("FileUpload1").value;
alert("end");
}
</script>
<div class="fileinputs" style="width: 50%;">
<!-- Upload file invisivel-->
<asp:FileUpload ID="FileUpload1" ClientIDMode="Static" class="file" runat="server"
onpropertychange="uploadFileChange();" />
<!-- button e textbox falsas para poder dar syles ao button-->
<div class="fakefile">
<asp:TextBox ID="FileName" CssClass="textbox" ClientIDMode="Static" runat="server" Width="31%" ></asp:TextBox>
<asp:Button ID="FileChooserButton1" CssClass="btnSubmit" runat="server" Text="Procurar..."
ForeColor="White" onClick="document.getElementeByID('FileUpload1').click()" />
</div>
</div>
Whats wrong???
Thanks in advance
little correction to your code,
<asp:Button ID="FileChooserButton1" CssClass="btnSubmit" runat="server" Text="Procurar..." ForeColor="White" onClientClick="document.getElementeByID('FileUpload1').click();return false;" />
writing return false to clickevent will not post back, the reason why you are losing fileuplaod value is because the page is getting post backed.
or else you could try this,
<asp:Button ID="FileChooserButton1" CssClass="btnSubmit" runat="server" Text="Procurar..." ForeColor="White" onClientClick="CallClick();return false;" />
function CallClick(){
document.getElementeByID('FileUpload1').click();
return false;
}