ASP.net over ride client ID for form elements - asp.net

Given a textbox:
<asp:Textbox runat="server" id="txtAddress1" />
This renders as something similar to:
<input name="ctl00$mainContent$txtAddress1" type="text" id="ctl00_mainContent_txtAddress1" />
I don't think browsers autocomplete features recognise this name/ID as a field they can autofill, they are not standard recognised names.
Is there any way to overide the client ID's so that autocomplete has a better chance of recognising them?

2 Points with this.
1) The "Override the Name" feature was introduced in ASP.Net 4.0, where for any property you can choose a hardcoded name instead of the dynamic name. You need to be careful on this as you don't want 2 objects sharing a name.
2) ASP.Net 2.0 and above (may have been in v1.0) has a property on the control called "AutoCompleteType" which provides a hint to the browser on what sort of information is required in the box.

Assuming you're using Asp.net 4.0, and you're aware of the points mentioned by DJIDave, you can use the ClientIDMode property on a control, and set it to 'Static'. Then, what ever you specify in the Id field in Asp.Net will be brought through to your final markup, and will not be 'mangled' (for want of a better word) by Asp.Net.

Related

client id mode on 2 identical id's

I have an control1.ascx page
and control2.ascx page
both of them have this element:
<asp:TextBox runat="server" ID="txt_name" ClientIDMode="Static"></asp:TextBox>
page.aspx contains both of the controls.
so now the page contains input type text with the id "txt_name" X2.
I am wondering how it is working? can someone explain?
Ideally, you want to use ClientIDMode="Static" only if you are sure that no other control has same name in the page.
For example, you really want to access the ServerControl from external javascript file (althought it is not a good design).
If you are not sure, you want to use Predictable.
As your are using ClientIDMode="Static" thus control's id will be rendered exactly as it is.
ID will be rendered directly. See MSDN docs, this Blog is a good read.
ASP.Net 4+ supports various modes to generate ClientIDs for controls.
Here is a reference for MSDN on ClientID and its' generation modes: http://msdn.microsoft.com/en-us/library/system.web.ui.control.clientid(v=vs.100).aspx
To see how ClientID generation works, you may want to refer to this link :
http://www.codeproject.com/Articles/108887/Client-Ids-Generation-with-ASP-NET-4-0
(It has visual explanations on how the ClientID generation works in different cases)
Hope this helps.

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.

How can I use HTML5 email input type with server-side .NET

As I understand it, the <input type=email> element in HTML5 will render as a simple text field in browsers that do not support the tag. On other browsers it will render properly, like on the iPhone it will bring up the e-mail keyboard layout.
I’d like to use this in a project but my input fields are <asp:TextBox> controls. How can I use the HTML5 element but still access its data server-side like the rest of my fields?
There is an update for .NET framework 4 which allows you to specify the type attribute
http://support.microsoft.com/kb/2468871.
See feature 3 way down the page
Feature 3
New syntax lets you define a
TextBox control that is HTML5
compatible. For example, the following
code defines a TextBox control that is
HTML5 compatible:
<asp:TextBox runat="server" type="some-HTML5-type" />
you can try adding the attributes manually, like:
TextBox1.Attributes["type"] = "email";
TextBox1.Attributes["type"] = "url";
TextBox1.Attributes["type"] = "number";
Sorry I'm a bit late to the party, though I think that others can benefit from what I did. I have a page which is HTML 5 though we still have .NET 3.5. We wanted to keep the .NET element, though have the type change to email. I've tried several methods (including Milox above) to no avail, though the one which worked for me was the following: I added a JavaScript property to the element itself inline (when I put it in a script tag it wouldn't pick up for some reason...)
Here is what your tag would look like if you use my changes:
<asp:TextBox runat="server" type="email" onfocus="this.type='email'"/>
Eli
Whether or not it is accessible as a server control, you should be able to access the HttpRequest.Form collection and retrieve the value. No matter what the browser does with the tag, it has to submit a string to the server.
in your .aspx file add
<input type="text" required autofocus placeholder="Email Address"
class="txt-input txt-input-username" ID="myTextBox" runat="server"/>
in your Code Behind .cs
myTextBox.Attributes["type"] = "email";
This Worked For Me
You need to create your own custom control and override the Render routines. Feel free to use either the source code or DLLs

How to set specific ID for server controls in an ASP.NET Web Form that is using a MasterPage?

Is it possible to set a specific ID on an ASP.NET server control? Everytime I assign an ID and run the web form the ID changes.
For Example:
<asp:TextBox ID="txtName" runat="server"></asp:TextBox>
Gets translated into this:
<input id="ct100_ContentPlaceHolder1_txtName" type="text" />
I think this is do to me using master pages, but if so how can I be sure a control will have a certain ID(for javascript purposes). I placed the auto-generated id in my javascript and it is working, but I would prefer to have used the id's that I originally assigned them. Is this possible?
(This is for version:ASP.NET 3.5)
Starting with .NET 4 you have greater control about how the client-side IDs look like (see this post for details).
To force a specific client-side ID, you have to set the ClientIDMode to static. The following will render an <input> element with id="txtName":
<asp:TextBox ID="txtName" ClientIDMode="static" runat="server"></asp:TextBox>
Although if you do this, you have to ensure that you don't have two controls with identical client-side IDs. Check the article linked above for other options.
This is the way web controls ID's are in .NET prior to version 4.0. Version 4.0 introduces client IDs, which you can read about here.
You can use somthing like this in your JS:
var something = '<%= txtName.ClientID %>';
You can use the Control.ClientID property in your codebehind to get the actual id after it's been added to the control tree.
Super annoying choice made by the asp.net webforms people.

Explicit localization problem

when trying to translate the confirmation message to Norwegian i get the following error:
Cannot have more than one binding on property 'OnClientClick' on 'System.Web.UI.WebControls.LinkButton'. Ensure that this property is not bound through an implicit expression, for example, using meta:resourcekey.
i use Explicit localization in the following manner:
<asp:LinkButton ID="lnkMarkInvoiced" runat="server" OnClick="lnkMarkInvoiced_OnClick"
OnClientClick="<%# Resources: lnkMarkInvoicedResource.OnClientClick%>"
Visible="False" CssClass="stdtext" meta:resourcekey="lnkMarkInvoicedResource" ></asp:LinkButton>
here's the local resource file entry:
<data name="lnkMarkInvoicedResource.OnClientClick" xml:space="preserve">
<value>return confirm('Er du sikker?');</value>
if i remove the meta attribute i get the English text(default).
how do i get the Norwegian text appearing without resorting to using the code behind?
Update:
removing the meta attribute prevents the exception from occurring but the original problem still exists. I can't get the Norwegian text to show.
only the default English text shows.
Another Update:
I know this question is getting old but i still can't get the Norwegian text to display.
If anyone has some tips please post a response.
Looks like you're making the problem harder by inlining the onclick. Why not split it out to a separate line?
<script>
function markInvoiced()
{
return confirm('<%= Resources.SomehowGet.lnkMarkInvoicedResource.OnClientClick%>');
}
</script>
<asp:LinkButton ID="lnkMarkInvoiced" runat="server" OnClick="lnkMarkInvoiced_OnClick"
OnClientClick="return markInvoiced();"
Visible="False" CssClass="stdtext" meta:resourcekey="lnkMarkInvoicedResource" ></asp:LinkButton>
And while we're looking at your code, you realize that you're essentially building an <a> tag, right? As such, why not just build an <a> and save yourself some grief?
And finally, next project why not ditch the built-in ASP.NET localization nighmare in favor of something sane like FairlyLocal, in which case you'd write this:
<a href="#" onclick="return confirm(<%=_"really?"%>) onserverclick="lnkMarkInvoiced_OnClick" runat="server">
<%=_("Mark Invoice")%>
</a>
Are you using the .NET resource manager and satellite assemblies to store your localized resources? It looks like you have hard-coded the alternative language in your markup, rather than storing it in a language-specific resources assembly...
.NET has some extremely rich localization and globalization capabilities. If you use them properly, localization should be a pretty automatic thing (assuming your client is providing their language code as part of the HTTP headers). Even if your client has not configured their browser with the appropriate language, it is still easy enough to manually change the UI culture via a user request (clicking a flag icon, configuring a setting, etc.)
This article might be helpful: ASP.NET Web Page Resources Overview
That meta tag is using implicit localization when you're using explicit localization in the OnClientClick. You will need to choose one method or the other. If you are to use explicit localization, you'll need to do the necessary work to set the proper culture info in your application in the code-behind.

Resources