Anyone familiar with ASP.NET webforms development is aware of the fact that you can’t have multiple forms presented on the sample page. In general, this is okay. However, most portals or CMS applications have their ASP.NET form and the widget that you would like to add needs that have its own ASP.NET postback processing.
We have created a brief sample using jquery, asp.net, and web services to overcome this issue.
Step One.
Create as standard Default.aspx page and add a reference to jQuery.
Step Two.
Create a <div> that contains your “form element”. Note is not a form.
Step Three
In your code behind create a Web Method.
Step Four
Use jQuery to perform a postback to your web method.
Step Five.
Server-side processing of web data without the use of a ASP.NET form.
ASP.NET form.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Ntegral.Web.NoForms._Default" %>
<!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 src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js" type="text/javascript"></script>
</head>
<body>
<div id="sampleform" class="sampleform">
<span>name:</span><input id="name" class="name" type="text" /><br />
<span>email:</span><input id="email" class="email" type="text" /><br />
<span>comments:</span><textarea id="comments" class="comments" cols="20" rows="3"></textarea><br />
<input id="btn" type="button" value="button" />
</div>
<script type="text/javascript">
$(function () {
alert("hello world");
$("#btn").click(function () {
alert("hello click");
alert($("#name").val());
$.ajax({
type: "POST",
url: "Default.aspx/PostUser",
data: "{name: '" + $("#name").val() + "',email: '" + $("#email").val() + "',comments: '" + $("#comments").val() + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
alert(msg.d);
}
});
});
});
</script>
</body>
</html>
Code Behind.
namespace Ntegral.Web.NoForms
{
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
[WebMethod]
public static string PostUser(string email,string name,string comments)
{
StringBuilder sb = new StringBuilder();
if (!string.IsNullOrEmpty(email))
{
sb.AppendLine("Welcome " + name + ",");
sb.AppendLine("Your email is " + email + ".");
sb.AppendLine("Your comments: "+comments);
return sb.ToString();
//return "Welcome "+name+ " your email address is " + email;
}
else
{
return "false";
}
}
}
}