Javascript to over-ride radio button value - javascript

I'm submitting form results to a script that expects to receive certain values from a set of radio buttons. The form page uses the for each button to automatically set the HTML "value" attribute for the button. I have no way to set the value attribute independently.
Is there any way to use Javascript to over-ride the value for that field based on which radio button is selected?

If you remove the NAME property from the radio button and assign it to a hidden field instead, you could hook up and event handler to set the value of the hidden field on the click of the radio button. This way the hidden field gets passed back instead of the radio button.

Keep on input type to checked="checked"
(OR)
One default input to hidden way
(OR)
Set input to checked=true on before submit in javascript

Related

Under what conditions is an input submitted?

When submitting a form, what inputs are submitted?
As an example:
disabled inputs are not submitted...
inputs wihtout a name attribute are not submitted...
I am looking for a more comprehensive/official document which explains what inputs are submitted?
There's a range of conditions.
The control's form owner must be the form being submitted and none of the following are true:
The field element has a datalist element ancestor.
The field element is disabled.
The field element is a button but it is not submitter.
The field element is an input element whose type attribute is in the Checkbox state and whose checkedness is false.
The field element is an input element whose type attribute is in the Radio Button state and whose checkedness is false.
The field element is an object element that is not using a plugin.
and a name must be established.
Details are in the HTML5 spec at 4.10.21.4 Constructing the entry list
As W3 document (https://www.w3.org/TR/html401/interact/forms.html#successful-controls) said:
A successful control is "valid" for submission. Every successful control has its control name paired with its current value as part of the submitted form data set. A successful control must be defined within a FORM element and must have a control name.
However:
Controls that are disabled cannot be successful.
If a form contains more than one submit button, only the activated submit button is
successful.
All "on" checkboxes may be successful.
For radio buttons that share the same value of the name attribute, only the "on" radio
button may be successful.
For menus, the control name is provided by a SELECT element and values are provided by OPTION elements. Only selected options may be successful. When no options are selected, the control is not successful and neither the name nor any values are submitted to the server when the form is submitted.
The current value of a file select is a list of one or more file names. Upon submission of the form, the contents of each file are submitted with the rest of the form data. The file contents are packaged according to the form's content type.
The current value of an object control is determined by the object's implementation.
More details in the document.

How to detect changes in the asp panel through javascript?

I have many controls(like texbox,telerik grid, dropdown and radio button) on one asp panel.Could someone help me in detecting changes in any control of asp panel while clicking submit button.
There might be a better way of doing this, but my suggestion would be:
Create a hidden field that has a default value of "False". This hidden field will tell us if the form has changed or not.
Then assigning any editable control the JavaScript OnChange event.
The OnChange event should call a simple method that sets the value of the hidden field to "True".
For example with jQuery it would be:
function FormChanged() {
$(".hiddenField").val("True");
}
Then when you submit you will be able to access the value of the hidden field to know wether the form has benn changed or not.

How do I make an input/text field mandatory when the radio button assigned to it is checked?

How do I make an input/text field mandatory(required) when the radio button assigned to it is checked/selected?
I need an input field to become mandatory once the corresponding radio button is selected:
Radio Button A Text Field A
Radio Button B Text Field B
Radio Button C Text Field C
So if Radio button A is selected, I need Text Field A to become mandatory. If Radio button B is selected, I need Text Field B to become mandatory and so on.
First, to make things easy import jQuery into your HTML page, you can use the following tag which loads jQuery directly from Google's CDN:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
Then, supposing you're going to use native HTML5 validation and that your form has a name of "form1", your radio button group is named "radio1" and your text input is named "text1", you can use the following Javascript code:
$(function(){
var $form = $('form[name=form1]');
$form.find('input[name=radio1]').click(function(){
$form.find('input[name=text1]').attr('required', true);
});
});
If you're doing validation "by hand" using an event binding on the form's submit event, then you can use instead a boolean control variable (e.g. named "requireInput" and false by default) to determine whether the input field is required or not, and set it to true inside the click event binding above.

How can I exclude HTML form radio button values from being submitted?

I need to submit just one input field value to a cgi script via a web form.
I've added a couple of extra form controls (a check box and radio buttons) which manipulate the input value depending on the states selected.
When the form is submitted, the extra form field values are submitted as well which breaks the cgi script (which I don't have access to). I removed the 'name' attribute from the check boxes so they are not submitted but cannot do this for the radio buttons as it breaks their grouping.
How can I prevent radio button values from being submitted?
You can add a disabled attribute to them in the submit handler, this will prevent them from being serialized, either by jQuery or a normal <form> submission. For example:
$("#myForm").submit(function() {
$(this).find(":radio, :checkbox").attr("disabled", true);
});
Or you can .serialize() only the elements you want, for example:
$.post("myPage.cgi", $("#myForm input[type=text]").serialize());
Make them "unsuccessful". There are several ways to achieve this:
http://www.w3.org/TR/html401/interact/forms.html#h-17.13.2
It is also possible to have two different forms: one that has visible form elements and one that has a hidden input that represents the end result to be submitted. You can either attach onchange handlers to your visible form elements so that they call some JavaScript to update the invisible field, or you can run a function as part of the onsubmit handler to set the invisible value directly before it is submitted.
Here's a jsFiddle demonstrating the second approach (the onsubmit handler): http://jsfiddle.net/gtU4J/

How to get the value of a disabled radio button input field

I have a radio button something like this,
<input type="radio" value="A" name="NodeLevel" />
When not disabled I could get the value of a pretty easily
using, $("input[name=NodeLevel]").click(function () {},
but when the input type is disabled, how can I get the value of a radio button ?
any work arounds ?
As per HTML specification, a form element must be "successful" in order to be sent to the server. Disabled elements are not considered successful (as per the same spec). You can make the element readonly or send it as a hidden form element.
this thread here might shed some light to ur problem
How can I get the form value from a disabled <input> element
Have you tried .val()?
$("input[name=NodeLevel]").val()
// returns 'A'
And you can't bind a click event to a disabled element.
I think when your form field is disabled you can not access its value. Use some hidden field to contain the same value and read from there.

Categories