Retrieved unmasking value from inputmask masking value - javascript

I use input inputmask on my form input, this is code that make mask on my form
$('input[name="jumlah"]').inputmask("decimal", {
groupSeparator: ".",
autoGroup: true
});
then i need to get the value from the input with this way
var checkVal = $('input[name="jumlah"]').val();
i keep get mask value,
Ex:
on the input field when input number i can see 33.333 value on my field. then i need retrieved only 33333
how to get unmask value from input?

InputMask has a property that might help you: 'removeMaskOnSubmit'
Just set it as true and you should be good.
Something like this:
Inputmask.extendDefaults({
'removeMaskOnSubmit': true
});
found here (external link)

Related

Reset particular input filed

I want to reset only a specific input field and display the placeholder on an event but not able to do, there are other methods such as initializing the input field with empty string but it do not display the placeholder as well as it is also a value which I don't want. I want to reset it with null value. How to do it?
it was quite easy, I got confused with empty value and spaces. You only have to do is give your input field some id, and create a button to click and reset the value. in the js, store the value in some variable and just initialize it with empty value when you click the button.
const input = document.getElementById("input-value");
const button = document.getElementById("btn");
button.addEventListener("click",()=>{
input.value = ""; //donot use this input.value=" ", use input.value=""
});

How to change hidden field to true when someone enter text in another field

I'm working with django templates... want to do something like this in JS:
If someone entered a text to textbox (id=super_text), I want to automatically change a boolean field hiddenInput (id=super_boolean) value to True.
I'm totally new in JS, was learning django backend for few months but I got my first project and one task is to do something like this in JS.
Can you help please? I will be thankfull (;
In HTML, <input>s can't be of type boolean, but the code below sets the text value of the hidden input to 'true'. (Even though I use the boolean value true, JS converts it to the string "true" when storing it in 'value', since the DOM knows that the input can only have a string as a value.)
<input type="text" id="super_text">
<input type="hidden" id="super_boolean">
<script>
document.getElementById('super_text').addEventListener('keypress', function(){
document.getElementById('super_boolean').value = true;
})
</script>

Reset validation for Paper Input?

I have a paper-input element like this:
<paper-input id="inputForValidation" required label="this input is manually validated" pattern="[a-zA-Z]*" error-message="letters only!"></paper-input>
<button onclick="validate()">Validate!</button>
When I validate the input and the validation fails it looks like this:
Without changing the input I want to programmatically reset the validation state such that it looks like before:
How can I reset the validation state to get the unvalidated view without changing the input?
Just set the invalid attribute of the paper-input element to false, e.g.
this.$.inputForValidation.invalid = false;
In your case you want the empty value is valid so you just have to remove the require attribute...
In more complicated case I think you want to do something like this :
Polymer({
is: "my-element",
validate: function(){
if(this.$.inputForValidation.value == ""){
//When the input is empty we want
this.$.inputForValidation.removeAttribute("required");
this.$.inputForValidation.validate();
this.$.inputForValidation.setAttribute("required", true);
}
}
});

Get input value from HTML5 input[type="date"] in chrome

In chrome, a tag like
<input id="picker" type="date">
renders as a text field. However, calling trying to get its value with something like
$("#picker").val()
returns nothing until a valid date is entered or picked from it's dropdown.
I took a look at all of the object's immediate properties on a keypress with
$("#picker").keypress(function() {
var output = ""
for (var i in this) {
output += i +" value:"+ this[i] + "\n";
}
alert(output);
});​
but couldn't see my input in any of these. Check for yourself at http://jsfiddle.net/5cN2q/
My question is: Is it possible to get the text from a input[type="date"] in chrome when the input is not a valid date?
The W3C Date State spec defines the sanitization algorithm:
The value sanitization algorithm is as follows: If the value of the element is not a valid date string, then set it to the empty string instead.
Which is invoked whenever setting the value of the input element, as defined in DOM input value spec:
On getting, it must return the current value of the element. On setting, it must set the element's value to the new value, set the
element's dirty value flag to true, invoke the value sanitization
algorithm, if the element's type attribute's current state defines
one, and then, if the element has a text entry cursor position, should
move the text entry cursor position to the end of the text field,
unselecting any selected text and resetting the selection direction to
none.
So the value property will always be an empty string when the date is not valid. There doesn't seem to be any property for "original/dirty/user-typed text value" specified as it is not a text input after all.
IMO it is a good thing, it facilitates form validation as invalid dates are treated as falsy values (empty strings), it also leaves browsers to more freely implement the UI for date inputs.
If you prefer a non-W3C date input, you can use a text input with the good old JS date validation and a datepicker, such as the jQuery UI datepicker. This would allow you to retrieve the actual text value of the input and is a much more cross-browser solution as well.
As the other answer you can't see the original value, you can however handle validation with ValidityState
<script type="text/javascript">
function submitform()
{
var inputdate = document.getElementById("inputdate")
// check if date is valid.
// you can use `inputdate.validity.valid` too.
if(inputdate.validity.badInput) {
// error message from the browser
document.getElementById("message").innerHTML = inputdate.validationMessage
}
//document.myform.submit();
}
</script>
<div>message: </div><div id="message" style="color: red; font-weight:bold;"></div>
<form method=post action="./post">
<input type="date" id="inputdate" value="2016-02-29">
get date!
</form>
If you change the day to 30 and click the link, you'll see an error message.
Enjoy it.

assigning initial value of input text field with jquery

I am trying to assign an initial value to a text box with using jquery. This is the text field
<input type="text" class="info"/>
This creates more than one text fields and I need to populate the text fields with initial values which come from database. I am having problem since I am trying to it with jquery adapter.
Any clue on this?
Thanks in advance.
Here is the detailed code:
I include index.html
<?php include "index.html"?>;
which puts some text fields to record.php:
...
...
After including index.html I am using this code to assign intial value to the text boxes which have a class name "info":
$('.info').each(function() {
$('.info').val('yourvalue');
});
Instead of assigning a constant value (here it is "yourvalue") I am going to assing some database records to each input fields.
$('.info').val('yourvalue');
replace yourvalue with the value you want to set..
Set this value in the success callback of your ajax request..
$('.info').val('value-to-be-set');
.val( value ) - Set the value of each element in the set of matched
elements
Above code will set the value of the input fields where the class name if 'info'
Read More here
$('.aciklama').each(function() { $('.aciklama').val('yourvalue'); });
you know $('.aciklama') is an array , and when you iterator you array get the object, you still get the $('.aciklama') array and set the array value, as I see It is not correct.
You should write like this:
$('.aciklama').each(function(index, item) { $(item).val('yourvalue'); });

Categories

Resources