Reset particular input filed - javascript

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=""
});

Related

use javascript set value to input ,the input value will disappear when it's on focus

i have try to fill some value into input field by javascript(chrome extension)which belong to a form , the value seems not update, and will disappear when i click the other area of the page ,
my code is simple
document.getElementById("editGiftCardNumber").value = "12345";
document.getElementById("editGiftCardNumber").setAttribute('value','12345');
also try to use
setTimeout(function()
e.g. in https://www.elementaryrobotics.com/
, i try to set value in chrome console
input = document.getElementById("comp-jpua0zn5input");
input.value="123";
you will see the 123 is shown in input, if I click other area of the page, the 123 will disappear, how to solve it ?

Add values to text box using buttons - retain and concat original

I've got a text box (called SMS) which is capable of having its value changed by selecting a button (addButton). See the JavaScript
<script>
$(document).ready(function(){
$(document).on('click','.addButton',function(e){
e.preventDefault();
var search_val = $(this).attr('data-value');
$('.sms').val(search_val);
});
});
</script>
I want to be able to add multiple values to this text box without the text boxes value completely updating each time.
For example:
A user can write: hello, your name is (user select 'Name' button and value is inserted'. Your address is (user selects address button).
With my current solution, any button clicked will remove all value form the text box and just insert the value of which ever button was pushed.
Use the function to update it's value:
$('.sms').val(function( index, value ) {
return value + search_val;
});

Value of textarea? how to fill one?

I am trying to fill a textarea using javascript, the thing is i found out that textarea doesn't have the value tag, and <textarea ..></textarea> is not an option since i cant use it with javascript.
Edit :
content.document.getElementsByName("cr-work-desc0").innerHTML = "125645";
content.document.getElementsByName("cr-work-urls0").textContent = "this is some sample text";
content.document.getElementsByName("infringing-urls0")[0].setAttribute("value","testing to");
Just set the value of the field via document.getElementById('thefield').value = 'value'.
Try following code
document.getElementById("aa").innerHTML="Blah Blah";
<textarea id="aa"></textarea>
Both innerHTML and value works fine.
You can write anything in place of aaaa
For an input element, the default value is specified by the value attribute and the current value is specified by the value property.
A textarea is different. The default value is specified by the text node that is a child of the element.
i.e.:
<textarea>this is the default value</textarea>
However the current value is still specified by the value property.
document.getElementById('thefield').value = 'value';
… even though there is no value attribute for textarea elements.
You can modify the default value (input.setAttribute("value", "new value") or textarea.innerHTML = "new value") which will:
Modify the displayed value providing it hasn't changed (e.g. by the user typing in it)
Modify the value that the control will be reset to if a reset button is activated
… but usually, you will want to change (and read) the current value which will always be input.value / textarea.value.

Deleting value of each input Javascript

I have 3 inputs (autocomplete's of JqueryMobile).
Using this function:
$('.ui-input-clear').attr('onclick', 'delete_email();');
I add onclick event to each clear button, but what can I do for ONLY delete the input of the same button?
Example:
[<------INPUT------>] [BUTTON] //If I click, the value of THIS input turns ""
[<------INPUT------>] [BUTTON] //If I click, the value of THIS input turns ""
[<------INPUT------>] [BUTTON] //If I click, the value of THIS input turns ""
Since you are not providing the code for delete_email(). Give all inputs unique id's, then:
$('.ui-input-clear').click(function() {
delete_email($(this).attr('id'));
});
And modify your delete function to take an id parameter, then use this id to identify the input that needs to be deleted.
$(document).ready(function(){
$('.ui-input-clear').click(function(){
$(this).prev().find('input').val('');
});
});

Dynamically adding new fields resets values in previous fields

I using an HTML / Javascript combination to add fields dynamically.
Here is the jsfiddle for it: http://jsfiddle.net/kM9Yg/2/
My problem is, if I input values in a field, and then click on the Add More button, a new field gets added but the previous fields' values get reset.
The button to add more is of type <input type="button"/> and not <input type="reset" />
Any way to prevent this?
Use DOM methods, not innerHTML. DOM methods are standardised, innerHTML is not. Some browsers will reflect the current value as the default value, others will not.
You can do:
var el, oEl = document.getElementById('divToClone');
if (oEl) {
el = oEl.cloneNode(true);
// code here to fix duplicate ids and
// set style.display = '' so it's visible
oEl.parentNode.appendChild(el);
}

Categories

Resources