TEXTBOX REQUIRED POPUP [closed] - javascript

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>

Related

how work activate function event onclick(or other function) when it is activated from browser? [closed]

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>

call a function when submit form [closed]

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'm trying to call a function when submit form , this function showld work for all forms with div "#js_ajax_form".
( the javascript code works in chrome console
// html code
<form method="post" id="js_ajax_form" data-type="user.registration" action="signup">
<input type="text" name="val[first_name]" id="first_name" placeholder="First Name" value="" size="30">
<input type="text" name="val[last_name]" id="last_name" placeholder="Last Name" value="" size="30">
<input type="submit" value="Sign Up" class="button_register" id="js_registration_submit">
</form>
// javascript
var $Core = {};
function getParam(sParam)
{
return oParams[sParam];
}
$Core.form = function()
{
$("#js_ajax_form").submit(function(e)
{
var postData = $(this).serializeArray();
alert(postData);
e.preventDefault(); //STOP default action
e.unbind(); //unbind. to stop multiple form submit.
});
}
as long as you are using jQuery, the following code should work:
$("#myform").submit(function() {
myFunction();
// the form will continue on submission
});

alert javascript not working [closed]

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>

whats wrong with getElementById [closed]

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

disable a form submit button until a textarea has been populated?

can someone please help because i have tried various javascripts to get my form submit button to stay disabled until a user enters text into the textarea but nothings working.
i want the submit button to be disabled until a user enters some text. any suggestions please?
<form action="includes/welcomebio.php" method="post" id="form12" class="form12">
<textarea id="bio" textarea name="bio" data-id="bio" placeholder="Hi, my name is Peter. I'm 22 years old from North Wales." onKeyUp="checkWordCount();" data-required="true"><?php echo htmlspecialchars($profile['bio']); ?></textarea>
<input type="submit" class="welcome-submit" name="submit" value="Next ->" id="submit"/>
</form>
<script type="text/javascript">
function disable()
{
if(document.textarea.bio.value=="")
{
document.textarea.submit.disabled=true;
}
else
{
document.textarea.submit.disabled=false;
}
}
</script>
There are many things wrong with your code:
Try not to use inline javascript
your textarea onKeyUp calls a function that does not exist
you are trying to set the disabled state of the wrong element (you actually have invalid javascript)
you have some invalid html too
This is what you want:
HTML
<form action="includes/welcomebio.php" method="post" id="form12" class="form12">
<textarea id="bio" name="bio" data-id="bio" data-required="true" placeholder="Hi, my name is Peter. I'm 22 years old from North Wales.">
<?php echo htmlspecialchars($profile['bio']); ?>
</textarea>
<input type="submit" class="welcome-submit" name="submit" value="Next ->" id="submit" />
</form>
JAVASCRIPT
window.onload = function () {
document.getElementById("bio").onkeyup = checkWordCount;
checkWordCount();
};
function checkWordCount() {
if (document.getElementById("bio").value == "") {
document.getElementById("submit").disabled = true;
} else {
document.getElementById("submit").disabled = false;
}
}
Here is a working example
You are trying to disable the textarea instead of the submit button. Your code isn't valid JavaScript.
Keep the submit button disabled initially and enable it only when the textarea has something in it. Also, since you're using a placeholder for the textarea, your textarea would never be empty, so a check for
document.getElementById("bio").value = ""
would always return false unless the user changes it.
try this
<body onload="disable()">
<form action="includes/welcomebio.php" method="post" id="form12" class="form12">
<textarea id="bio" textarea name="bio" data-id="bio" placeholder="Hi, my name is Peter. I'm 22 years old from North Wales." onKeyUp="disable();checkWordCount();" data-required="true"></textarea>
<input type="submit" class="welcome-submit" name="submit" value="Next ->" id="submit"/>
</form>
</body>
<script type="text/javascript">
function disable()
{
if(document.getElementById("bio").value=="")
{
document.getElementById("submit").disabled=true;
}
else
{
document.getElementById("submit").disabled=false;
}
}
</script>

Categories

Resources