jQuery's val() is not working on a hidden field - javascript

I have a hidden field in my page like so:
<hidden id="tsDaySchedule01" value="7.50"></hidden>
When I try to access it with the following code, the alert returns blank:
alert($("#tsDaySchedule01").val());
Now when I use attr("value") like below, it works without issue:
alert($("#tsDaySchedule01").attr("value"));
Lastly, I would like to point out we have other non-hidden text fields within the page that work without issue using val().
I would like to have a better understanding as for what is going on here. Does anybody have an explanation?

<hidden/> isn't a valid HTML element. If you're wanting a hidden input you'd use:
<input type="hidden" />
jQuery's .val() method only works on input, select and textarea elements. To get this to work for you, change your <hidden/> element to:
<input type="hidden" id="tsDaySchedule01" value="7.50" />

.val() method only works with text-box type of element input and textarea elements.
you should use
<input type='hidden' id="tsDaySchedule01" value="7.50">

Maybe you need to use :
<input type='hidden' id="tsDaySchedule01" value="7.50">

Related

How to Submit a Javascript Value in an Input Field

Simply, how can I do this?
<input type="hidden" value="some javascript value" />
I have a form whereby when a user clicks on Add More, more input fields are added via javascript.
I'm also using javascript-declared values to track and limit the number of fields a user can add.
I need a way for my php code to retrieve these javascript values.
Use append
$('#hidden').val('my Text');
input field should be
<input type="hidden" id="hidden"/>
the question is a bit vague, but i will give it a go
try adding a name as an array and then you can use get or post
<input name="myjavascriptinputs[]" type="hidden" value="some javascript value" />
in your php you will be able to use
foreach($_GET['myjavascriptinputs'] as $ajavascriptinput)
From the button you must be calling a javascript to add these fields dynamically. Simply append the code to that function to hand over these values to the field.
<input id="myinputfield[]" type="hidden" value="" />
<script>
function addOneMore(){
var newField = // code to add one more field
newField.value = newValue;
}
</script>
Will solve your purpose.

Diasable input type number after success Jquery ajax

I have a js function called after dropdown change and create a dynamic rows table and in one column is generated <input type="number">. In some cases this input must be disabled. Something like this:
<input type="number" disabled="true">
obvious this example is illustrative.
Try this.
$(':input[type="number"]').prop('disabled',true);
try it:
$(':input[type="number"]').attr('disabled',true);

Is there a label in HTML

i'm coming from Java background, Is there a label in HTML, where I could using for example javascript update the value.
I mean by label here, something similar like text input, but not not possible to update it, and it looks non-updateable.
You said you wanted something similar to a text input, so... use one, then! Just disable it, like
<input type='text' disabled>
^It's MAGIC!
You don't want label literally in HTML, because it's in no way similar to a text input. Labels in HTML are used for things like putting text in front of radio buttons.
If you wanted something similar to a Java label, you would just use the p tag, unless it would be behind a text input or so, then you would use the label tag.
The obvious to create a label would be using <label>
<label for="coward">Förnamn</label> <!-- points to to input element with id coward -->
<input class="text-input" name="coward" type="text" id="coward" value="whatever" />
But I think you're looking for something to "store a value in a form" that shouldn't be editable. You could use a hidden text input for that.
<input type="hidden" name="hiddenField" value="whatever" />
You could use divs (and style it the way you want it), and then just fetch the html from that div.
Take a look at the other answers as well.
There's a lot of options. What do you actually want to do? It would be easier to give you an answer that suits your needs.
A label is a <label>...
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label
You have a couple of options.
There is actually a <label> element, which is typically used for labeling the items in a form.
You could also do a text input (<input>) and set it to disabled:
<input disabled>
Or you could just use a simple paragraph element <p> and style it how you want.
Here is a JSFiddle with some examples: http://jsfiddle.net/QXP75/
However, you'd want to use something semantic, so knowing what the purpose is would allow a more specific message. Also, with CSS, you can make just about any element look like anything.

Disable input text

for some reason I want to disabled an input text and for this I use this sample code :
$('#id').attr('disabled', 'disabled');
Is there any way to disabled an input text without use attribute disabled of input text, I mean for example use css or other ways?
In fact I want an input text act like a disabled one without change it attribute?
With Best Regards.
Try:
<input id="myTxt" type="text" onfocus="this.blur()"/>
Or by JS:
$('#myTxt').focus(function(){
$(this).blur();
});
You can't do it through CSS (unless you do something very complicated like hide the input and put a disabled-looking rectangle in its place). However, this will disable the input without changing the attribute:
$("#id").prop('disabled', true);
try this
<input type="text" disabled="disabled" value="" />

How to cancel edit/disable cached input (of type text) value?

I have an input of type text, from which I have already entered value 1234
it has been saved in cache as shown below.
The problem here is that, it is extremely frustrating to select the textbox in the next row.
Is there a way to not to display that 12334 (highlighted in the screenshot) from ever being displayed through HTML markup or javascript?
As #John pointed out, on modern browsers you can use the HTML5 valid autocomplete attribute, in your screenshot I see many textboxes, if you want to disable autocompletion on the whole form you can set this attribute directly at the form element:
<form name="form1" id="form1" method="post" autocomplete="off"
action="http://www.example.com/form.action">
[...]
</form>
More info:
How to Turn Off Form Autocompletion
<input type="text" name="input" autocomplete="off" />
To apply this to all input controls, write the code below (using jQuery):
$(document).ready(function () {
$('input[type=text], input[type=password]').attr('autocomplete', 'off');
});

Categories

Resources