I have the following form text input like this:
<input name="name" type="text" value="test" id="name">
It will not show the value, if I change the name attribute to something else it works. It is hardcoded and there are no javascripts interacting with it.
Update: It works fine in Internet Explorer and Google Chrome, won't work in Firefox.
Update 2: I was able to replicate the problem.
For example, in my localhost I access /blog/login, the input name shows the value test, which is hardcoded, if I delete the value and reload, without submiting anything, then input name will be blank as long as I reload. If I navigate again to /blog/login, the hardcoded value will be show again.
This behavior doesn't happens in IE and Chrome.
I apologize if this was a silly question, but this is really strange, I guess.
Browsers add names and ids of form controls as properties to the FORM. This results in the properties of the form being replaced.
Browsers also may add names and id's of other elements as properties to document, and sometimes to the global object (or an object above the global object in scope). This non-standard behavior can result in replacement of properties on other objects. The problems it causes are discussed in detail.
A problem occurs when a form control's name conflicts with the a property name of the FORM object.
For example:
Simple Unsafe Name Example
<form action="">
<input type="text" name="name">
<input type="submit" name="submit">
</form>
Result
The element with name="name" replaces the value of the FORM's name property. A similar type of conflict happens with the FORM's submit method and the element with name="submit'. Which will win?
In most cases, the form control wins and the FORM's property is replaced to have the value of the form control, or, if more than one form control has that name, the FORM's property is replaced with a NodeList containing those form controls.
However, in some cases, the FORM's property is not replaced to have the value of the form control with the same name. The examples in this page show that the result depends on the browser, the property, and how the control is added.
http://jibbering.com/faq/names/
Related
We are aware that the autofocus-attribute works only on Page Load & Reload Page.
Use-case:
I have 2-input fields in a form and the first input field has the autofocus-attribute and when the form initially loads the field has the focus [expected behavior].
Now, I click on the second input field and simply close this form.
I launch the form again (cached form comes up) - the focus persists on the second field - I want a workaround/solution where the focus remains in the first field even for a cached form in html.
A sample code
<input type="text" #myInput id="first" autofocus>
<input type="text" id="second" >
Is there a workaround for cached form to bring focus to the first input element every time?
I have tried the .focus() on the element under ngAfterViewInit() alongside have tried explicitly called the method right after the first input field (which would only work if there is only one input field in a form, because the focus doesn't move to the other field), (i.e.)
<input type=text" #myInput id="first> {{ myInput.focus() }}
I read about value attributes documentation here. It does not clearly mention why is it required for the input tag.
According to the documentation
"value attribute specifies the value of an element" what exactly does it mean by "value"?
Is it a just for humans to know what exactly a checkbox is for?
Or does the value has anything to do with the backend database?
Is the value attribute just for front end purpose only?
I know this question has been asked previously, but not all aspects of what a "value attribute" is were discussed. So I would like to raise the question again, and have another discussion about it.
Is it a just for humans to know what exactly a checkbox is for?Does value attribute is just for frontend purpose only?
The value property sets or returns the value of the value attribute of a checkbox/radiobutton.
For checkboxes and radiobuttons, the contents of the value property do not appear in
the user interface. The value property only has meaning when
submitting a form. If a checkbox/radiobuttons is in checked state when the form is
submitted, the name of the checkbox/radiobuttons is sent with along with the value
of the value property (if the checkbox/radiobuttons is not checked, no information
is sent).
For example, when you are using <input type="button" name="foo" value="Click"/>, this will assign name 'Click' to your button. Same goes for text field: <input name="subject" type="text" value="Default text" /> will show you a text field with 'Defaul text' in it.
Value is where the actual value of the field is stored. Try changing it with jQuery or even with firebug and you will see that the submitted value will be changed!
Given <input type="checkbox" name="foo" value="bar"> the submitted data for the checkbox will be foo=bar if the form it is inside is submitted and the checkbox is successful (the main additional criteria for which is that it is checked). The server side form handler can then use that information.
The value is not exposed to the user of the browser (unless they use a developer tool of some kind). That is the job of the <label> element.
I am using the the "GET" method in a form on my website. For some reason it is passing the value of the submit button to the url. Why is this happening? What am I doing wrong?
Form:
<form method="GET" action="searcht1.php">
<input type="text" name="search"/>
<input type="submit" name="submit">
</form>
Url:
searcht1.php?search=colin+pacelli&submit=Submit
It's supposed to happen. If you don't want that, do not define name attribute on the button. You probably want value instead, to show the user what the button is for.
Also, this question has nothing to do with PHP; it is purely about HTML semantics.
The reason is that the name attribute makes the submit button a “successful control” (in HTML 4.01 terminology) when it is used for form submission. This causes the name=value pair from it to be included in the form data.
Note that in your case, this data is name=foo where foo is the browser-dependent default value of the button. It could be submit, or it could be Lähetä kysely, or something exotic. You can, and normally should, use the value attribute to set this value, since it determines the text displayed in the button. It’s usually not desirable to have a submit button on your English-language appear with e.g. some text in Japanese just because a Japanese-language browser is being used.
So as others have written, the solution (if this is a problem) is to remove the name attribute. But since the value attribute should normally be used, you can make two changes simultaneously by just replacing the attribute name name by the name value, though you might also capitalize the word shown:
<input type="submit" value="Submit">
Try to remove name attribute from submit input
remove the name attribute of the button.....
I have an input field that is filled in from a previous form(so the input is set to disabled on the second page) and we receive null for the value then. This works:
<input type="text" class="boxtpl" name="${field.name}" value="${user?.email}">
but this doesn't:
<input type="text" class="boxtpl" name="${field.name}" value="${user?.email}" disabled="disabled">
Is there a reason why this seems to break the framework?
Disabled controls shouldn't actually be submitted with the form, so what you're seeing is in fact normal behaviour. According to the HTML form specification:
When set, the disabled attribute has the following effects on an element:
Disabled controls do not receive focus.
Disabled controls are skipped in tabbing navigation.
Disabled controls cannot be successful.
The definition of successful can be found in the same document. It's a bit nonsensical to suggest that Play is broken because of this.
If you want to have a form field that user cannot edit while it should still be sent along when the form is submitted, you can use the read-only attribute, or use JavaScript to disallow user input.
Update: as pointed out in the comments, the following points may also offer a solution:
It's possible that Play still keeps the disabled control's form values in the request object, and just doesn't bind them (so you could retrieve them from the request if needed)
Use a hidden field to keep the form value in case you still want to submit the value, but do not want the user(s) to see the control
I want to reset the value of a web page using JavaScript reset() function. Which operation is the JavaScript performing first: the reset or a clear? And what is the difference in between the two?
Also, how can I retrieve a value using reset function?
Clear vs. Reset
Clearing a form makes all input fields blank, unchecks checkboxes, deselects multi-select choices, and so forth; whereas, resetting a form reverts all changes.
For example:
<input type="text" name="name" value="Timothy" />
<input type="reset" value="Reset" />
This produces an input field with a value of Timothy. Let's say the user then changes the value to Berners-Lee. If the user clicks the Reset button, the value of Berners-Lee will revert (reset) to Timothy.
Clearing the fields would involve changing the value attribute of the input field to the empty string, as follows:
<input type="text" name="name" value="" />
You can change the value attribute using JavaScript.
Retrieve Value
If you want to get (or set) the value for a field, using JavaScript, try reading these:
http://www.irt.org/script/162.htm
http://www.javascript-coder.com/javascript-form/javascript-get-form.htm
http://www.quirksmode.org/js/forms.html
The reset function does the same as if you had an input type="reset" in the form and clicked it.
It will reset the values in all fields in the form to the value they had when the page loaded.
If you have a textbox like this:
<input type="text" name="info" value="Hejsan" />
calling the reset function will put the value "Hejsan" back in the textbox.
If you haven't specified a value (or not selected an option in a select field), it's reset to an empty value (or for a select field the first option).
The reset function can't be used to retrieve any values.
Edit: I modified my original answer to this thanks to Dave's comment. It looks like he also posted an answer while I modified my answer so he deserves the "accepted" answer.
Resetting a form resets the original values of all fields in a form. If there was no value it will clear the field, if there was a value it will "reset" the field back to that value.
When you clear a form, you would essentially by removing ALL values from the form. There is no "clear form" function in JavaScript, so you would have to go through each field and clear them manually.
So to answer your question, you just want to "reset" the form using the reset() function, not clear the form.