|
JavaScript - Don't Submit Form If Input Text Is "enter Text Here"
well title says it all
i have a search form, and the default value is "enter text here" when the user click the submit button, i would like to check if the value of my text input is "enter text here" and if it is, then don't submit the form (popup a warning or something) how can i do that? thanks a lot! Similar TutorialsI need to do an input text validation which include opening parenthesis and closing parenthesis, what I need to validate is the opening parenthesis match with closing parenthesis. Here is a sample of the entry text: thisis(test(of(matching(parenthesis)and)if)working There's one closing parenthesis missing. I would like to warn the user to correct it before submit, but not quite sure how to do it with javascript. Please advice. Thanks JT I have a very small script that simply displays a search box and redirects a user to a URL if they enter 29401 or 29455, else they go to a default page. The script works fine, but I cannot figure out how to make value="enter a zip code" in the input box so that it disappears when you click in the box. I also can't get the form to submit by pressing enter, you have to click "check". I can get all this working in straight HTML but the same won't work w/ javascript. Any help please? <SCRIPT LANGUAGE="JavaScript"> function zipValidate(){ val = document.zipForm.zip.value; switch(val){ case "29401": case "29455": document.location = 'http://www.gohere.com'; break; default: document.location = 'http://www.or-go-here.com'; break; } } </SCRIPT> <form name="zipForm" id="zipForm" method="post" action=""> <input name="zip" type="text" id="zip" maxlength="5" /> <input name="zipButton" type="button" id="zipButton" value="Check" onclick="zipValidate()" /> </form> I need to change input type="text" to input type="password" via JavaScript Code: <form id="login" action="#" method="post"> <input id="username-field" type="text" name="username" title="Username" onmousedown="javascript:this.value=''; javascript:this.focus();" value="Username" tabindex="1" /> <input id="password-field" type="text" name="password" title="Password" onmousedown="javascript:this.value=''; javascript:this.type='password'; javascript:this.focus();" value="Password" tabindex="2" /> <input type="submit" name="submit" value="sign in" tabindex="3" /> </form> This works in Firefox and Safari but not IE So then I tried this code Code: <script type="text/javascript">
function passit(ip){
var np=ip.cloneNode(true);
np.type='password';
if(np.value!=ip.value)
np.value=ip.value;
ip.parentNode.replaceChild(np,ip);
}
</script>
<form id="login" action="#" method="post">
<input id="username-field" type="text" name="username" title="Username" onmousedown="javascript:this.value=''; javascript:this.focus();" value="Username" tabindex="1" />
<input id="password-field" type="text" name="password" title="Password" onmousedown="javascript:this.value=''; passit(this.form[0]); javascript:this.focus();" value="Password" tabindex="2" />
<input type="submit" name="submit" value="sign in" tabindex="3" />
</form>
This does what I need but turns the username type to password field not the password box Please can somone help! I've been trying to find a good JavaScript code that I can use to make the text in my User Name and Password Input Boxes disappear. Does anyone know where I can get a good code for that? Thank you... What needs to be done to have the below input (red) passed to the forms action (blue) when the submit button is pressed. Obviously this should be the user input value and not the default 0.00 one. Ty. echo ' <center> <form method="post" action="https://www.paymate.com/PayMate/ExpressPayment?mid=MoreBloodWine&popup=false&ref=EoJ Market Place Donation¤cy=USD&amt= 1.23 &amt_editable=N&return=http://www.eojmarket.com"> Donation Amount: $<input style="vertical-align: middle; color: #FFFFFF; background-color: transparent; border: 1px solid; border-color: #9E853D; padding: 0px 0px 0px 1px; font-size: 10px; width: 50px;" name="amount" type="text" maxlength="6" value=" 0.00 "> <br /> <input type="image" style="padding-top: 10px; padding-bottom: 10px; border: none;" src="http://www.eojmarket.com/NonForumStuff/images/paymate-donate-button.png" value="Submit" alt="Pay with Paymate Express !"/> </form> </center> '; Hi all, I'm having a bit of a problem.. I need to disable the submit button on body onload, and i need to re-enable it when "i agree" is checked. the problem is, it wont do this.. it literally stays disabled, even after check mark.. code: Code: <html>
<head><title>Metal Detecting</title></head>
<body onload="disable()" oncontextmenu="return false;">
<script>
function disable(){
if(document.forms.test.agree.checked == false){
document.forms.test.s1.disabled = true;
}
}
function enable(){
if(document.forms.test.agree.checked == true){
document.forms.test.s1.disabled = false;
}
}
function checkCheckBox(f) {
if (f.agree.checked == false) {
alert('You MUST agree to the terms by checking the box above.');
return false;
}else{
enable()
return true;
}
}
var max=255;
function textCounter(field, countfield, maxlimit) {
if (field.value.length > maxlimit){ // if too long...trim it!
field.value = field.value.substring(0, maxlimit);
// otherwise, update 'characters left' counter
}else{
countfield.value = maxlimit - field.value.length;
}
}
function submitonce(theform){
//if IE 4+ or NS 6+
if (document.all||document.getElementById){
//screen thru every element in the form, and hunt down "submit" and "reset"
for (i=0;i<theform.length;i++){
var tempobj=theform.elements[i]
if(tempobj.type.toLowerCase()=="submit"||tempobj.type.toLowerCase()=="reset")
//disable em
tempobj.disabled=true
}
}
}
function checkdata(which) {
var pass=true;
var t1 = document.forms.test;
for (i=0;i<which.length;i++) {
var tempobj=which.elements[i];
if (tempobj.name.substring(0,8)=="required") {
if (((tempobj.type=="text"||tempobj.type=="textarea")&&
tempobj.value=='')||(tempobj.type.toString().charAt(0)=="s"&&
tempobj.selectedIndex==0)) {
pass=false;
break;
}
}
}
if (!pass) {
shortFieldName=tempobj.name.substring(8,30).toUpperCase();
alert("The "+shortFieldName+" field is a required field.");
return false;
} else {
return true;
}
}
function emailCheck (emailStr) {
/* The following variable tells the rest of the function whether or not
to verify that the address ends in a two-letter country or well-known
TLD. 1 means check it, 0 means don't. */
var checkTLD=1;
/* The following is the list of known TLDs that an e-mail address must end with. */
var knownDomsPat=/^(com|net|org|edu|int|mil|gov|arpa|biz|aero|name|coop|info|pro|museum)$/;
/* The following pattern is used to check if the entered e-mail address
fits the user@domain format. It also is used to separate the username
from the domain. */
var emailPat=/^(.+)@(.+)$/;
/* The following string represents the pattern for matching all special
characters. We don't want to allow special characters in the address.
These characters include ( ) < > @ , ; : \ " . [ ] */
var specialChars="\\(\\)><@,;:\\\\\\\"\\.\\[\\]";
/* The following string represents the range of characters allowed in a
username or domainname. It really states which chars aren't allowed.*/
var validChars="\[^\\s" + specialChars + "\]";
/* The following pattern applies if the "user" is a quoted string (in
which case, there are no rules about which characters are allowed
and which aren't; anything goes). E.g. "jiminy cricket"@disney.com
is a legal e-mail address. */
var quotedUser="(\"[^\"]*\")";
/* The following pattern applies for domains that are IP addresses,
rather than symbolic names. E.g. joe@[123.124.233.4] is a legal
e-mail address. NOTE: The square brackets are required. */
var ipDomainPat=/^\[(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})\]$/;
/* The following string represents an atom (basically a series of non-special characters.) */
var atom=validChars + '+';
/* The following string represents one word in the typical username.
For example, in john.doe@somewhere.com, john and doe are words.
Basically, a word is either an atom or quoted string. */
var word="(" + atom + "|" + quotedUser + ")";
// The following pattern describes the structure of the user
var userPat=new RegExp("^" + word + "(\\." + word + ")*$");
/* The following pattern describes the structure of a normal symbolic
domain, as opposed to ipDomainPat, shown above. */
var domainPat=new RegExp("^" + atom + "(\\." + atom +")*$");
/* Finally, let's start trying to figure out if the supplied address is valid. */
/* Begin with the coarse pattern to simply break up user@domain into
different pieces that are easy to analyze. */
var matchArray=emailStr.match(emailPat);
if (matchArray==null) {
/* Too many/few @'s or something; basically, this address doesn't
even fit the general mould of a valid e-mail address. */
alert("Email address seems incorrect (don't forget to add an @ and a . to your email address!)");
return false;
}
var user=matchArray[1];
var domain=matchArray[2];
// Start by checking that only basic ASCII characters are in the strings (0-127).
for (i=0; i<user.length; i++) {
if (user.charCodeAt(i)>127) {
alert("Ths username contains invalid characters.");
return false;
}
}
for (i=0; i<domain.length; i++) {
if (domain.charCodeAt(i)>127) {
alert("Ths domain name contains invalid characters.");
return false;
}
}
// See if "user" is valid
if (user.match(userPat)==null) {
// user is not valid
alert("The username doesn't seem to be valid.");
return false;
}
/* if the e-mail address is at an IP address (as opposed to a symbolic
host name) make sure the IP address is valid. */
var IPArray=domain.match(ipDomainPat);
if (IPArray!=null) {
// this is an IP address
for (var i=1;i<=4;i++) {
if (IPArray[i]>255) {
alert("Destination IP address is invalid!");
return false;
}
}
return true;
}
// Domain is symbolic name. Check if it's valid.
var atomPat=new RegExp("^" + atom + "$");
var domArr=domain.split(".");
var len=domArr.length;
for (i=0;i<len;i++) {
if (domArr[i].search(atomPat)==-1) {
alert("The domain name does not seem to be valid.");
return false;
}
}
/* domain name seems valid, but now make sure that it ends in a
known top-level domain (like com, edu, gov) or a two-letter word,
representing country (uk, nl), and that there's a hostname preceding
the domain or country. */
if (checkTLD && domArr[domArr.length-1].length!=2 &&
domArr[domArr.length-1].search(knownDomsPat)==-1) {
alert("The address must end in a well-known domain or two letter " + "country.");
return false;
}
// Make sure there's a host name preceding the domain.
if (len<2) {
alert("This address is missing a hostname!");
return false;
}
// If we've gotten this far, everything's valid!
return true;
}
</script>
Please contact us!<br><br>
*Please note you can submit the form ONLY once. Any double form submissions will be deleted.<br>
<form name="test" id="test" method="POST" onsubmit="return checkdata(this), emailCheck(this.email.value), checkCheckBox(this)" action="send.php">
<div id = "div01" style="width: 100; height: 25;">
Firstname: <input name="requiredfirstname" id="firstname" type="text" />
Lastname: <input name="requiredlastname" id="lastname" type="text" />
Email: <input name="requiredemail" id="email" type="text" /><br /><br />
</div>
<H4>Your statement: </H4>
<textarea onKeyDown="textCounter(this.form.statement,this.form.counter,max);" onKeyUp="textCounter(this.form.statement,this.form.counter,max);" name="requiredstatement" id="statement" rows="15" cols="40"></textarea><br />
Characters left: <input readonly="readonly" value="255" size=3 maxlength=3 type="text" name="counter" id="counter"><br/><br />
<textarea name="license" cols="40" rows="15" id="license">Blah!</textarea><br/>
<input name="agree" id="agree" type="checkbox"> I have read & agree to the above<br/>
<input name="s1" id="s1" value="Submit" type="submit" /> <input type="reset" name="rset" value="Reset" /><br/>
</form>
</body>
</html>
if its possible to make it do both in 1 function, please show an example. if you have to use 2 functions, then also show me an example. ANY help is GREATLY appreciated! Hi everyone, Been struggling with this one all day - writing a vBulletin mod and am having trouble submitting a form. Yes, yes, I know, you submit forms with HTML, but a form instance is created before my form instance - something like: <form name="main_form" etc> <form name="my_form" etc> <input button> <input submit> </form> So I said, well, why not just do this: Code: <input type="submit" value="Order" onClick="document.my_form.submit()" /></form> Yet apparently, no dice. Any help here guys? I have a form that the my client wants their users to confirm before it gets submitted to them. So basically what I need to make happen is: the first time the Submit button gets clicked, it needs to display an inline html message telling the user to double check their info, then when they click again, it will submit the form. How should I get this done? The form is pretty straightforward so far: Code: <p><label for="from">Name:</label><br /> <input type="text" id="name" name="name" size="40" maxlength="35" value="" /></p> <p><label for="from">Address:</label><br /> <input type="text" id="street1" name="street1" size="40" maxlength="100" value="" /></p> <p><label for="from">City:</label> <input type="text" id="city" name="city" size="8" maxlength="35" value="" /> <label for="from">State:</label> <input type="text" id="state" name="state" size="3" maxlength="2" value="CA" /> <label for="from">Zip:</label> <input type="text" id="postalcode" name="postalcode" size="5" maxlength="5" value="" /></p> <p><label for="from">Phone:</label><br /> <input type="text" id="phone1" name="phone1" size="20" maxlength="35" value="" /></p> <p><label for="from">Your Email:</label><br /> <input type="text" id="email" name="email" size="20" maxlength="35" value="" /></p> <p><input name="submit" type='submit' value='Submit Form' /></p> suggestions welcome !!
well the jquery is working fine for twitter and other stuff but its not working for facebook, when i highlight the text and select fb to share at then the facebook share just show the meta description of site and not the selected area. I am not able to understand where am i going wrong, any assistance provided is highly appreciated. Go to this link http://www.blobh.com/2011/09/testing-1.html there select some text then a tooltip kind of thing will appear first share at twitter then at facebook you will understand the matter. the script i am using is this Code: <script type='text/javascript'>
$('.demo1').selectedTextSharer({
lists:"Twitter,http://twitter.com/home?status=%ts ,favicon|Facebook,http://www.facebook.com/share.php?u=http%3A%2F%2Fwww.blobh.com%2F&t=%s,favicon|Wikipedia (en),http://en.wikipedia.org/w/index.php?title=Special:Search&search=%s,favicon|Google Maps,http://maps.google.com/?q=%s,favicon",
extraClass: 'dark',
title: 'Share this text ...',
borderColor: '#7F241C',
background : '#4F663A',
titleColor : '#7F241C',
textColor : '#FFFFFF',
hoverColor: '#7F241C'
});
</script>
and the other script is this one http://bloghuts.googlecode.com/files...-sharer.min.js and the html is like this Code: <!-- Just wrap a text with a div and add a class, thats all ! --> <div class="demo1"> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it</div> <textarea class="demo4"></textarea> <input class="demo4" type="text" /> Hi - in editing a website...this javascript html is really getting on my nerves - can somebody please tell me why i keep getting the error message expected ")" when i try this code: (which ive fiddled around with bloody loads to try and resolve!) <SCRIPT LANGUAGE=JAVASCRIPT > var r_text = new Array (); r_text[0] = Text 0; r_text[1] = Text 1; r_text[2] = Text 2; var i = Math.floor(3*Math.random()); { document.write("<marquee style="font-family: 'Georgia'; color: #FFFF00; font-size: 13pt; mso-fareast-font-family: 'Arial'" ><scrollamount="15"><b>" + r_text[i] + "</b></scrollamount></marquee>"); } it seems fine to me and is getting me really frustrated now any help greatly appreciated, do whatever you like to the coding if itll work! thankyou very much, joe. Good Afternoon!!! I am writing a script that needs to show the evaluation as 2 decimal places as well as containing the comma (as in a currency format). It should be as simple as possible. Below is my current code: <html> <script language="javascript"> //function that checks the value of text boxes and radio buttons function checkit(){ while(document.form2.text1.value=="" || document.form2.text2.value=="" || document.form2.r1[0].checked!=true && document.form2.r1[1].checked!=true && document.form2.r1[2].checked!=true && document.form2.r1[3].checked!=true) { if(document.form2.text1.value=="") { alert("You did not enter a value in the first text field"); a=confirm("Click ok to continue. Click cancel to exit") if(a==false) { break; } } if((document.form2.r1[0].checked!=true)&&(document.form2.r1[1].checked!=true) &&(document.form2.r1[2].checked!=true)&&(document.form2.r1[3].checked!=true)) { alert("You did not select a mathematical operator"); a=confirm("Click ok to continue. Click cancel to exit") if(a==false) { break; } } if(document.form2.text2.value=="") { alert("You did not enter a value in the second text box"); a=confirm("Click ok to continue. Click cancel to exit") if(a==false) { break; } } } } //function calculates value of text boxes function evalit(){ var a = eval(document.form2.text1.value) var b = eval(document.form2.text2.value) if(document.form2.r1[0].checked==true) { document.form2.text3.value=eval(a+b) } if(document.form2.r1[1].checked==true) { document.form2.text3.value=eval(a-b) } if(document.form2.r1[2].checked==true) { document.form2.text3.value=eval(a*b) } if(document.form2.r1[3].checked==true) { document.form2.text3.value=eval(a/b) } } </script> <!--calculate--!> <form name=form2> Enter a number in the first text box<br> Select a mathematical operation<br> Enter a value in the second text box<br> Push the "=" button<br> The answer should appear in the third text box<br> The result MUST have 2 digits after the decimal point and <br> if the number is big enough, include the commas for thousands, millions, billions, etc.<br> <table border=1> <tr> <td><input type="text" name="text1"></td> <td><input type="radio" name="r1" value="+">+<br> <input type="radio" name="r1" value="-">-<br> <input type="radio" name="r1" value="*">*<br> <input type="radio" name="r1" value="/">/<br></td> <td><input type="text" name="text2"</td> <td valign=middle><input type="button" value="=" onClick="checkit(); evalit()"> </td> <td><input type="text" name="text3"</td> </tr> </table> </form> </html> Any assistance would be appreciated. Thank you!!! Hello, I am trying to do an image swap when hovering over "TEXT" links. For instance, I would like to first have a "mainpic" in a div that would be replaced by either image 1,2 or 3 (depending on if you are hovering over"text link 1,2 or 3). I would use normal rollover "image" swaps, but would prefer to have the "trigger" to be "text" (for SEO reasons). I am just getting familiar with javascript, but do not even know where to begin! I have read multiple forum entries throught google, but could not find any where I could have "multiple" text links. I would so much appreciate it if anyone could please point me in a direction. Sincerely, Buffmin -------------------------------------------------------------------------------- Can some1 help me at this, i am very new to javsciprt and HTML things, so as the title says, a simple bold to the selected text in a div is what i need. below is the div area i have, so how do it?? Code: <TD colspan="25" width="525px" style="text-overflow: ellipsis; overflow: hidden;">
<input type="hidden" $acmForms.bindText("casecomments") />
<div #if (!$acmForms.getFormAttributes().isReadOnly())
CONTENTEDITABLE
#end
onKeyUp="dairy_limitTextArea(this, 4000)"
onKeyDown="dairy_limitTextArea(this, 4000)"
id="spell_casecomments" style="width:800px; height:220px; overflow: auto; border: 1px solid #bdcee5;">
</TD>
Hi, window.clipboardData.getData("text") is giving undefined on remote server(unix). When deployed locally(windows xp) it is coming giving correct value. In both cases the brower is IE running on windows xp. Is there anything wrong in the way I am reading the clipboard data? This should be a simple fix.. I hope. JS: Code: //-- This is a really awful script and if it could be re-written by someone who knows what they're doing that would be incredible.
window.addEvent('domready', function() { //new event wooooo
// -- vertical2
var myVerticalSlide = new Fx.Slide('vertical_slide'); //declaring the variable with the FXSlide property
var toggleThis = $('v_toggle'); //toggle variable
myVerticalSlide.hide(); //hides the variable off the bat.
toggleThis.addEvent('click', function(event){ // uses the type 'click' the id on the link, giving it the following function
event.stop(); //Prevents browser from following the link and instead initiates the next line
myVerticalSlide.toggle(); //Togles the div declared in the variable VerticalSlide
});
});
HTML: Code: <div>
<a id="v_toggle" href="#">Question 1</a>
<div id="vertical_slide">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>
</div>
<div>
<a id="v_toggle" href="#">Question 2</a>
<div id="vertical_slide">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>
</div>
I'm new to JS (and any programming language, i just know HTML, CSS/SASS) . I tried to make the code as stupid-simple as I could, as you can see with all the comments. The problem is when you click on question1, all the answers show. I just want the answer below the question to show. How can I write this to just show one answer at a time. Any explanation would be a huge help or a point in the right direction would be great help. I'd love to learn how to fix this as opposed to just copying pasting :\ sorry guys, please delete. I solved my own issue.
|
|||||||