Remove OTP Box Automatically - javascript

i want to remove enter image description here
this OTP Box Automatically using Java script How can I do This ...
or how can i remove
<div class="col-32">
<input name="reotp" id="reotp" size="50" maxlength="6" type="password">
</div>
this automatically.

Not sure if you mean to hide it. If it so then this snippet will work
document.getElementById('reotp').style.display = "none"
If you want to remove the DOM then removeChild can be used

Related

Set focus to input before validator span

I am displaying an input field followed by a br tag and a span for a validation message. There are three of these for a login form. I want to locate the first field with a visible validation message (span has a class assigned) and set focus to the input associated with the span.
My html looks like thus:
<div id="loginForm">
<label class="formLabel" for="Login_LastName">Your last name</label>
<input id="Login_LastName" name="Login_LastName" type="text" maxlength="31" style="width:200px;" /><br />
<span id="Login_LastName_validator"></span>
. . .
</div>
I am trying to use the following javascript but it's not finding the input:
$("#loginPanel").find("validationMsg:first").prev("input").focus();
I can locate the validation span it appears as I can alert the contents:
alert($("#loginPanel").find(".validationMsg:first").html());
I just cannot seem to locate the input object to set focus.
I am setting the validationMsg via javascript:
if(!$.trim($("#Login_LastName").val())) {
$("#Login_LastName_validator").html("Your last name is required<br /><br />")
.addClass("validationMsg");
loginFormValid = false;
}
else {
$("#Login_LastName_validator").html("")
.removeClass("validationMsg");
}
Found a solution. I think I had to get it past the break tag. Looks like prev() only checks the one element previous? It does not keep going?
$("#loginPanel").find(".validationMsg:first").prev().prev("input").focus();

Textbox like gmail login page

I want a textbox functionality like a gmail login page textbox. Right now I have code like this:
<script>
function inputFocus(i){
if(i.value===i.defaultValue){ i.value=""; i.style.color="#000"; }
}
function inputBlur(i){
if(i.value===""){ i.value=i.defaultValue; i.style.color="#888"; }
}
</script>
<body>
<input type="text" name="firstname" title="First Name" style="color:#888;"
value="First Name" onfocus="inputFocus(this)" onblur="inputBlur(this)" />
...
</body>
The problem with this code is when I select the tetbox, type "First Name" and if I reselect the textbox the text is clearing. And also gmail login page textbox functionality looks great, until I type a letter it shows the transperent text. But I don't know how to implement it.
For the "transparent text" you need to use the placeholder attribute:
<input type="text" name="firstname" ... placeholder="Email">
are you looking for a placeholder ??
If so... you can do like this..
<input type="text" name="somename" id="someid" value="" placeholder="Email">
Placeholder is used to display the text in the text box and will disappear as soon as you start typing..
If you want to delete the "transparent text" once start typing, you can use placeholder attribute of input element
This attribute is introduced in HTML5 to handle this scenario without writing any peice of javascript code
Your html code should look like this
<input type="text" name="firstname" placeholder="First Name"/>
This will also work as desired when you delete your text, as it will reset the transparent text back again.
Also, here is a working example on jsfiddle
I also, encourage you to review new elements and attributes introduced in HTML5, it will save a your time writing a lot of javascript to handle already built in functionalities

HTML/JS Show a text next to a input box

I want to put a text next to an input box, after an successful if clause.
Just need to know how to show up such text.
Thanks
<input type="text" class="form-control" id="username" placeholder="Username" name="username" required autofocus/>
And my code snippet:
$("#username").append("<p>This username is not available</p>");
If your using jQuery, you can simply use:
$("#your-element-id").append("<strong>whatever text you need to add</strong>");
You will need to make sure that #your-element-id contains the input box. You may need to add the relavant CSS as well.

Send enter from javascript

How to send enter from javascript to site?
What I real need is to send text to site like filehippo.com in search box, and press enter to search for those text.
So piece of code from site is:
<div id="searchbox">
<form name="f" action="/search">
<input style="color: #999" type="text" id="q" name="q" maxlength="150" value="Search..." onfocus="javascript:clearInputValue('q', 'Search...')" onblur="javascript:setDefaultIfEmpty('q', 'Search...')">
<input type="submit" id="search-submit" value="GO" onclick="javascript:submitQuery('q', 'Search...')">
</form></div>
And my simple code look like this:
javascript: document.getElementById('q').focus();document.getElementById('q').value='Winrar';document.getElementById('f').item(0).click();
And those script just put focus on search box and send text to them, but I need also to do automatically search (send enter), how to do that?
document.getElementById('f').item(0).click(); -> dont work
What I need is to simulate click of mouse, by enter, cause can't send click to element that work properly.
Is it possible to send enter with text?
Use document.f.submit(); to submit the form.
The problem is that there are multiple forms named 'f'
javascript:document.f[0].submit();
So the fully functional line would be:
javascript:document.getElementById('q').value='Winrar';document.f[0].submit();
Use onkeypress attribute of input element.

script that pre-fills a textfield

I'm trying to find a script that will fill a textfield of say an optin form with a text like 'fill in your e-mail address' and dissappear when click on. I know they're all over the net but searching for it only returns javascript autofill scripts where suggestions are listed from a dropdown below the textfield.
HTML5 supports placeholder text, which you can use like this
<input name="email" placeholder="Enter your email address" />
This will automatically disappear when you click on the textfield. For older browsers, you can use one of the above suggestions.
This is what I use on my website Expiringlinks.co. Now, if you only want to apply this to one input, change $('input') to $('#yourinputid'). The input field should have a value field that equals your before text.
var tempValue='';
$('input').click(function(){
tempValue = $(this).attr('value');
$(this).attr('value','');
});
$('input').focusout(function(){
if ($(this).attr('value')==''){
$(this).attr('value',tempValue);
}
});
For you input field
<input type="text" value="Whatever you want to show before the click" />
jsFiddle example
Or, a slightly different fiddle that doesn't require an ID on the label, but needs the textbox/label to be wrapped in something, for example a <p> tag.
HTML
<input type="text" name="email_address" id="Email" />
<label for="Email" id="EmailLabel">Please enter your email address</label>
CSS
label
{
display: none;
}
jQuery
$(document).ready(function()
{
$('#Email').focus(function()
{
$('#EmailLabel').show();
}).blur(function()
{
$('#EmailLabel').hide();
});
});

Categories