Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I want that on pressing submit button, if the input was not correct(i.e. only letters) than warning(id="fn_warn") becomes vissible, but the code is not working. I think their is problem with getElementById.
Function isAlpha checks whether the value is letters only or not.
<!DOCTYPE HTML>
<head>
</head>
<body>
<form>
First name
<input id="first_name" type="text"/>
<p id="fn_warn" style=" visibility: hidden; color: red;">#Please enter a valid name...</p>
<input class="button" onclick="validate();" type="submit" value="Submit" />
<input class="button" type="reset" />
</form>
</body>
</html>
<script>
function validate(){
var submit=false;
var x = document.getElementById("first_name");
if (isAplha(x.value)){
submit=true;
} else {
var y = document.getElementById("fn_warn");
y.style.visibility = "visible";
}
}
function isAlpha(value){
if (value.match(/^[A-Za-z]+$/)){
return true;
} else {
return false;
}
}
</script>
I would recommend two things: fixing your typo for your first if statement that says isAplha instead of isAlpha and, if that doesn't fix it, checking your browser's console for errors, which is always a good idea when you're working with JS.
You have "isAphla(x.value)" instead of isAlpha
Related
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 1 year ago.
Improve this question
We are trying to convert several JQuery commands to plain JavaScript.
Can the following be converted?
Please note that the class .options is just a div container that contains all the input elements of interest.
var inputs = $(".options :input:not(:radio):not(:checkbox):not(.nofilter):not(.tt-hint)").filter(function () { return $(this).val(); }).length;
Try this
const plainInputs = [...document.querySelectorAll(".options input, select, textarea, password")]
.filter(ele => ele.value &&
!["radio", "checkbox"].includes(ele.type) &&
!ele.classList.contains("nofilter") &&
!ele.classList.contains("tt-hint")
).length;
console.log(plainInputs)
const jQueryInputs = $(".options :input:not(:radio):not(:checkbox):not(.nofilter):not(.tt-hint)").filter(function() {
return $(this).val();
}).length;
console.log(jQueryInputs)
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="options">
<input type="radio" value="1" />
<input type="checkbox" value="2" />
<textarea class="nofilter">3</textarea>
<textarea class="tt-hint">4</textarea><br/>
<input value="5"/><input value="6"/><input value="7"/>
</div>
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 4 years ago.
Improve this question
How to I make a sweet alert error popup when form required textbox is empty and user clicked submit button. I want show instant popup danger alert that %This TextBox Is Required% in sweet alert. Such like JavaScript alert when textbox empty different is , that is js alert and I am talking about sweet alert instead of simple js alert. Please please help...
here is sweet alert if input text is empty
$('input[name="submit"]').on('click', function() {
if ($('input[name="fullname"]').val() == "") {
swal("fullname is required", '', 'error');
return false;
}
return true;
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<form action="#" method="POST">
<input type="text" name="fullname">
<input type="submit" value="submit" name="submit">
</form>
you need to check here you use jquery trim and val function.
val: Get the current value of input
trim: Remove the whitespace from the beginning and end of a string.
$('#button').on('click', function(){
if($.trim($('input[type="text"]').val()) == ''){
swal("Input can not be left blank")
return false;
}
return true;
})
.swal-footer {
text-align:center !important;
}
.swal-button {
background-color: red;
}
.swal-button:focus {
outline: none;
box-shadow: none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<form action="#" method="POST">
<input type="text" name="fullname">
<input type="text" name="lastname">
<input type="submit" value="submit" id="button" name="submit"> </form>
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 4 years ago.
Improve this question
Some day ago i'd write for asking what was the problem about onclick event doesn't activate when i clicked in a specific area of the browser. After check a guide i find it the problem end also the rappresentation of my simply test is trivial, i've known the mechanism for activating a particular function in browser text area.
Now that work it... i'd want add more detail of my question...what is the mechanism that activate my function from template html to tag <script></script> ?
<h3> Check is palindrome</h3>
<input type="text" id="input1" >
<input type="text" id="input2">
<br><br>
<input type="button" id="reload" onclick="myFunction()" value="ricarica">
<body >
<p onclick="check()" id="output" style="line-height: 1000px"> TEST</p>
</body>
//WHAT IS THE MECHANISM IN THIS POINT FOR ACTIVATE check()?
<script>
function check() {
var x = document.getElementById("input1").value;
var y = document.getElementById("input2").value;
if(x===y){
document.getElementById("output").innerHTML=" E' PALINDROMA "
}else document.getElementById("output").innerHTML=" NON E' PALINDROMA "";
}
function myFunction() {
location.reload(true);
}
</script>
</html>
Everything about your code is wrong. Like... literally everything. Here's a suggested alternative:
var out = document.getElementById('output');
document.getElementById('input').oninput = function() {
if( this.value.split('').reverse().join('') === this.value) {
out.innerHTML = "The input is a palindrome!";
}
else {
out.innerHTML = "The input is not a palindrome...";
}
};
<input type="text" id="input" />
<p id="output">Type something...</p>
From what I understand, move your check() function to the input field
<input type="text" id="text1" onclick="check()">
and remove from body
<body>
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
I'm stuck with an idea for local image directory. We have a internal tool to lookup other employee's profiles and the url is url of image is like "https://internal-cdn.abc.com/profiles/images/empid=random_emp_id".
So I have used JS to get the images based on one emp_id by using html form to input emp_id and js to append the "https://internal-cdn.abc.com/profiles/images/empid="+form_element+">" and I used document.write to show the image.
Now I need you help to write JS which will classify the input list of emp_id's separated by comma into an array and manipulate the n strings in array to append the IMG SRC path to finally show multiple images.
Thanks in advance.
This Works
<html>
<head>
<script type="text/javascript">
function myFun(){
var imagesrc = document.getElementById("login");
image.value = "<img src=internal-cdn.abc.com/profiles/images/…;;
document.write(image.value); }
</script>
</head>
<body> <input type="text" name="login" id="login" placeholder="Enter the login" required="required" />
<input type="button" name="submit" onClick="myFun()" />
<div id="image">Image</div>
</body>
</html>
This Doesn't Work!
<html>
<head>
<script type="text/javascript">
function myFun(){
var text;
var i;
var login = document.getElementById("login");
login = login.split(",");
for (i = 0; i <=login.length; i++) {
text += "<img src=https://internal-cdn.abc.com/profiles/images/?empid=" + login[i] + "><br>";
}
document.getElementById("images").innerHTML = text;
}
</script>
</head>
<body>
<input type="text" name="login" id="login" placeholder="Enter the login" required="required" />
<input type="button" name="submit" value="Get Images!" onClick="myFun()" />
<p id="images"></p>
</body>
You're trying to split an HTML element, not a string:
var login = document.getElementById("login");
login = login.split(",");
You want the value of the element, not the element itself:
var login = document.getElementById("login").value;
login = login.split(",");
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 8 years ago.
Improve this question
<html>
<head>
<script>
function testing(){
var search1 = document.forms['tfnewsearch']['search1'].value;
if(search1 == null || search1 == "")
{
alert("Error! Please type in something");
isValid = false;
}
}
</script>
</head>
<form name= id="tfnewsearch" method="post" action="" onsubmit ="return testing();">
<p><input type="text" class="tftextinput" id="search1" size="21" maxlength="120"/>
<input type="submit" value="search" class="tfbutton"/></p>
</form>
<body>
</body>
</html>
so what im trying to do here, is to show an alert pop if user doesnt type anything which is equivalent to null value but i dont understand why it doesnt show the popup. i think theres not error with my function,
http://jsfiddle.net/gYg7r/
Here is how:
JS:
function testing(){
var search1 = document.getElementById('search1').value;
if(search1 == undefined || search1 == ""){
alert("Error! Please type in something");
isValid = false;
}
}
HTML:
<form name="searchForm" id="tfnewsearch" method="post" action="http://google.com" onsubmit ="testing();">
<p><input type="text" class="tftextinput" id="search1" size="21" maxlength="120"/>
<input type="submit" value="search" class="tfbutton"/></p>
</form>