Will a disabled text field submit when a form is POSTed? - javascript

If I submit a disabled text field via POST, what will the resulting value be on the action page?
For example, I have:
<table border=0 cellpadding=4 cellspacing=0>
<tr><td>
<input type="checkbox" id="chk_$item"
onClick="javascript:handleClick('$item')">
</td><td>
<input type="text" id="txt_$item" name="addresses[]" value="$item">
</td></tr>
<tr><td>
...etc...
</td></tr>
</table>
the handleClick() javascript function checks if chk_$item is checked, if not, it disables the txt_$item text field.
When I submit it, all of the text fields go to an addresses[] array in a PHP script.
But, can I prevent the field from submitting anything if it is disabled? Will it do this by default? If not, how should I change the behavior? (I really don't want to clear the fields when they get disabled).

Disabled inputs will not be submitted with the form; that's part of the defined behavior of disabled, cf. W3C HTML 4.01 Form docs.

If you don't want it changed, make it readonly.

Related

Cant submit my button with form

I am trying to submit my button with a form. Im not trying to make my button submit the form. I want to be able to see my button value in the POST variable after the form submits. From my understanding all I need is to give my element a name and value. I should be able to see all the form variables once my form is submitted.
<input name='MC[]' type='text' size='51' placeholder='Enter In Question'>
<br/>
<input name='MC[]' type='button' value='Incorrect'>
<input name='MC[]' id='Options' size='40' placeholder='Enter In Option A'>
I'm new to this site not sure if I'm providing enough information but I simply want to submit this button inside a form and to be able to add the value of my button to a file. For some reason I cant see the button once the form is submitted. Are type button not sent to POST when submitted?
Note, I am able to see my other input elements. The type button one is the only one I cant see.
You can use Javascript that fills in the value of a hidden input from the value of the button that was clicked.
HTML:
<input type="hidden" name="answer" id="answer">
JS:
document.querySelectorAll("input[name='MC[]']").forEach(function(el) {
el.addEventListener("click", function() {
document.getElementById("answer").value = el.value;
}
}
Then you'll be able to get the button's value in $_POST['answer'].
That's not how buttons work... they perform an action, they don't get included in the post data. What you need is a checkbox, or a disabled input perhaps?

How to put a form inside a table?

I want to ask about how can I put a form with method GET in a table tag.
In the table element I have a text field. When I submit this form it should validate. My validation works fine but this form doesn't actually submit itself, so I can't get any value at the URL.
Below is the code:
<form method="GET" id="my_form">
<table>
<tr>
<td>
<input type="text" name="company" form="my_form">
</td>
<button type="button" form="my_form" onclick="return submitvalidation();">ok</button>
</td>
</tr>
</table>
</form>
Your problem has nothing to do with putting a form in a table.
You just need to have a submit button.
A plain button is designed to hang JS off and nothing else. It won't submit the form.
Use type="submit" not type="button".
You should make sure that your button is in inside a table cell though. You either have an extra </td> or a midding <td>.
There doesn't seem to be any reason to use a table here at all though.
Return true after the validation completed.

Input field with onchange fails to trigger when user click button in another form

I have a page with multiple small forms on it. Each form has one input field that has an onchange function which will submit it's form to a url that returns a no data status.
Things work fine, submitting form after form, until the user clicks on a small form that has ONLY a submit button in it. This click works, but abandons the change in the previous field resulting in its onchange not firing the click at the bottom of the changed function fails (still trying to understand the firebug trace).
What's going on? is there a fix for my structure?
UPDATE:
First I tried simply delaying the action of the submit, but no luck.
I have hidden the and added an <input button> to the chain of "events" so that the focus has a place to come to rest before the real submit tries to happen -- the code below has been updated. So the question now becomes:
Is this as simple as it can be?
Script:
$(function() {
$('input,select').change(changed);
});
function changed(){
...
$(this).parents('form').find(':submit').click();
}
function doSubmit(elt, id)
{
$(elt).focus();
setTimeout(function(){
$(id).click();
}, 400);
}
One of may small forms:
<form class="clean" method="POST" action="QuoteProApp.php">
<input type="submit" value="field" name="btn_update" style="display: none;">
<input type="hidden" value="000242" name="quote_id">
<input type="text" maxlength="15" size="3" value="" name="q[cost][4][1][unit]">
</form>
The offending click goes into this form:
<form class="clean" method="POST" action="QuoteProApp.php">
<input type="hidden" value="000242" name="quote_id">
<input type='button' name='btn_close' value='Close' onclick='doSubmit(this,"#CLOSE");'>
<input id='CLOSE' type='submit' name='btn_close' value='Close' style='display:none;'>
</form>
Might be totally irrelevant, but your selector for the change event includes your submit input too. Can you change it to:
$('input[type="text"],select').change(changed);
to see if anything changes?
The solution turned out to be to create a button tag, set the focus explicitly to a it, and then set a timeout to click the real, but hidden, submit input tag. This allows the change in focus to run the submit associated with it and then continue with the explicit submit of the page.
The question has been updated to show this solution.

ASP.NET Detect if Javascript disabled field

I am hoping there is an answer for this...
Setup:
Pretty complex ASP.NET Application doing a bunch of user interaction, some of which requires that Javascript disables some fields when others are clicked (had to do it in Javascript, b/c the postback issues in ASP.NET made it impossible, so had to it client side).
That code is all well where Javascript does the classic
document.getElementById(currObj).disabled = true;
The problem:
When I am ready to submit the page, how can I make ASP.NET (C#) notice if a field (Textbox or Radio box) has been disabled client side, so it does NOT submit that field in the form?
Is this even possible?
Much thanks in advance!
Any disabled fields don't submit but normal and even hidden ones do. This is how disabled fields work.
<input type="text" name="Test_1" value="off" disabled="disabled" />
<input type="text" name="Test_2" value="on" />
<input type="hidden" name="Hidden_1" value="hide_off" disabled="disabled" />
<input type="hidden" name="Hidden_2" value="hide" />
In the example only Test_2 and Hidden_2 will submit because the others are disabled.
You can see it at work in this jsfiddle: http://jsfiddle.net/bJ7Rq
The only way ASP.NET knows that a control has been disabled is if it was disabled from .NET and the Enabled = false property has been written to ViewState. When you disable a field on the client-side, this isn't the case, so ASP.NET will retain the default Enabled value.
As previous commenters have mentioned, the value of a disabled field will be completely excluded from the POST body sent to the server on postback. In the case of a basic TextBox on a page, that would mean the Text property would revert to String.Empty. To differentiate between an empty string in an enabled field and an actual disabled field, I think you'd need to look directly at the Request.Form object to see if the key exists. For example, if I had a TextBox named myTextBox on a blank page, Request.Form["myTextBox"] would be null for a disabled field. For an enabled field, it'd be whatever string value the field contained, including String.Empty if it were blank. Of course, if the control is in a naming container (e.g., a ContentPlaceholder or something) that messes with the name property on the actual field in HTML, you'd need to use the full HTML name.
So for example:
bool fieldIsEnabled = Request.Form["myTextBox"] == null;
It's not elegant, but it should get the job done (excluding checkboxes, which would also be null if the box wasn't checked).

input type disabled and readonly behave differently with a href

I have below code where i disable and enable a calendar clickable icon.
<p>
<label>
<input type="text" name="date18" id="date18" value="01/01/2012"
style="width:75px;" disabled/>
</label>
<a href="#" onclick="somecaledarrelatedstuff()" name="calid" id="calid">
<img src="icon-Calendar.jpg" alt="Click to pick a date from a popup
calendar"/>
</a>
</p>
When I add disable as above both the input field and the link to the calendar popup are disabled as well. But because the values of disabled elements are not submitted, I thought of making it read-only. However, the problem is that when it's read-only, only the input field is getting read only (not also the calendar pop up link) too, like using disable.
I know if I want to disable (just to prevent the user from editing) both input field and href I can use disabled and have a hidden input variable, and submit it and refer to that variable. But I was looking for an alternative way because I will have a lot of refactoring to do to my code if I introduce a new hidden variable.
Thanks.
If you want the input field to be disabled but still send its value upon submission of the form, you can use bit of JavaScript for that.
To achieve this, first add this bit to the <form> tag:
<form ... onsubmit="EnableInputs(this);">
Then add this JS function:
function EnableInputs(oForm) {
oForm.elements["calid"].disabled = false;
}
You can enable more elements like this, or all inputs using getElementsByTagName and looping over it.
This will just enable the element when submitting thus send its value.
Disabled does not submit values, but read-only does submit values.

Categories

Resources