Accessing HTML custom attributes - html

I want to know is there any way to add a custom attribute to the a
HTML element.
For example ,
<input type="text" name="txtNAME1" displayName="dname1" />
In the above example the custom attribute "displayName" is not a
standard HTML attribute. So I want to know if I can define the same and push the intended value to the server and access the same attribute's value.
Thanks in advance!

Which language are you using? You can do this in C# using
<input type="text" name="txtNAME1" displayName="dname1" runat="server" id="test" />
Then, in the code behind:
test.Attributes["displayName"];
You can also access it in jQuery with
$('test').attr('displayName')
and send it through to the server via a handler.

Related

Custom <form> element with URI Template support

Is there a custom element, which allow the use of RFC6570 URI templates? This is very similar to this question. Here's the sample HTML used there.
<form action="/orders/{id}" method="get">
<input type="text" name="id"/>
<input type="submit" value="Submit"/>
</form>
I'm asking specifically about a Web Component though, so something like either
<form is="templated-form">
or
<templated-form>
It's very simple to create if it doesn't exist yet.
Just register a <template-form> custom element inheriting from HTMLFormElement.prototype, and extending the form element, that will make use of your favorite RFC6570 URI templates compliant JavaScript library.
For example, this one : https://medialize.github.io/URI.js/uri-template.html, or those ones : https://github.com/medialize/URI.js/#uri-template.
You'll have to use the extended notation in order to take advantage of the semantics of the <form> element :
<form is="template-form">

How to set the language of the required fields feedbacks?

I would like to set up the message tip of a required field in html5
<html lang="en">
<input type="email" required="required" />
The message tip keeps on being labeled in french. I don't know which variable cause the browser to choose any language.
Isn't there a way to handle the html5 interaction languages smoothly (without JS)? I expected the langattr to be sufficient...
Had the same problem
Actually, you shoud use JS to achieve that. On another hand, you could recompile your browser from source and change manually texts that are not in your desired language if you absolutely do not want to use JS.
Yes, you should use
setCustomValidity("Votre Custom Mensaje Naturlish");
whithin an oninvalid handler function attached to the input element.
Something like:
<input type="email" oninvalid="handlerToCall(this)" required="required" />
Here you'll find answers that are valid and do work for what you want to do.
Try the jsfiddle live examples and you'll see for yourself :)

How to use html5 form validation properties using struts2 UI tags

I want to use HTML5 form validations like 'required', in struts2 UI tag . I also have checked struts2 core jar file which shows that dynamic attribute is true for s:textbox. but if i use like <S:textbox name="username" required>, it is throwing error.
Please help
Try like this:
<s:textbox name="username" required="required" />
Works perfectly in my case.
You can also use other html5 attributes in a similar way.
eg. placeholder="placeholder value" , etc.
The attributes must have a value. So required will not work but required="" will not cause an issue.
This is the only way I have made it work in IE FF and Chrome
<input type="text" name="u.lName" required value='<s:property value="u.lName"'/>'/>

What is equivalent HTML code for Spring's <form:errors/> tag?

Im using Spring 3.2, Im dynamically adding input elements using jquery, to my Spring form. I want to add the errors also associated with it. But I dont know the equivalent HTML code for <form:errors /> tags. When you use the following Spring tag in JSP page
<form:text path="abc" />
it produces the following HTML while rendering
<input type="text" name="abc" />
What does it produce for the following Spring form errors tag while rendering as HTML?
<form:errors path="abc"/>
Thanks in advance.
Errors are generated either a) with JavaScript, or b) on the server. There is no HTML-only <form:errors />.
It depends how you use the errors tag. With your specific example:
<form:errors path="abc"/>
I believe the resulting HTML will be:
<span id="abc.errors">abc is messed up for some reason</span>
Personally, I use the errors tag like this:
<form:errors path="*" cssClass="error"/>
And my HTML is:
<span id="*.errors" class="error">Title is required</span>
I hope that helps!

HTML Forms & control names

So I was having issues with the form / hidden iframe file upload technique and spent several days trying to figure out why files wouldn't upload until finally figuring out what the issue was.
When I am building the form dynamically, I insert the file input element as a child of the form:
<input type="file" id="file-select-input" />
... and I had something like this:
<form enctype="multipart/form-data" id="file-select-form" target="select-file-iframe" method="POST" action="/upload/">
<div id="file-select-button" class="">
<input type="file" id="file-select-input" />
</div>
</form>
<iframe style="display: none" id="select-file-iframe" src="javascript:false;" name="select-file-iframe"></iframe>
It turns out that when I submit the above form, the input file information was not being sent. The reason for this, is that I didn't have the name attribute specified on the file input element. So when I changed it to this:
<input type="file" id="file-select-input" name="file" />
... things worked.
So why does the name attribute of an file input element need to be set for a file to be uploaded? According to the W3C specs, the name attribute assigns the control name, but what is the control name? Why is it important?
According to the W3C specs, the name attribute assigns the control name, but what is the control name? Why is it important?
The name of the form control controls the key in the key/value pairs that make up the POSTed data or the query string.
Without knowing the name of the control, there's no way to transform it into the data to be sent to the server.