Difference between asp controls and html with runat=server atribute - asp.net

Could you explain me the difference between controls and html components with the "runat=server" attribute. What is best practice to use it? Thanks.

<span runat="server" id="myspan"> </span>
maps to the GenericControl class defined in System.Web.UI.HtmlControls. From it's msdn description:
The System.Web.UI.HtmlControls namespace contains classes that allow
you to create HTML server controls on a Web Forms page. HTML server
controls run on the server and map directly to standard HTML tags
supported by most browsers. This allows you to programmatically
control the HTML elements on a Web Forms page.
<asp:Label runat="server" id="asplabel"></asp:Label>
maps to the Label class in System.Web.UI.WebControls. From it's msdn description
The System.Web.UI.WebControls namespace contains classes that allow
you to create Web server controls on a Web page. Web server controls
run on the server and include form controls such as buttons and text
boxes. They also include special-purpose controls such as a calendar.
Because Web server controls run on the server, you can
programmatically control these elements. Although Web server controls
are rendered as HTML, their object model does not necessarily reflect
HTML syntax.
The System.Web.UI.WebControls namespace contains classes that are
rendered as HTML tags, such as the TextBox control and the ListBox
control. The namespace also contains classes that are not rendered on
the Web page, but support data operations, such as the SqlDataSource
and ObjectDataSource classes. Other controls, such as the GridView and
DetailsView controls, support data display and editing. The WebControl
class serves as the base class for many of the classes in the
System.Web.UI.WebControls namespace.
Basically the controls from the WebControl namespace gives you more features where the design aim was to mimic VB6 forms as closely as possible to make the transition (back asnd forth) between winclient and webclient programming seamlessly.
I personally tend to use controls from the WebControls namespace as much as possible and only fallback to the HtmlConttols if I need behavior that is not availbale on a WebControl and not overrideable.
A blog from K. Scot Allen on the same topic

Server controls are tags that are understood by the server.
There are three kinds of server controls:
HTML Server Controls- Traditional HTML tags
Web Server Controls - New ASP.NET tags
Validation Server Controls - For input validation
HTML Server Control:
HTML elements in ASP.NET files are, by default, treated as text. To make these elements programmable, add a runat="server" attribute to the HTML element.
Example:
<form runat="server">
......
</form>
Web Server Controls:
Web server controls are special ASP.NET tags understood by the server.
Like HTML server controls, Web server controls are also created on the server and they require a runat="server" attribute to work. However, Web server controls do not necessarily map to any existing HTML elements and they may represent more complex elements.
Example:
<asp:Button ID="but" runat="server"/>
Validation Server Controls:
Validation server controls are used to validate user-input. If the user-input does not pass validation, it will display an error message to the user.
Example:
<asp:RequiredFieldValidator ID="req1" runat="server" ControlToValidator="TextBox1" ErrorMessage="please enter proper details"/>

Related

When working in Visual Studio, can the ' asp: ' portion of an element be omitted?

Situation: I have been creating webpages in HTML5/CSS3 & Javascript using Sublime 2 text editor for a year, however a college course now requires me to use Asp.Net and Visual Studio 2010. I do not use the designer because I am proficient at doing things by hand, however I find that writing asp: inside every element is time consuming and causes syntax errors when applied to some HTML 5 tags and not others.
Example HTML 5: <button id="btn" type="submit" value="Button"/>
Example Asp.net: <asp:Button ID="Button1" runat="server" Text="Button" />
Question: Can the asp: portion be omitted without effecting anything or is it required for IIS or the C# back-end functionality? What about runat="server" can that be omitted?
Google has come up dry regarding my inquiry, so any help is appreciated.
you simply cannot remove either of the two
but hear me out why, because I have a feeling you are not familiar with ASP and therefor are mistaking the meaning of the asp: and the runat="server" syntax.
first: runat="server"
this property on an element, tells the the compiler that this is actually a server side control
so a <button/> is not the same as an <button runat="server"/>
the first one is pure html, while the second one is a control, which can be bound to on the server side. .Net will give it a clientID (not to be mistaken by the ID you have to give it yourself).
second: asp:
this is a prefix, on certain elements, that tells the compiler these are ASP controls (the default controls given by the ASP.net framework). These include Buttons, TextBoxes, DropDownLists, ...
do not mistake 1 of these with a html element.
an <asp:Button id="myAspButton" runat="server"/>
is not the same as a <button id="myHtmlButton"/>
the first, is a server side control, which can be bound to (see it's runat="server" attribute), and this control renders to the browser as a <input type="submit"/> for example.
you could alter the rendering of the asp.net button class to make it return something entirely differnt if you wish.
and you are also not limited to using asp.net classes.
you can create your own controls, and put them in a custom created library
you could give those your own prefix.
if I created such a custom control, I could register a prefix for it in the web.config file,
and thus I could create a custom button extending from the original one (but with a default label in front...
<myc:CustomButton ID="myButton" Text="myButton" Label="myLabel" runat="server"/>
which could render into:
<label>myLabel</label>
<button ID="*******">myButton</button>
the asterisks are symbolizing the Unique ID it will get from the .net framework
if you want to know more on custom controls, or extending default controls
here is a step by step explanation to create custom controls, or extend from a TextBox control.
it also shows how you add a custom prefix for your controls (in the this case 'cc')
you can find more info here
The runat="server" part is required to tell .NET that it will have to render a button there (which will contain .NET specific ID for processing upon POST). Not too familiar with web forms (I started with MVC), but I would assume that the asp: part is to help distinguish between server controls and standard HTML markup.
Why not try removing it and if it breaks something, then you know it's needed. For instance if the button doesn't show up after removing it, then obviously the .NET markup parser needs it to be there in order to know that it is a place holder for a server control.

ASP control vs HTML control

I'm new to web programming and I've started with ASP.NET 2.0. I would like to know what the differences are when using an HTML control rather than an ASP control, and I'd like to know too how the attribute runat="server" works.
These are the differences between asp.net controls and html controls
HTML server controls :
HTML server controls :are HTML tags understood by the server.
HTML elements in ASP.NET files are, by default, treated as text. To make these elements programmable, add a runat="server" attribute to the HTML element. This attribute indicates that the element should be treated as a server control. The id attribute is added to identify the server control. The id reference can be used to manipulate the server control at run time.
Note: All HTML server controls must be within a < form > tag with the
runat="server" attribute. The runat="server" attribute indicates that
the form should be processed on the server. It also indicates that the
enclosed controls can be accessed by server scripts.
Ex:
< input type="text" id="id1" runat="server" /> It will work.
HtmlTextControl class
< input type="button" id="id2" runat="sever" /> It will not work.
For html button control there is no compatiable version of control class.
corrected one is
< input type="submit" id="id2" runat="server" />
htmlButton class
< input type="reset" id="id2" runat="sever" /> This one will not work.
ASP.NET - Web Server Controls
Web server controls are special ASP.NET tags understood by the server.
Like HTML server controls, Web server controls are also created on the
server and they require a runat="server" attribute to work. However,
Web server controls do not necessarily map to any existing HTML
elements and they may represent more complex elements.
The syntax for creating a Web server control is:
< asp:textbox id="Textbox1" runat="server" />
These are also case insensitive. Here the important thing is to compulsory write runat="server". For HTML controls this is optional.
all HTML < input type="text" /> control's attributes are also available for these asp tagged server controls. Some special attributes are also there which we will discuss on Ajax for special attributes.
The biggest deference in my opinion is that ASP.NET controls are executed on the server, with the resultant HTML sent to the client and that ASP .NET Server Controls can detect the target browser's capabilities and render themselves accordingly.

When isn't runat="server" used in asp.net?

When don't you need to use runat="server" in ASP.NET?
EDIT: Thanks for all the answers, but I was really thinking of runat="server" inside an <asp: tag.
Use the runat=server attribute when you're using ASP.NET controls, and/or you require programmatic access to those controls in your code-behind.
HTML controls don't require this attribute. It's useful if you have any HTML element like <span> <div>, or <table> when you want the ability to access them in code-behind.
<asp:Label runat="server" id="foo" />
<div runat="server" id="bar />
...
foo.Text = "Hello Label";
foo.Attributes["class"] = "baz";
You need to use runat="server" on any control that you want to be parsed as a server control.
Any element with runat="server" will be parsed into a server control in the Page herarchy. Anything else will be handled as plain text, and put in LiteralControl controls in the Page hierarchy.
The exception is elements that aren't real elements, but special tags within another server tag, for example ContentTemplate tags. They don't need a runat="server" because the containing control will parse them.
When you don't want the server side ASP.NET to render a server side variable against us.
Generally speaking you don't use it when you don't need to manipulate the DOM element at the server side e.g. which are only used for layout purposes.
Without runat="server" there would also be no other way to make html controls server side controls. It does look like an odd thing, because you can't do runat="client".
So in summation you can't leave it out on any ASP .Net controls ever and it was probably the easiets and cleanest way to find all server side controls for the developers who created ASP .Net Web forms.
source: http://mikeschinkel.com/blog/whyrunatserverforaspnetpart2/
Tag runat="server" indicates that the code contained within the script block will run on the server (and not on the client). On execution, ASP.NET will create server-side objects that contain this code as well as an instance of the Page class to contain the controls defined inside the page as instances of their given type (System.Web.UI.WebControls.Textbox, for example). This server-side object will be invoked on user request and will execute code in response to events.
Create Control in Runtime
I need one label in runtime that time don't need runat="Server" is not required
Example
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
Label lblNew = new Label();
lblNew.ID ="lblnew";
lblNew.Text ="Test";
}
}
this code create label in runtime at page load event

Can we access the HTML Controls to Server Side in Asp.Net?

Hi could any one help me regarding the accessibility of HTML controls to Server Side ?
You should add runat="server" attribute to your HTML elements to access them at server side.
Have a look at this article:
http://odetocode.com/articles/348.aspx
You can add runat="server" and use controls in System.Web.UI.HtmlControls namespace to access it.

asp.net: difference between runat="server" and server controls

What is the difference in functionality between
<asp:Button id="button1" Text="Click me" runat="server" OnClick="submitEvent" />
and
<input type="button" id="button1" runat="server" value="Click me" />
Does the input with runat="server" attribute has other or limited properties and methods?
Thank you!
The first one creates a System.Web.UI.WebControls.Button while the second one creates a System.Web.UI.HtmlControls.HtmlInputButton.
Both are server controls, but the controls in the WebControls namespace generally has a bit more functionality than the controls in the HtmlControls namespace. Typically they put some data in ViewState to keep track of their state, and they have server side postback events.
Each controls in the HtmlControls namespace correspond exactly to an HTML element, while the controls in the WebControls namespace may be rendered differently depending on what the browser that is requesting the page can support.
The button represented by <asp:Button runat="server".../> will be converted to a web server control with a rich state model and different properties and methods which has more clear representation in real world like Button.Text = "Click Me".
The button represented by <input type="button" runat="server"..../> will be converted to html server control represented by HtmlInputButton; with has limited properties, methods and events. Most of the properties resemble the html equivalents like Button.Value="Click Me".
Note that elements in a markup page are pre-processed/compiled before being used and will be converted to a class representation where every element is represented by a control. You can access server side controls which are identified by the runat="server" tag from the code behind since they will have the correct matching server control(web/html), other static content including an <input type="button.../> tag with out the runat="server" will be represented as a LiteralControl.
The former line is ASP.NET, the latter simple XHTML.
The former gets parsed and interpreted on the server side, after which the HTML code is generated, which pretty much corresponds to your second example. The ASP.NET Button is really little more than light wrapper over th HTML input button functionality, and should be used wherever you need to handle the Click event on the server side (or in the general case any events), and is usually the way to go, since you're letting ASP.NET abstract the idea of a button on your page for you.
functionality of both the controls is same with the difference that first one is .net control and second one is html control that can be made servercontrol by using
runat="server".
and first one is rich in evants and metods thn the second one....
There is no server events associated with such a controls, but you can use it in codebehind to change it's properties.
Your second option won't probably even work. runat="server" will be rendered directly to the HTML output where it will have no functionality and will only break HTML validation.
input is an HTML element which has only HTML properties, and definitely no methods of any kind.

Resources