how to get value from hidden input with jquery? - javascript

i have a any hidden input element. i want get value from a element. but tis code $('#chin').val() return ''. hidden element for keep default value from the cotroller.
my code is:
<input placeholder="تاریخ ورود" class="datepicker" name="from" id="from" value="#Model.FromDate" />
<input ng-model="searchFilters.CheckInDate" name="chin" id="chin" hidden value="#Model.CheckInDate" />
and html is:
<input ng-model="searchFilters.CheckInDate" name="chin" id="chin" hidden="" value="2016/12/21" class="ng-pristine ng-untouched ng-valid ng-empty">
the input has value.
how to get value from this?

You should be using Angular to retrieve that value. It will be in the model (#Model.CheckInDate).

delete hidden input and Instead it use this code:
<input placeholder="تاریخ ورود" class="datepicker" name="from" id="from" value="#Model.FromDate" data-gdate="#Model.CheckInDate" />
add data-gdate="#Model.CheckInDate" into end code.

Related

How to get the name of input filed in jquery

I have a multiple-input field and an onchange function. When we change the input field from the event it triggered, I want to get the name or id of the input field (to distinguish it from other input fields). Many thanks.
$('input[type="text"]').on('change', function(){
// name is a unique attribute
$(this).attr("name"));
});
<input type="text" name="text1" />
<input type="text" name="text2" />
<input type="text" name="text3" />

How to set value for the input value in the element from Javascript?

I am the very beginner for html and js.
I have a js which can set the value of id="tk___kiaVlink" by using the following.
this.form.formElements.get('tk___kiaVlink').update('abcedf ghi');
But both label and link values are updated. How could I specify js code to update only [link] value?
<div class="fabrikSubElementContainer" id="tk___kiaVlink">
<input type="text" name="tk___kiaVlink[label]" size="200" maxlength="200" class="form-control fabrikinput inputbox fabrikSubElement" placeholder="Label" value="Video">
<input type="text" name="tk___kiaVlink[link]" size="200" maxlength="200" class="form-control fabrikinput inputbox fabrikSubElement" placeholder="URL" value="test value">
I tried using the name tk___kiaVlink[label] and it doesn't work.
const [label, link] = [...document.querySelectorAll('#tk___kiaVlink input')];
[label.value, link.value] = ['my label value', 'my link value'];

Set value of ng-content with pure javascript or jquery

I have the following html code from some CMS:
<esw-input _ngcontent-ysg-c21="" class="address-form__middleName ng-touched ng-pristine" type="text" _nghost-ysg-c16="" maxlength="60"><input _ngcontent-ysg-c16="" class="textInput ng-pristine ng-touched" triggers="manual" id="middleName" type="text" placeholder="Отчество" required="" maxlength="60"><!----><div _ngcontent-ysg-c16="" class="error"><esw-field-validation _ngcontent-ysg-c16="">Пожалуйста, введите ваш отчество
</esw-field-validation></div></esw-input>
How to set value of this field with javascript or jquery? I try following
var element = $("#middleName");
element.val(MiddleName).trigger('blur');
With this code I see new value, but field reported as invalid(empty) and not possible to submit form. Some CMS used, and blocks me to do what I want.
You can do it like this with pure JS.
UPD with focus and blur methods
// Shortcut
const s = document.getElementById("middleName");
// Focus field
s.focus();
// Add value
s.value = "Джонович";
// Set value attribute to input tag
s.setAttribute("value", "Джонович");
// blur field
s.blur();
<esw-input _ngcontent-ysg-c21="" class="address-form__middleName ng-touched ng-pristine" type="text" _nghost-ysg-c16="" maxlength="60">
<input _ngcontent-ysg-c16="" class="textInput ng-pristine ng-touched" triggers="manual" id="middleName" type="text" placeholder="Отчество" required="" maxlength="60">
<!---->
<div _ngcontent-ysg-c16="" class="error">
<esw-field-validation _ngcontent-ysg-c16="">Пожалуйста, введите ваш<b style="color:red">e</b> отчество</esw-field-validation></div></esw-input>

set the value of the input field as value of the hidden field using JS

This question seem to be very silly! but I am looking for the best answer,
I have a input field and a hidden field. How to set the value of the input field as value of the hidden field?
<input class="class1" id="id1" name="name1" value="06/30/2015" />
<input type="hidden" name="hidden" id="hidden" value="I want the value of above field">
Please try this
$(document).ready(function(){
$("#id1").change(function(){
$("#id1").val($("#hidden").val());
});
});
DEMO
You can use a change event handler to update the value of hidden field
//set the initial value
hidden.value = id1.value;
<input class="class1" id="id1" name="name1" value="06/30/2015" onchange="window.hidden.value=this.value" />
<input type=hidden name="hidden" id="hidden" value="I want the value of above field">
You can this by below why, i used onblur for set values from input to hidden. same why you can use different method for this.
Or if you strictly want to use javascript then add one onblur function and do code as i do with callthis() function.
$("#id1").blur(function(){
$("#hidden").val($(this).val())
console.log($("#hidden").val());
});
function callthis(inputobj)
{
document.getElementById("hidden").value = inputobj.value;
console.log(document.getElementById("hidden").value)
}
<input class="class1" id="id1" name="name1" onblur="callthis(this)" value="06/30/2015" />
<input type="hidden" name="hidden" id="hidden" value="I want the value of above field">

How to restore default value of text field in jQuery?

I have a page with a table having some <input type="text"> fields. I have a button next to each field. I allow user to change the text of input fields. But when the user click the button next to input field, the corresponding input field's value need to be restored to default (previous) value.
I tried to make an array with index as input field's name. This array can store default values, and can be retrieved easily and restored to their corresponding fields. I tried to do this using keyup(function(), but I know that this triggers each time key is pressed.
Here is my HTML;
<input class="zx" type="text" name="qwer" value="Google" /><button class="cncl">X</button><br />
<input class="zx" type="text" name="qwer" value="Yahoo" /><button class="cncl">X</button><br />
<input class="zx" type="text" name="qwer" value="Bing" /><button class="cncl">X</button><br />
<input class="zx" type="text" name="qwer" value="Ask" /><button class="cncl">X</button><br />
Here is the fiddle.
How can I restore the default values to the fields?
You can use the defaultValue property of the input element
$('.cncl').click(function(){
$(this).prev().val(function(){
return this.defaultValue;
})
})
Demo: Fiddle
Try this, use .attr('value') to get the default value:
$('.cncl').on('click', function () {
$(this).prev().val($(this).prev().attr('value'));
});
DEMO
I have done something similair in the past. I stored the default value in an attribute of the html-tag itself.
<input class="zx" type="text" name="qwer" default-value="Google" value="Google" />
When you like to restore it you can execute
$('selector').val($('selector').attr('default-value'));

Categories

Resources