What is the right way of creating and processing a group of related controls on posted forms?
From using ASP.NET MVC I see a standard option is to create a number of inputs and assign the same "name" attribute value to them. Like this:
<input name="OrderOptions" type="checkbox" value="1" />
<input name="OrderOptions" type="checkbox" value="2" />
...
<input name="OrderOptions" type="checkbox" value="N" />
And when processing forms we get all the values in a comma delimited string:
public OrderController
{
public ActionResult (FormCollection form)
{
string selection = form["OrderOptions"];
}
}
Now, is this how it is supposed to be done with any server technology? Does assigning the same name value to inputs break some validation rules or something?
One extra question: If I were to use the built-in HTML helpers, I would get the inputs generated with both "id" and "name" attribute. Like this:
<input id="OrderOptions" name="OrderOptions" type="checkbox" value="1" />
<input id="OrderOptions" name="OrderOptions" type="checkbox" value="2" />
...
<input id="OrderOptions" name="OrderOptions" type="checkbox" value="N" />
But it is clearly invalid to have multiple elements with the same "id" in a document. Still, it works.
If I discard the standard helpers and make my own, do I need to insert the "id" attribute to inputs if I do not really need it (except in some label cases)? Some folks are telling we have to always assign both "id" and "name" attributes to elements because there is some incompatibility with old browsers, and the "name" attribute is deprecated (I know it is only for some other elements). But even if I wanted to, I would have to assign different id/name values for input elements and then I cannot process them as a group. You see my dilemma?
Any advice is greatly appreciated.
a) No. Assigning the same name is definitely valid behaviour -- it's how radio buttons know which group they're a part of (so that others in the same group turn off when you click one, while other groups on the same page are unaffected).
b) Yes, having the same ID is invalid. I have the same problem with the helper apps. It makes the entire page invalid and, for me at least, makes any javascript more difficult.
No, you don't need the ID. But if they exist they should be unique. Furthermore, I don't know about this whole "name being deprecated" thing. How else will forms work? Forms do not submit the ID when POSTing back. See http://www.w3.org/TR/html401/interact/forms.html#edef-INPUT .
If you choose to assign ID, they can be different without affecting group_processing. In fact, I'll generally name them something like "OrderOptions-<%= order.option.id %>".
EDIT:
PS: Use the html validator at http://validator.w3.org/#validate_by_uri+with_options . It'll catch and notify you of things like duplicate IDs or missing IDs. It'll also (if I remember correctly) tell you of deprecated elements/attributes that you use.
James
Related
I am facing an interesting problem: I have a form where I want to insert old values (if the form was submitted before) like this:
<input type="text" :value="oldName" id="name" />
Now the problem is that I can't overwrite the oldName variable like this, so yes, I have the old value in there, but I can't change it anymore. Can you think of a solution? I basically want the value to be in the textfield, but I want the user to be able to change it. Thank you!
Sounds like adding v-once to the input field would solve your problem. V-once means that oldName will be used to render the value once, but after that it will be a normal string literal.
<input type="text" :value="oldName" id="name" v-once/>
In case you want the user to be able to modify the value use v-model instead of v-bind. V-model provides two way binding so when the user writes something in the input field it is reflected in the value.
<input type="text" v-model="oldName" id="name" v-once/>
I have a form within a repeating region that I would like to have two buttons on.
I currently have one button (an image) that submits the form and generates a preview of the record. I would like to add a second button to the same form that performs a different function. I have assigned different names and values to each of the image buttons but how do I retrieve that value and either do a corresponding response.redirect or perform an additional function?
I know in PHP you can use the $_GET["getvar"]; or $_post["getvar"]; but i am using classic asp.
Any help would be greatly appreciated!
example for you
<input type="hidden" name="PageAction" value="" />
<input type="image" name="button1" src="imgage1.jpg" onclick="this.form.PageAction.value='function1';this.form.submit();" />
<input type="image" name="button2" src="imgage2.jpg" onclick="this.form.PageAction.value='function2';this.form.submit();" />
then you can retrive the value of request("PageAction") to seperate diffrent actions,like:
if request("PageAction")="function1" then
call function1()
elseif request("PageAction")="function2" then
call function2()
end if
Request.QueryString("getvar") is the equivalent of $_get and Request.Form("getvar") is the equivalent of $_post.
Where getvar is the name of the button, it will return the value.
I know I can eliminate ID mangling in ASP.NET 4.0, but can I also eliminate name mangling? This looks like the best I can do:
<input name="ctl00$body$txtName" type="text" id="txtName" />
Is that correct?
ASP.NET relies on name mangling to route posted form data to input controls in nested naming containers. The ways to avoid name mangling are:
Don't use nested naming containers such as master pages or user controls. Input controls that are placed directly on an .aspx page will have simple names.
Don't use the standard ASP.NET input controls. Instead, you could:
Put <input type="text" name="name" /> (without runat="server") in the .ascx/.aspx and access its value via Request.Form["name"].
Create a custom server control that does the same.
Ok, so here's the deal. I needed to change the values of form elements dynamically (server side), I need to keep the MasterPage, and I have panels on the page as well. There is no way around it.
What I have done instead, is use server side "yellow tags", and public variables:
HTML:
<input type='hidden' name='x_login' id='x_login' value="<%= x_login %>" />
Code:
Public x_login As String = "some value"
And to access the value after a postback:
Request.Form("x_login")
Thanks to Michael Liu's answer for the very last bit there. I've upvoted his answer just for that reason.
From my page's code-behind I want to access the value of this hidden field. The value is set properly. I confirmed by checking its value.
<div class="hiddenValues">
<input id="HiddenReportId" type="hidden" />
</div>
From my code behind, I'm using the following to access the above input
string id = Request.Form["HiddenReportId"];
When I run the application this line throws a null exception. Any suggestions ? Thanks!
The input needs to be inside of the form tag (which it may be, can't tell from the code snippet). Also, it needs to have a name attribute:
<div class="hiddenValues">
<input id="HiddenReportId" name="HiddenReportId" type="hidden" />
</div>
Its id attribute may be redundant and isn't necessary if you're not using it. But form elements are identified by their name attributes in a POST.
(It feels a bit unintuitive from an ASP.NET perspective to the uninitiated, I know. ASP.NET convention is to identify everything by an ID, but web browsers use name when crafting a POST. And the web browser knows nothing of the server-side technology being used, it follows HTTP standards instead.)
Is there any cons of 2nd method?
Why http://www.webstandards.org/ decided to use 2nd method
Is first method better than first for
screen reader users?
First
<label for="name">Name</label>
<input id="name" />
Second
<label for="n">Name</label>
<input id="n" />
The only 'con' is that the id is non-descriptive. For a page with little content, this wouldn't be a big deal but for a larger page, using a descriptive ID is helpful in development. Too, ID's need to be unique, so the single letter approach would get old at input #26 :p
As a side note, webstandards.org might have run their html through a compression utility that changes their descriptive IDs into single letters to minimize download time. e.g.
Their in-house code is your first example and the compressor spit out your second.
I use this:
<label>
<input>
</label>