|
JavaScript - Javascript: Use Return Key To Fire Onsubmit And Focus Outside Form <input> Field
Hi all,
Please keep in mind: this is the first code I have ever written -- much of it with help from this forum and the skeleton from other corners of the JS community. Thanks! But now for the problem... I'm developing am income tax calculator, and everything is going swell. Currently the user can type in their adjusted gross income (AGI), hit submit, and learn the amount of income tax they would pay, their tax rate, and their income after tax. I've played around with the events to get the submit button to work in FF, IE, Chrome and Safari -- and I've gotten the enter button to work before with some stock code, but here's the catch: when the user presses enter, i want the focus to leave the input box. I don't care where it goes (submit button, I suppose?) but i need it to leave the input field so the onfocus="clearText(this);" event can fire when they return to type in a new income. Any ideas? Thanks in advance. Code: <script language="javascript" type="text/javascript">
function TotalGrossPerYear() {
var Calc = document.NetIncome;
if (Calc.InputRad[0].checked) {
if ((Calc.AGI.value > 500000)) {
Bracket3();
}
if ((Calc.AGI.value > 200000 ) && (Calc.AGI.value <= 500000)) {
Bracket1();
}
if ((Calc.AGI.value <= 200000)) {
Bracket2();
}
}
else
if (Calc.InputRad[1].checked) {
if ((Calc.AGI.value > 1000000)) {
Bracket3();
}
if ((Calc.AGI.value > 400000 ) && (Calc.AGI.value <= 1000000)) {
Bracket1();
}
if ((Calc.AGI.value <= 400000)) {
Bracket2();
}
}
}
function Bracket1() {
var Calc = document.NetIncome;
if (Calc.InputRad[0].checked) {
Calc.TaxableIncome.value = (parseFloat(Calc.AGI.value) - 200000) ;
Calc.AmtDue.value = Math.round((parseFloat(Calc.TaxableIncome.value) * 0.05)) ;
Calc.AmtLeft.value = (parseFloat(Calc.AGI.value) - parseFloat(Calc.AmtDue.value)) ;
Calc.TaxRate.value = (parseFloat(Calc.AmtDue.value) / parseFloat(Calc.AGI.value) * 100).toFixed(2) + " %";
}
else {
if (Calc.InputRad[1].checked) {
Calc.TaxableIncome.value = (parseFloat(Calc.AGI.value) - 400000) ;
Calc.AmtDue.value = Math.round((parseFloat(Calc.TaxableIncome.value) * .05)) ;
Calc.AmtLeft.value = (parseFloat(Calc.AGI.value) - parseFloat(Calc.AmtDue.value)) ;
Calc.TaxRate.value = (parseFloat(Calc.AmtDue.value) / parseFloat(Calc.AGI.value) * 100).toFixed(2) + " %";
}
}
}
function Bracket2() {
var Calc = document.NetIncome;
if (Calc.InputRad[0].checked) {
Calc.TaxableIncome.value = 0 ;
Calc.AmtDue.value = Math.round((parseFloat(Calc.TaxableIncome.value) * 0.05)) ;
Calc.AmtLeft.value = (parseFloat(Calc.AGI.value) - parseFloat(Calc.AmtDue.value)) ;
Calc.TaxRate.value = (parseFloat(Calc.AmtDue.value) / parseFloat(Calc.AGI.value) * 100).toFixed(2) + " %";
}
else {
if (Calc.InputRad[1].checked) {
Calc.TaxableIncome.value = 0 ;
Calc.AmtDue.value = Math.round((parseFloat(Calc.TaxableIncome.value) * 0.05)) ;
Calc.AmtLeft.value = (parseFloat(Calc.AGI.value) - parseFloat(Calc.AmtDue.value)) ;
Calc.TaxRate.value = (parseFloat(Calc.AmtDue.value) / parseFloat(Calc.AGI.value) * 100).toFixed(2) + " %";
}
}
}
function Bracket3() {
var Calc = document.NetIncome;
if (Calc.InputRad[0].checked) {
Calc.TaxableIncome.value = (parseFloat(Calc.AGI.value) - 200000) ;
Calc.AmtDue.value = Math.round((parseFloat(Calc.TaxableIncome.value) - 300000) * 0.09) + (300000 * 0.05) ;
Calc.AmtLeft.value = (parseFloat(Calc.AGI.value) - parseFloat(Calc.AmtDue.value)) ;
Calc.TaxRate.value = (parseFloat(Calc.AmtDue.value) / parseFloat(Calc.AGI.value) * 100).toFixed(2) + " %";
}
else {
if (Calc.InputRad[1].checked) {
Calc.TaxableIncome.value = (parseFloat(Calc.AGI.value) - 400000) ;
Calc.AmtDue.value = Math.round((parseFloat(Calc.TaxableIncome.value) - 600000) * .09) + (600000 * 0.05) ;
Calc.AmtLeft.value = (parseFloat(Calc.AGI.value) - parseFloat(Calc.AmtDue.value)) ;
Calc.TaxRate.value = (parseFloat(Calc.AmtDue.value) / parseFloat(Calc.AGI.value) * 100).toFixed(2) + " %";
}
}
}
function Couple() {
var Calc = document.NetIncome;
Calc.AGI.value = "";
Calc.TaxableIncome.value = "--------";
Calc.AmtDue.value = "--------";
Calc.AmtLeft.value = "--------";
Calc.TaxRate.value = "--------";
}
function Individual() {
var Calc = document.NetIncome;
Calc.AGI.value = "";
Calc.TaxableIncome.value = "--------";
Calc.AmtDue.value = "--------";
Calc.AmtLeft.value = "--------";
Calc.TaxRate.value = "--------";
}
function clearText(thefield){
if (thefield.value==thefield.value)
thefield.value = ""
}
</script>
</head>
and the html... Code: <body> <form name=NetIncome> <table border=5> <th align=left> <ol> <li>Select Individual or Joint filing status. <li>Enter your Adjusted Gross Income. <li>Submit to calculate. <li>Please reset after each calculation. </ol> </th> <tr> <td><font size=5><input type=radio name=InputRad value=PerHour onclick="Individual()"><u>Individual</u> <input type=radio name=InputRad value=PerYear onclick="Couple()"><u>Joint</u></font></td> </tr> <tr><td><input type=text name=AGI size=30 id="txtExamplethree" onfocus="clearText(this);" onsubmit="TotalGrossPerYear();" onblur="this.value=this.value.replace(/[^\d\.]/g, '');" value="Select filing status" maxlength="20" />Adjusted Gross Income </td></tr> <tr><td><input type=text name=TaxableIncome id="txtExampletwo" readonly="readonly" size=30 value="">Taxable Income</td></tr> <tr><td><input type=text name=AmtDue id="txtExampleone" size=30 readonly="readonly" value="">Amount Due in Taxes</font></td></tr> <tr><td><input type=text name=AmtLeft id="txtExample" size=30 readoanly="readonly" value="">Income after Tax</font></td></tr> <tr><td><input type=text name=TaxRate size=10 readonly="readonly">Tax Rate</td></tr> <tr><td align=center><input type="button" value="Submit" onfocus="TotalGrossPerYear(); formatNumber(); formatNumberone(); formatNumbertwo(); formatNumberthree();" /><input type=reset value="Reset Form"></td></tr> </table> </form> Similar TutorialsHi everyone, im new to javascript and I have created two forms.. a value will be put in the first field and the second field should display either $20 or $35 depending on the value of the first field. Im doing something wrong here.. but I cant see what. Any help is appreciated. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type" /> <title>Distance from Depot</title> </head> <body> <form id="distanceform"> <ul> <li> <label for="Distance from EverWarm Depot">Distance from Depot (km):</label> <input type="text" id="distance" class="large"/> </li> </ul> </form> <input name="Button1" type="button" value="calculate" onclick="deliverycost()"/> <form id="deliverycostform"> <ul> <li> <label for="Delivery Cost" >Delivery Cost:</label> <input type="text" id="deliverycost" class="large"/> </li> </ul> </form> <script> function deliverycost() { /* Here is the delivery cost: less than or equal to twenty kilometres is $20.00 greater than twenty kilometres is $35.00 */ var distance = document.forms["neworder"]["distance"].value; if(distance<20) { document.getElementById('deliverycost').innerHTML="$20"; } else { document.getElementById('deliverycost').innerHTML="$35"; } } </script> </body> </html> Is there a way to give an input or textarea field the focus and set the focus to begin right at the end of the current text in the field?
Hi I'm banging my head against this problem and I'd really appreciate some help. I think the problem is cause by my lack of understanding of how the browser (firefox 3.6.3) handles focus. A simplified version of my problem is: I've defined the function Code: function two_focus()
{
document.getElementById("two").blur();
alert("hello");
}
then in the body I have the form with two text boxes Code: <input id="one" type="text"><input id="two" type="text" onfocus="two_focus();"> When the page is loaded and I click in the second textbox I get the alert, all well and good. I OK the alert box, but when I click on box 1, or anywhere on the page for that matter, the function is called and the alert comes up. I just don't understand why the focus is being returned to the second box when I click anywhere in the browser window. Any comments will be gratefully received. If my php variable, (which is retrieved from a mysql table in the php code, not shown) is equal to "1", that means the member is not eligible to submit the form, so I want an alert() to say "member not eligible!". Else, I want it to continue to submit the form. Here is my code (which I can't seem to get to work): <head> <script src="js/jquery-1.4.2.js" type="text/javascript"></script> <script type="text/javascript"> function ismaxlength(obj){ var mlength=obj.getAttribute? parseInt(obj.getAttribute("maxlength")) : "" if (obj.getAttribute && obj.value.length>mlength) obj.value=obj.value.substring(0,mlength) } //this first script is for something else, to check the max length of characters in a text area </script> //here is the script in question <script type="text/javascript"> <!-- var mem_eligible = "<?= $is_mem_eligible ?>"; if (mem_eligible == "1") { function MoveOn() { alert('You are not yet eligible, please try again tomorrow!'); } } --> </script> </head> <form name="myform" action="postform.php" method="post" enctype="multipart/form-data"> <div> <input type="submit" name="Submit2" value="Submit Entries" onclick="MoveOn()"/> </div> </form> Please help, thanks! June Have a jsp page with 10 editable fields and in last Add Button.Now when user edit a field from value 10 to 20(example)and click on Add .Value will be changed and focus will return to the same field.similarly for other fields.how to to .any code sample?
I'm new in web-development. I've searched it but it's not found. I make a input then how i get value of it for javascript value?
How do I insert this javascript: <script language="JavaScript" type="text/javascript" src="http://www.ABC.com/members/display.php?token=email"></script> Into the values of this: <input id="Email" name="Email" type="text" size="30" /><input name="emailagent" type="HIDDEN" class="textfield" id="emailagent" value=''INSERT JAVASCRIPT" /> hey friend i am trying to use automatic html input creation using java script for my new project .... my problem is the field "type propositon 1:is it answer? ignore this one:" not come into input variable such as $_POST['prop1'] i used PHP Code: pint_r($_POST) and the result was Code: Array ( [radio1] => on [cid] => 65 [desc] => dfdfdfdfd [submit] => Submit ) why my javascript created input field come into role? my php html code is PHP Code: <table> <form action="new.php" method="post"> <tr><td> question type:<br /> True or False:<input type="radio" name="radio1"> Objective:<input type="radio" name="radio2"> Other:<input type="radio" name="radio3" > </td></tr> <textarea name="desc" rows="6" cols="35" ></textarea> <br /> <a href="javascript:add()" ><b>add proposition</b></a> <div id="cat"></div> <div id="num" style="display:none;"></div> <br> </table> and the java script is ... PHP Code: <script language="javascript" type="text/javascript"> function add() { k=document.getElementById("num").innerHTML k=parseInt(k); if(!k) {document.getElementById("num").innerHTML=1; k=1;} else{ document.getElementById("num").innerHTML=k+1; k++; } document.getElementById("cat").innerHTML+="<tr><td>type propositon "+(k)+":<input type=\"text\" name=\"prop"+k+"\"><td>is it answer? </td> <td> <input type=\"checkbox\" name=\"ans"+k+"\"></td><td><td> ignore this one:</td><input type=\"checkbox\" name=\"ign"+k+"\"></td></td></tr><br>" } </script> Hi! I want to insert flash player on my page, that user can change flv source. But I dont know how to make input field that change flv source. I tried to insert input field and button but dont know how to make it working, please help me Here is my flvplayer embed code: <script type="text/javascript" src="http://flvplayer.com/free-flv-player/flvplayer/swfobject/swfobject.js"></script> <div id="embed_player"> <h1>Please Upgrade Your Flash Player</h1> <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></p> </div> <script type="text/javascript"> var flashvars = { flvpFolderLocation: "http://flvplayer.com/free-flv-player/flvplayer/", flvpVideoSource: "http://flvplayer.com/media/audi_tdi_commercial.mp4", flvpWidth: "640", flvpHeight: "375", flvpInitVolume: "50", flvpTurnOnCorners: "true", flvpBgColor: "#FFFFFF" }; var params = { bgcolor: "#FFFFFF", menu: "true", allowfullscreen: "true" }; swfobject.embedSWF("http://flvplayer.com/free-flv-player/FlvPlayer.swf", "embed_player", "640", "375", "9.0.0", "http://flvplayer.com/free-flv-player/flvplayer/swfobject/expressInstall.swf", flashvars, params); </script> Hi all I have relatively easy task I need to accomplish but as per usual I have very little idea of how to do it. I have done a google search to no avail. Basically I need to: 1. Pull a value from inside a div Code: <div id="number">(invoice #1017)</span> 2. Populate a form input field with that value. Does this make sense? If not let me know if you need any more info. Thanks Hi, I'm trying to use a form which is existent on one of my sites and try re-creating a similar form on another site for the exact same purpose. Here is the URL for the form on our website Cast Iron Cookware Depot. I have everything duplicated but running into form validation errors. Right now without event entering any data into the form and also the verification code the form still gets submitted but ofcourse runs into "object expected" error at onsubmit="return validate(this);"> by IE Debugger. Below is the total code and would appreciate if any of you gurus point out where the mistake is and also why the exact same code is working on one site is not working on this site. Thanks much in advance. Please help me! ------------------------------------------------------------------------ Code:
<style>
.TableBG
{
background-color: #83a338;
color: #ffffff;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
}
.no
{
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #333333;
width: 35px;
text-align:right;
}
input, textarea {border: 1px inset #cccccc; font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; font-size: 12px;}
.input01 {width: 150px;}
.input02 {width: 250px;}
.button
{
background-color: #83a338;
color: #000000;
border: 1px outset #83a338;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; font-weight: bold; font-size: 12px;
}
</style><br />
<br />
<table width="600" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#FFFFFF" class="TableBG">
<tr>
<td bgcolor="#FFFFFF">
<FORM name="form1" method="POST" action="http://s.p8.hostingprod.com/@castironcookwaredepot.com/php/tellafriend.php" onsubmit="return validate(this);">
<FORM name="form1" method="POST" action="http://s.p4.hostingprod.com/@bestsafetyapparel.com/php/tellafriend.php" onsubmit="return validate(this);">
<table width="100%" border="0" cellpadding="5" cellspacing="0">
<tr>
<td class="TableBG"> </td>
<td class="TableBG"><strong>Your Name: </strong></td>
<td class="TableBG"><strong>Your Email: </strong></td>
</tr>
<tr>
<td colspan="3" height="5"></td>
</tr>
<tr>
<td> </td>
<td>
<input type="text" name="sName" class="input01" style="font-weight: bold;" /> </td>
<td>
<input type="text" name="sEmail" class="input02" size="40" style="font-weight: bold;" /> </td>
</tr>
<tr>
<td colspan="3" height="5"></td>
</tr>
<tr>
<td width="4%" class="TableBG"> </td>
<td width="36%" class="TableBG"> Your Friend's Name :</td>
<td width="60%" class="TableBG">Your Friend's Email:</td>
</tr>
<tr>
<td colspan="3" height="5"></td>
</tr>
<tr>
<td class="no"><strong>1.</strong></td>
<td>
<input type="text" name="name1" class="input01" /> </td>
<td>
<input type="text" name="email1" class="input02" size="40" /> </td>
</tr>
<tr>
<td class="no"><strong>2.</strong></td>
<td>
<input type="text" name="name2" class="input01" /> </td>
<td>
<input type="text" name="email2" class="input02" size="40" /> </td>
</tr>
<tr>
<td class="no"><strong>3.</strong></td>
<td>
<input type="text" name="name3" class="input01" /> </td>
<td>
<input type="text" name="email3" class="input02" size="40" /> </td>
</tr>
<tr>
<td class="no"><strong>4.</strong></td>
<td>
<input type="text" name="name4" class="input01" /> </td>
<td>
<input type="text" name="email4" class="input02" size="40" /> </td>
</tr>
<tr>
<td class="no"><strong>5.</strong></td>
<td>
<input type="text" name="name5" class="input01" /> </td>
<td>
<input type="text" name="email5" class="input02" size="40" /> </td>
</tr>
<tr>
<td class="TableBG"> </td>
<td colspan="2" class="TableBG">Your Message </td>
</tr>
<tr>
<td colspan="3" height="5"></td>
</tr>
<tr>
<td colspan="3" align="center">
<textarea name="comments" cols="65" rows="5" id="comments" style="width: 420px;"></textarea> </td>
</tr>
<tr>
<td class="TableBG"> </td>
<td colspan="3" class="TableBG">Enter Verification Code</td>
</tr>
<tr>
<td colspan="3" height="5"></td>
</tr>
<tr>
<td colspan="3" align="center" valign="absmiddle"><img src="http://s.p8.hostingprod.com/@castironcookwaredepot.com/php/captcha.php" align="absmiddle">
<input type="text" name="vercode" value="Enter Verification Code" onFocus="if(this.value=='Enter Verification Code') this.value='';" onBlur="if(this.value=='') this.value='Enter Verification Code';" size="25"/></td>
</tr>
<tr>
<td colspan="3" align="center">
<input type="submit" name="Submit" value=" Send Email " class="button" /> </td>
</tr>
</table>
</form>
</td>
</tr>
</table>
<script>
function validate(frm)
{
name = frm.sName;
email = frm.sEmail;
name1=frm.name1;
email1=frm.email1;
err_flag = 0;
if (name.value == "" || !removeSpaces(name.value))
{
alert ("Please enter proper Name!");
name.value="";
name.focus();
return false;
}
else if (email.value == "" || !validate_email(email.value))
{
alert ("Please enter proper Email!");
email.value="";
email.focus();
return false;
}
else if (name1.value == "" || !removeSpaces(name1.value))
{
alert ("Please enter proper Friend\'s Name!");
name1.value="";
name1.focus();
return false;
}
else if (email1.value == "" || !validate_email(email1.value))
{
alert ("Please enter proper Friend\'s Email!");
email1.value="";
email1.focus();
return false;
}
}
function validate_email(e)
{
var str=e;
var filter=/^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i
if (!filter.test(str))
return false;
else
return true;
}
function removeSpaces(string) {
var tstring = "";
string = '' + string;
splitstring = string.split(" ");
for(i = 0; i < splitstring.length; i++)
tstring += splitstring[i];
return tstring;
}
</script>
<br />
<br />
Regards Learner Hey there, I have a form which open in a jQuery Fancybox Window. The fancybox window opens automatically when the page loads. When it loads, I would like it to set focus on the username field in the form in the Fancybox window. I have found that this must be done when fancybox is envoked, thus I have tried the below code which does not work : Code: <script type="text/javascript">
jQuery(document).ready(function() {
$("#hidden_link").trigger('click');
document.getElementById('login_form.username').focus();
});
</script>
The form name is "login_form" and the field name is "username". Can anyone help???? Thanks a lot!!! Hi, Because I'm using an asp script to submit this form, I cannot do a validation on the submit and so have chosen to do the validation with the onblur and the onmouseout functions. The validation works well for the checking the first input, id CommenterName. If it's blank, the alert displays and then the cursor is moved to the email check. When the alert is dismissed the focus returns to the first input, but, and this is the problem, returning to the first input, triggers the second alert. How do I return the focus to the first field without triggering the next alert? Changing the order of the inputs in not an option. Code: function checkCompletitionName(){
if (document.getElementById("CommenterName").value.length == 0)
{
document.getElementById("CommenterName").style.backgroundColor = "#efefef";
alert("Please type your name.");
document.getElementById("CommenterName").focus();
return;
}
else
{
document.getElementById("CommenterName").style.backgroundColor = "white";
}
}
function checkCompletitionEmail(){
if (document.getElementById("Email").value.length == 0 || (document.getElementById("Email").value.search("@") == -1 || document.getElementById("Email").value.search("[.*]") == -1))
{
document.getElementById("Email").style.backgroundColor = "#efefef";
alert("Please check the email address for errors.");
return;
}
else
{
document.getElementById("Email").style.backgroundColor = "white";
}
}
function checkCompletitionComment(){
if (document.getElementById("Comment").value.length == 0)
{
document.getElementById("Comment").style.backgroundColor = "#efefef";
alert("Please type your comment.");
return;
document.getElementById("Comment").focus();
}
else
{
document.getElementById("Comment").style.backgroundColor = "white";
}
}
the HTML code: Code: <form name="form1" method="get" action="/asp/formmail.asp"> <p> <label class="labelContact">Select Category:</label> <select class="inputContact" name="category" id="category"> <option selected="selected" value="support" id="support">Support</option> <option value="sales" id="sales">Sales</option> <option value="other" id="other">Other</option> </select> </p> <p> <label class="labelContact" for="CommenterName">Name <span class="redasterisk">*</span>:</label> <input size="42" class="inputContact" name="nameCommenter" id="CommenterName" onblur="checkCompletitionName()" type="text" /> </p> <p> <label class="labelContact" for="Email">Email Address<span class="redasterisk"> *</span>:</label> <input size="42" class="inputContact" name="email_address" id="Email" onblur="checkCompletitionEmail()" type="text" /> </p> <p> <label class="labelContact" for="Phone">Phone Number:</label> <input id="phoneAreaCode" class="inputContact" onKeyUp="return autoTab(this, 3, event);" size="4" maxlength="3" /> - <input id="phonePrefix" onKeyUp="return autoTab(this, 3, event);" size="4" maxlength="3" /> - <input id="phoneLastFour" onKeyUp="return autoTab(this, 4, event);" size="5" maxlength="4" /> </p> <p> <label class="labelContact" for="RegistrationNo">Registration Number:</label> <input size="42" class="inputContact" name="registration" id="RegistrationNo" type="text" /> </p> <p> <label class="labelContact" for="CompanyName">Company Name:</label> <input size="42" class="inputContact" name="company_name" id="CompanyName" type="text" /> </p> <p>Comments <span class="redasterisk">*</span>:</p> <p><textarea rows="5" cols="58" name="comment" id="Comment" onmouseout="checkCompletitionComment()"></textarea></p> thank you for your help I tried to create a new text input once the last text box gets focus. But I cant even type in them because every time it gets focus a new text input is created! I really dunno what to do. Code: <html>
<head>
<script type="text/javascript">
function getTB(field)
{
var i = document.getElementById("f1").length + 1;
var cmd = "<input type=text name = "+ i + " onfocus=getTB() value = " + i + ">";
document.getElementById('f1').innerHTML = document.getElementById('f1').innerHTML + cmd;
document.getElementById(i-2).focus();
}
</script>
</head>
<body>
<form id ="f1">
<input type ="text" value ="hello" name="1" onFocus ="getTB(this)">
</form>
</body>
</html>
how to modify so not every time a new text input created when tried to type in? Hello everybody I have a page where I have several input text fields (the number of fields is variable), the input text fields are disable , only the first one is enable, as the user goes filling out the text fields, the next text field becomes available, each time the user fills out an input text field, the form is submitted. As I said, the number of text fields is variable, some times I have only one and other time I can have 7. I would like to create a javaScript function to put the next available text field ready to star writing, without having to click in the text field first. The id of my form is "reports" , the id of the table is,"run_params" and the id of my input texts is "inputp". I am using JSF, the HTML output generated for each field is id="reports:run_params:1:input" , the number 1 indicated that is the first input text, this number can go from 1 to 20. I have tried to create a code where I can read how many input fields I have and then create a loop that checks all of them and search for the field that is enable and empty, and put that field on focus. But so far my code doesn't work. I don't have too much experience with javaScript and I already have tried many different ideas, without success, I have not idea how to achieve this objective, because I don't know very well javascript's capabilities, so I don't know what it is possible and what it is not. Any help????!!! Thanks in advance So I have two buttons, and for one, it is simply "submit", no on submit needs to be used for it. The other one is "delete" and I wanna have a confirm box open when you click delete saying something like "are you sure you want to delete?" and clicking yes would delete it and no would not. Here is the javascript I have so far for it. Code: <script type="text/javascript">
function OnButton1()
{
document.simpForm.action = "<?php php stuff here ?>";
document.simpForm.target = "_self";
document.simpForm.submit(); // Submit update
return true;
}
function OnButton2()
{
document.simpForm.action = "delete.php?id=<?php php stuff here ?>";
document.simpForm.target = "_self";
document.simpForm.submit(); // Delete the company
return true;
}
</script>
Any help would be GREAT! Javascript is not my strong point I've built a site which involves some cool scrolling effects via javascript. I tested it in Chrome, Firefox, Safari, Opera and IE8. Worked Perfectly. Then, I try IE7, and its a dud. Tried from multiple computers, so it is an IE7 issue. Here's the issue. When the page loads normally, a flash intro plays and then the menu shows up. When you click on a menu option (only products and services work), it scrolls the image/layer inside of the div to the proper layerID. (so far, I only have products and services working.. ) When you click on the menu option in IE7, or earlier I'm guessing, It just scrolls to the menu image slice, not the proper layerID it calls for. Heres the link: www.designbyryanboog.com/spa Sorry about not posting code, but there is a lot. I appreciate ANY help, thanks! hi, I would like to pop up an edit window when I submit my form, my code below doesn't seem to work?! think my syntax is wrong soemwhere?! Code: function popUpBig(URL) {
day = new Date();
id = day.getTime();
eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=400,height=360,left = 220,top = 250');");
}
<form method="post" name="times"><input type="hidden" name="day" value="Monday" /><a type="submit" class="button" onSubmit="javascript:popUpBig('edit_day.php')" ><span>Edit</span></a></form>
I am trying to create a form that writes text to an HTML canvas when submitted. Eventually, the function that writes the text will be more complex. The problem is the text only appears briefly, because the function is only called once when the form is submitted. I want the function to be called continuously after the form is submitted. How do I do this? I have had very little experience with JS. A lame (failed) attempt... Code: <html>
<head>
</head>
<body>
<canvas id="canvas" width="790" height="605">
Sorry, your browser doesn't support HTML5
</canvas>
<form name="frm1" action=" " onsubmit="greeting()">
<input type="text" name="fname" />
</form>
</body>
<script type="text/javascript">
function init() {
//use canvas "canvas" and assign to variable canvas
canvas=document.getElementById("canvas");
c=canvas.getContext("2d");
}
function greeting()
{
c.fillText("var!!!", 100, 460);
var test = 1;
}
if (test == 1)
{
greeting();
}
init();
</script>
</html>
Thanks |
|||||||