JavaScript - Script To Keep The Inputtext Fields Values
Hello
I am new to JavaScript , so I am learning as fast as possible, but I need to implement something in java scrip and I am not very sure how to do it I have a xhtml page (JSF project) I have inputText fields, every time I check a checkbox to display a text area, all the information that is in my inputText fields disappears (I already posted in the JSF forum), Is there any way to use JavaScrip to keep the values in those fields? Basically when I check the checkbox I call the onchange="this.form.submit()" , So I would like to know if using javaScript I can capture the values in those fields, and after I change the value of the checkbox and the information is erased, rewrite the values into those field Thanks in advance Similar TutorialsI'd like to create a basic form where 3 text input fields are named with the following names referrerId, referrerId2 & referrerId3. My goal is once the text fields within the form are populated with the users data, then once the user clicks submit, a new browser window opens up (in parent window preferably), navigating to the following url exactly as shown. Highlighted in red is the dynamic information I'd like appended. Vacation Packages &referrerId=FIRSTNAME&referrerId2=LASTNAME&referrerId3=AGENTNUMBER Any help would be greatly appreciated. Thanks! I am having some trouble trying to fix my math equation to calculate the total rent by aquiring values from my form fields. Converting the date fields to days and finding the number of days via two date fields is mainly where I am having trouble. Also, I am trying to have a window pop up before submission but the onclick event does not seem to function properly. Any suggestions would be greatly appreciated. Thank you. Below is the math equation I have come up with: Code: //calculate days from date field function calcTotal(date1, date2) { //assign variables var equip = parseFloat(document.forms[0].equipment.value) var pDate = parseFloat(document.forms[0].pickupDate.value) var pHours = parseFloat(document.forms[0].pickupHours.value) var pMinutes = parseFloat(document.forms[0].pickupMinutes.value) var rDate = parseFloat(document.forms[0].returnDate.value) var rHours = parseFloat(document.forms[0].returnHours.value) var rMinutes = parseFloat(document.forms[0].returnMinutes.value) // The number of milliseconds in one day var ONE_DAY = 1000 * 60 * 60 * 24 // Convert both dates to milliseconds var date1_ms = rDate.getTime() var date2_ms = pDate.getTime() // Calculate the difference in milliseconds var difference_ms = Math.abs(date1_ms - date2_ms) //calculate total cost and diplay in window.confirm() dialog box var pTime = pHours + pMinutes; var rTime = rHours + rMinutes; var total = (((difference_ms/ONE_DAY) - 1) * 24) * equip + ((rTime + (24 - pTime)) * equip); var OK = window.confirm(" The total rental cost is $" + total + "\n Click OK to accept, Cancel to decline"); if (OK) {return true} else {return false} } Below is the body section of the form: Code: <input type = "submit" name = "submit" value = "Submit Reservation" onclick = "calcTotal()"/> I found this "required fields" script for a form I built, and I'd like to know how to convert it to accept multiple required fields. I'm a total novice at JavaScript so any help is much appreciated. Here's the script: Code: <script language="javascript" type="text/javascript"> <!-- function check(form) { if (form.firstname.value == "") { alert("Please enter your first name!"); form.firstname.focus(); return false ; } return true ; } //--> </script> and the HTML is (super-shortened version)... Code: <form onsubmit="return check(this);"> <table> <tr> <td><label>First Name</label></td> <td><input name="firstname" /></td> </tr> </table> </form> Thanks for any help!!! I have one html text area in my JSP file. when i click on that text area, a pop-up will come, in that pop-up i have list of items. So after selecting a item from that pop-up list, need to click okay. so that text area will update with the selected value. In this case, i need to compare the first text area value and updated text area value. How can i do that in Java Script. I type something on the current textarea/input and all the values get removed after I add another field. Is there a solution? Code: <script language="Javascript" type="text/javascript"> <!-- //Add more fields dynamically. function addField(area,field,limit) { if(!document.getElementById) return; //Prevent older browsers from getting any further. var field_area = document.getElementById(area); var all_inputs = field_area.getElementsByTagName("input"); //Get all the input fields in the given area. //Find the count of the last element of the list. It will be in the format '<field><number>'. If the // field given in the argument is 'friend_' the last id will be 'friend_4'. var last_item = all_inputs.length - 1; var last = all_inputs[last_item].id; var count = Number(last.split("_")[1]) + 1; //If the maximum number of elements have been reached, exit the function. // If the given limit is lower than 0, infinite number of fields can be created. if(count > limit && limit > 0) return; //Older Method field_area.innerHTML += "<li><textarea id='steps' name='steps[]' rows='5' cols='40'></textarea><br /><input id='steps_image' name='steps_image[]' /></li>"; } //--> </script> <ol id="steps_area"><li> <textarea id='steps' name='steps[]' rows='5' cols='40'></textarea><br /><input id='steps_image' name='steps_image[]' /> </li> </ol> <input type="button" value="Add" onclick="addField('steps_area','',15);"/> The page loads and existing data is put in their correct fields. When I click 'add more' to add more fields to the form it does so and I am able to add new data. If on adding a new fields and its data I click 'add more' again it clears out the recently added data from the fields. The existing data that was present when the page first loaded is still their but all the new fields added data is cleared. how can I get it so the data stays, like in phpmyadmin when adding new fields. JS Code: function addmore(addwhat) { // count existing boxes to find out next number to use. // ? if (addwhat == 'addresses') { fieldid = 'addressesdiv'; } if (addwhat == 'namesnumbers') { fieldid = 'namesdiv'; } var dv = document.getElementById(fieldid).innerHTML; var lines = dv.match(/<br>/ig).length; if (addwhat == 'addresses') { document.getElementById('addressesdiv').innerHTML += '<textarea name="address' + lines + '" cols="30" rows="2"></textarea><br>'; } if (addwhat == 'namesnumbers') { document.getElementById('namesdiv').innerHTML += '<textarea name="name' + lines + '" cols="30" rows="2"></textarea><br>'; document.getElementById('mobilesdiv').innerHTML += '<textarea name="mobile' + lines + '" cols="30" rows="2"></textarea><br>'; } } PHP Code: <? if ($_POST['Submit'] == 'Submit') { echo("sent<br>"); for ($c = 1; $c <= (count($_POST)-1)/2; $c++) { echo("name" . $c . " = " . $_POST['name'.$c] ." mobile" . $c . " = " . $_POST['mobile'.$c] . "<br>"); } } $customer_id = "11"; // get existing data. // if not yet sent get data from databases $ok = "no"; if ($_POST['Submit'] != "Submit") { echo("<br>not sent<br>"); $res = db_query("SELECT * FROM `customer_client_names` WHERE `customer_id` = '". $customer_id ."'"); $maincount = mysql_num_rows($res); echo("<br>number of clients = ".$maincount."<br>"); for ($c = 1; $c <= $maincount; $c++) { $_POST['name'.$c] = mysql_result($res, $c-1, "client_name"); $_POST['mobile'.$c] = mysql_result($res, $c-1, "client_mobile"); echo("cn = ".$_POST['name'.$c] . " cm = ".$_POST['mobile'.$c] . "<br>"); } } else { // display last posted info echo("<br>sent<br>"); $ok = "yes"; // check if info was entrted correctly or not. for ($c = 1; $c <= ((count($_POST)-1)/2); $c++) { if ($_POST['name'.$c] != "" && $_POST['mobile'.$c] == "") { echo("<br>" . $_POST['name'.$c] ." was not given a mobile number<br>"); $ok = "no"; $maincount ++; } if ($_POST['name'.$c] == "" && $_POST['mobile'.$c] != "") { echo("<br>" . $_POST['mobile'.$c] ." mobile was not given a name<br>"); $ok = "no"; $maincount ++; } } } if ($ok == "no") { ?> <form name="form1" method="post" action="?ac=<?=$menu_item;?><? echo("&phpsession=" . $phpsession); ?>"> <div style="width: 850px;"> <div id="namesdiv" style="float: left; padding-right: 10px;">Client's Names<br> <? for ($c = 1; $c <= ((count($_POST)-1)/2)+1; $c++) { if ($_POST['name'.$c] != "" || $_POST['mobile'.$c] != "") { ?> <textarea name="<?='name'.$c;?>" cols="30" rows="2"><?=$_POST['name'.$c];?></textarea><br> <? } } ?> </div> <div id="mobilesdiv" style="float: left;">Client's Mobile numbers<br> <? for ($c = 1; $c <= ((count($_POST)-1)/2)+1; $c++) { if ($_POST['name'.$c] != "" || $_POST['mobile'.$c] != "") { ?> <textarea name="<?='mobile'.$c;?>" cols="30" rows="2"><?=$_POST['mobile'.$c];?></textarea><br> <? } } ?> </div> </div> <br style="clear: both;"> <a href="#" onClick="javascript:addmore('namesnumbers'); return false;" >Add more</a> <input type="hidden" name="customer_id" value="<?=$customer_id;?>"> <input type="submit" name="Submit" value="Submit"> </form> <? } ?> Hi, Can anyone tell me How to send values from application resources.properties file to a java script function in a jsp Thanks in Advance, John Ven Hi gud mng, I have one problem... How to process textbox values/ call textbox values in JS through a Java program. My text box values are dates. I have to process these dates. Like in online banking we select day to know our transactions. After submitting we get results. remember my files are in my directory only. No need of database. My files are look like 20100929, 20100930, 20101001 For epoch_classes.js, epoch_styles.css u can download coding from this link : http://www.javascriptkit.com/script/...ch/index.shtml Code: Code: <html> <table width="900" border="0" cellpadding="10" cellspacing="10" style="padding:0"> <tr><td id="leftcolumn" width="170" align="left" valign="top"> <div style="margin-left:0px;margin-top:0px"><h3 class="left"><span class="left_h2">Select Option</span></h3> <a rel="nofollow" target="_top" href="day_wise.htm" >Day-wise</a><br /> <br /> <a rel="nofollow" target="_top" href="between.htm" >Between Days</a> <link rel="stylesheet" type="text/css" href="epoch_styles.css" /> <script type="text/javascript" src="epoch_classes.js"></script> <script type="text/javascript"> var cal1, cal2; window.onload = function () { cal1= new Epoch('epoch_popup','popup',document.getElementById('popup_container1')); cal2= new Epoch('epoch_popup','popup',document.getElementById('popup_container2')); }; /*............*/ function confirmation(f) { var startdate = f.fromdate.value var enddate = f.todate.value var myday=new Date() var yr=myday.getFullYear() var mn=myday.getMonth()+1 var dt=myday.getDate() var today="" var present, ys, ms, ds, ye,me,de, start, end if(mn < 10) { mn = "0" + mn } if(dt <10) { dt = "0" + dt } today= yr + "/" + mn + "/" + dt present=yr + "/" + mn + "/" +dt if (today < startdate ) { alert (" Start date should not be exceed to-day's date " + present ) startdate.focus() return false } if (today < enddate ) { alert (" End date should not be exceed to-day's date " + present ) enddate.focus() return false } if (today == startdate ) { alert(" You are selected to-days date as Starting day" ); } var answer = confirm("Do you want to continue ?") if (answer) { if( startdate < enddate) alert("Dates between " + startdate + " to " + enddate + " are confirmed" ) else alert("Dates between " + enddate + " to " + startdate + " are confirmed" ) } else { alert("Date not confirmed") window.location="to_date.htm"; } ys= startdate.substring(0,4); ms= startdate.substring(5,7); ds= startdate.substring(8,10); start=ys + "" + ms + "" +ds ye= enddate.substring(0,4); me= enddate.substring(5,7); de= enddate.substring(8,10); end=ye + "" + me + "" +de } /*.......................................................*/ </script> <div style="margin-left:100px;"> <body> <style type="text/css"> #conf { margin-left:115px; } </style> <td align="left" valign="top"> <table width="100" border="0" cellpadding="0" cellspacing="0"> <td style="padding-top:0px"> </table> <h4>From Date</h4> <form name= "formbet" id="placeholder" method="post" action="#" > <input id="popup_container1" type="text" name= "fromdate" maxlength="10" size="20"/> <td align="left" valign="top"> <table width="300" border="0" cellpadding="0" cellspacing="0"> <td style="padding-top:20px"> <h4>To Date</h4> <input id="popup_container2" type="text" name= "todate" maxlength="10" size="20"/> <br /> <br /> <input id="conf" type="button" onclick="confirmation(this.form)" value="Submit"> </form> </body> </html> In my coding, ys, ms, ds represents year starting, month starting, starting day... ye, me, de represents end... start,end gives file names in the format of yyyymmdd now i want to process files from 20100101 to 20100930 means from date is 2010/01/01 and to date is 2010/09/30 if i press submit button the files from 20100101 to 20100930 are processes here ys=2010 ms=01 ds =01 and ye=2010 me=09 de= 30 For this how do i call these textbox values (from date text box and todate) to another program (java) Thanks in advance. I have a bunch of checkboxes like below that the user can check some or all and click the button and see the values of all the selected checkboxes. How can I do that? Code: <script> function alertValues(){ } </script> <input type="checkbox" class ="normal2" value="131971" name="list[]" > <input type="checkbox" class ="normal2" value="131973" name="list[]" > <input type="checkbox" class ="normal2" value="131975" name="list[]" > <input type="checkbox" class ="normal2" value="131977" name="list[]" > <input type="button" onClick="alertValues()" Hi, What's a good way/ideal data structure to achieve this? The objective of the code/function is to map user-inputted strings into a pair of specific, hard-coded strings. For example, say the user types "firefox" or "ff", or "fx". The output would be the pair ["browser", "mozilla"], for example. I'm currently using a multidimensional array, but it feels inefficient and I'm having trouble mapping an arbitrary number of inputs into 2 outputs. Code: var strings = [ ["input1", "output1a"], ["input2", "output1a"], ["input3", "output1a"], ["input1", "output1b"], ["input2", "output1b"], ["input3", "output1b"] ]; How should I map the elements ["input1", "input2", "input3"] => ["output1a", "output1b"] ? Another method I used previously was a massive switch statement. This fulfills my needs, but I'm not sure about the efficiency (though if I remember correctly, switch statements become more efficient as size grows, since it uses a hash table?). Code: switch (input) { case "ff": case "firefox": case "fx" : case "ffox": return ["browser", "mozilla"]; case "ie": case "internet explorer": return ["browser", "microsoft"]; ... } Hi folks. I am new to javascript so please go easy on me if this is a silly request Basically I have a table generated by a php script with a dynamic number of rows and columns. Here is a sample of the output from this script: Code: <tr> <td style='width:60px'><a href='index.php?inc_id=30' onclick='return confirmDelete(this)'>Remove</a></td> <td style='text-align:center'>test</td> <td ><input type='text' name='0inccol0' value='$432.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='0inccol1' value='$432.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='0inccol2' value='$432.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='0inccol3' value='$432.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='0inccol4' value='$432.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='0inccol5' value='$432.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='0inccol6' value='$432.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='0inccol7' value='$432.00' style='text-align:center; background-color:#cccccc'/></td> </tr> <tr> <td style='width:60px'><a href='index.php?inc_id=31' onclick='return confirmDelete(this)'>Remove</a></td> <td style='text-align:center'>test2</td> <td ><input type='text' name='1inccol0' value='$213.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='1inccol1' value='$213.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='1inccol2' value='$213.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='1inccol3' value='$213.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='1inccol4' value='$213.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='1inccol5' value='$213.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='1inccol6' value='$213.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='1inccol7' value='$213.00' style='text-align:center; background-color:#cccccc'/></td> </tr> <tr> <td style='width:60px'><a href='index.php?inc_id=32' onclick='return confirmDelete(this)'>Remove</a></td> <td style='text-align:center'>test3</td> <td ><input type='text' name='2inccol0' value='$65.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='2inccol1' value='$65.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='2inccol2' value='$65.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='2inccol3' value='$65.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='2inccol4' value='$65.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='2inccol5' value='$65.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='2inccol6' value='$65.00' style='text-align:center; background-color:#cccccc'/></td> <td ><input type='text' name='2inccol7' value='$65.00' style='text-align:center; background-color:#cccccc'/></td> </tr> What I want to do is create a row of 'totals' fields at the bottom of this table that will sum the fields in the column above. Looking at the naming convention above, the first number is the row, the number at the end is the column so I will want to sum all of the input values with a name ending in 0 in the first 'total' field, all the input values with names ending in 1 in the next and so on. The number of rows and columns is dynamic based on the users selections prior to buiding the table. The reason I am using input fields is that I would also like an event (onChange/onBlur?) that will update the totals fields if a user manually changes the value in one of the inputs. Any advice on this will be appreciated! ok I have a PHP form that I want to make Name Email and Phone required using javascript how would I do this here is my .php and html form. I can't get anything to work. Please Help Code: <?PHP $to = ""; $subject = "Results from your Request Info form"; $headers = "From: Tampabaychartering.net"; $forward = 0; $location = ""; $date = date ("l, F jS, Y"); $time = date ("h:i A"); $msg = "Below is the result of your feedback form. It was submitted on $date at $time.\n\n"; if ($_SERVER['REQUEST_METHOD'] == "POST") { foreach ($_POST as $key => $value) { $msg .= ucfirst ($key) ." : ". $value . "\n"; } } else { foreach ($_GET as $key => $value) { $msg .= ucfirst ($key) ." : ". $value . "\n"; } } mail($to, $subject, $msg, $headers); if ($forward == 1) { header ("Location:$location"); } else { header("Location: http://www.tampabaychartering.com/booking.html"); exit (); } ?> <hr> <form action="booking.php" method="post" name="ContactForm" onsubmit="return ValidateContactForm();"> <p align="left"> <b><font face="Comic Sans MS" size="4" color="#003366">Type of Charter <select size="1" name="type_of_charter"> <option selected>Flats Fishing</option> <option>Inshore Fishing</option> <option>Offshore Fishing</option> </select></font></b></p> <p align="left"> <b><font face="Comic Sans MS" size="4" color="#003366">Have you fished with me before? <select size="1" name="have_fished_with_you_before"> <option>yes</option> <option selected>no</option> </select></font></b></p> <p align="left"><font face="Comic Sans MS" size="4" color="#003366"><b>How many days do you want to fish? </b></font><b> <font face="Comic Sans MS" size="4" color="#003366"> <select size="1" name="days_you_want_to_fish"> <option selected>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> </select> </font></b></p> <p align="left"><b><font color="#003366" size="4" face="Comic Sans MS">How Long of a trip do you want <select size="1" name="how_long_do_you_want_to_fish"> <option selected>Full Day Flats $450</option> <option>Full Day Inshore $450</option> <option>Full Day Offshore $650</option> </select></font></b></p> <p align="left"><b><font face="Comic Sans MS" size="4" color="#003366">How many people in your party? For parties of more than 4 please call before booking.<select size="1" name="how_many_people"> <option>1</option> <option selected>2</option> <option>3</option> <option>4</option> </select></font></b></p> <p align="left" style="margin-top:"> <b><font face="Comic Sans MS" size="4" color="#003366">How many adults? <select size="1" name="adults_in_group"> <option selected>1</option> <option>2</option> <option>3</option> <option>4</option> </select> How Many children under 12? <select size="1" name="number_of_children"> <option>0</option> <option>1</option> <option>2</option> <option>3</option> </select></font></b></p> <p align="left"><b><font color="#003366" size="4" face="Comic Sans MS">Choose the date Of your Charter.</font></b></p> <p align="left"><b><font color="#003366" face="Comic Sans MS" size="4"> <select size="1" name="Charter_Date"> <option selected>January</option> <option>February</option> <option>March</option> <option>April</option> <option>May</option> <option>June</option> <option>July</option> <option>August</option> <option>September</option> <option>October</option> <option>November</option> <option>December</option> </select> <select size="1" name="day"> <option selected>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> <option>6</option> <option>7</option> <option>8</option> <option>9</option> <option>10</option> <option>11</option> <option>12</option> <option>13</option> <option>14</option> <option>15</option> <option>16</option> <option>17</option> <option>18</option> <option>19</option> <option>20</option> <option>21</option> <option>22</option> <option>23</option> <option>24</option> <option>25</option> <option>26</option> <option>27</option> <option>28</option> <option>29</option> <option>30</option> <option>31</option> </select> <select size="1" name="year"> <option selected="">2011</option> <option>2012</option> <option>2013</option> <option>2014</option> </select></font></b></p> <p align="left"><b><font face="Comic Sans MS" size="4" color="#003366">Payment method preffered for deposit?<select size="1" name="Deposit_Payment_Method"> <option>Credit Card</option> <option selected>Money Order</option> </select></font></b></p> <p><strong><font color="#003366" size="4" face="Comic Sans MS">How can I get in touch with you?</font></strong></p> <dl> <dd> <table height="150"> <tr> <td height="27"> <p align="left"><b> <font size="4" face="Comic Sans MS" color="#003366">Name </font></b> <td height="27"> <p align="left"> <font face="Comic Sans MS" size="4"><b><font color="#003366"> <input type="text" size="35" maxlength="256" name="name"> </font></b><font color="#FF0000">required</font><b><font color="#003366"> </font></b></font> </tr> <tr> <td height="27"> <p align="left"><b> <font size="4" face="Comic Sans MS" color="#003366">E-mail </font> </b> <td height="27"> <p align="left"><font face="Comic Sans MS" size="4"><b> <font color="#003366"> <input type="text" size="35" maxlength="256" name="email"> </font></b></font> </tr> <tr> <td height="27"> <p align="left"><b> <font size="4" face="Comic Sans MS" color="#003366">Home </font></b> <td height="27"> <p align="left"> <font face="Comic Sans MS" size="4"><b><font color="#003366"> <input type="text" size="35" maxlength="256" name="phone"> </font></b><font color="#FF0000">required 10 digits </font><font color="#003366"> </font></font></tr> <tr> <td height="27"> <b><font size="4" face="Comic Sans MS" color="#003366">Work</font></b><td height="27"> <font size="4" face="Comic Sans MS" color="#003366"><b> <input type="text" size="35" maxlength="256" name="Work_number"></b></font></tr> <tr> <td height="27"> <p align="left"><b> <font size="4" face="Comic Sans MS" color="#003366">Cell</font></b><td height="27"> <p align="left"> <font face="Comic Sans MS" size="4"><b><font color="#003366"> <input type="text" size="35" maxlength="256" name="User_cell "> </font></b></font> </tr> </table> </dd> </dl> <p align="left"><font face="Comic Sans MS"><b><font size="4" color="#003366">What is the best time to call? </font></b> <font color="#003366"><b><font size="4">From</font></b></font></font><font face="Comic Sans MS" size="4"><b><font color="#003366"><select size="1" name="best_time_to_call"> <option selected>8am</option> <option>9am</option> <option>10am</option> <option>11am</option> <option>12am</option> <option>1pm</option> <option>2pm</option> <option>3pm</option> <option>4pm</option> <option>5pm</option> <option>6pm</option> <option>7pm</option> <option>8pm</option> <option>9pm</option> <option>10pm</option> </select> </font></b></font><font face="Comic Sans MS"> <b> <font size="4" color="#003366">To </font></b></font> <font face="Comic Sans MS" size="4"><b><font color="#003366"><select size="1" name="until"> <option>8am</option> <option>9am</option> <option>10am</option> <option>11am</option> <option>12am</option> <option>1pm</option> <option>2pm</option> <option>3pm</option> <option>4pm</option> <option>5pm</option> <option>6pm</option> <option>7pm</option> <option>8pm</option> <option>9pm</option> <option selected>10pm</option> </select> </font></b></font> <p align="left"><b><font face="Comic Sans MS" size="4" color="#003366">How would you prefer to be contacted? <select size="1" name="Prefer_to_be_contacted_by"> <option selected>Home Phone</option> <option>Work Phone</option> <option>Cell Phone</option> <option>E-mail</option> </select></font></b><p align="left"><b> <font color="#003366" face="Comic Sans MS" size="4">What time zone are you in <select size="1" name="Time_zone"> <option selected>Eastern</option> <option>Central</option> <option>Mountain</option> <option>Pacific</option> <option>Out of USA</option> </select></font></b><p align="left"><font color="#FF0000" size="4"><b>Questions or comments about your trip</b></font></p> <p align="left"><textarea rows="5" name="Comments" cols="67"></textarea></p> <p align="left"> </p> <p align="left"> <b> <font color="#003366" size="4" face="Comic Sans MS">We will contact you as soon as possible to finish Booking your fishing trip.</font></b></p> <p> <input type="submit" value="Submit"> <input type="reset" value="Clear Form"></p> </form> Hi all, I'm new to here and JS but I have question for you! So I have this form with inputs that are considered arrays in my PHP code: Code: <input type="checkbox" name="1" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="2" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="3" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="4" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="5" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="6" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="7" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="8" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="9" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="10" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="11" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="12" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="13" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="14" /> <input name="ii[]" type="text"> <br /> <input type="checkbox" name="15" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="16" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="17" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="18" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="19" /> <input name="i[]" type="text"> <br /> <input type="checkbox" name="20" /> <input name="i[]" type="text"> <br /> I don't want to keep adding in new spots every time a user want to add a new field. I would like them to be able to press a button that will add another one of those fields and so on. I'm not sure how this can be achieved but that's why I am turning to you! Thanks! Hello I am building a registration page . If the user completes all the required field i load the info into the database but if there are missing fields I combined some javascript into php to display next to the empty field a note that it should be filled. This is my code : Code: <?php if (isset($_POST['submit'])) { $username =$_POST['username']; $password =$_POST['password']; $password2 =$_POST['password2']; $firstname =$_POST['firstname']; $lastname =$_POST['lastname']; $email =$_POST['email']; $address =$_POST['address']; $city =$_POST['city']; $state =$_POST['state']; $zip =$_POST['zip']; $dob =$_POST['dob']; if (empty($username)){ ?> <script language="javascript"> var user =true </script> ;<? } if (empty($password)){ ?> <script language="javascript"> var pass =true </script><? ; } And it goes on................... Then next to the inpput box I display a text in case the user didn't fill in the info like this and by the way the above code is in my validate.php page wich i include in the main registration page Code: <?php include ('includes/validate.php');?> <form action="registration.php" method= "post" > <fieldset> <legend>sitename Registration</legend> <p> <label for"username">Username</label> <input type "text" name=username /> <script type="text/javascript"> if (user == true) { document.write("Please enter a Username of your choice"); } </script> </p> <p> <label for"password">Password</label> <input type "password" name=password /> <script type="text/javascript"> if (pass == true) { document.write("Please choose a Password"); } </script> </p> <p> <label for"password2">Re-type Password</label> <input type "pass2" name=password2 /> <script type="text/javascript"> if (pass2 == true) { document.write("Please re-type your Password"); } </script> </p> And it goes on......for the rest of the input fields. I need some help with a solution for when the user fills in the info and pushes the "register" button the page refreshes and it whipes all the info the user already input but it does display the warnings where the user didn't input any data, so what would be the best way to go to keep the data that the user entered.Thank you. I am in need of some help. I have a request from a client to have four text fields added together as soon as they input the number. They want the numbers to add together with out having to hit a submit button or have the page change. I have seen and been able to get two out of the four to add together but i can't get the rest. I am pretty new to JS so please be gentle. But any help is greatly appreciated. this is the code i have been trying to work with: [CODE] function calc(A,B,SUM) { var one = Number(A); if (isNaN(one)) { alert('Invalid entry: '+A); one=0; } var two = Number(document.getElementById(B).value); if (isNaN(two)) { alert('Invalid entry: '+B); two=0; } document.getElementById(SUM).value = one + two; } <input name="sum1" id="op1" value="" onChange="calc(this.value,'op2','result')" /> and another number: <input name="sum2" value="" id="op2" onChange="calc(this.value,'op1','result')" /> Their sum is: <input name="sum" value="" id="result" readonly style="border:0px;"> [CODE] Hi, i have this code that generate 10 rows with form fields: Code: <form> <?php for($i=1;$i<=10;$i++) {?> <div id="rowz-rep"> <div class="row1"><?=$i?></div> <div class="row2a"><input name="title[]" type="text" class="fieldSubmit"/></div> <div class="row3a"><input name="url[]" type="text" class="fieldSubmit"/></div> <div class="row4a"><select name="type[]" class="dropSubmit"><? foreach($allowed_types as $at) { echo '<option value="'.$at.'">'.$at.'</option>'; }?></select></div> </div> <? }?> </form> I need that onclick with JS add 10 more rows so i get something like Code: <?php for($i=1;$i<=20;$i++) {?> I want to be able to add fields to a form with JavaScript, already had a thread about this in the PHP section and someone gave me some code. But that didn't seem to work So here is some other code: JavaScript: Code: var my_div = null; var newDiv = null; function addElement() { // create a new div element // and give it some content newDiv = document.createElement("div"); newDiv.innerHTML = "<label for=\"column\">Column Name: </label><input style=\"margin-bottom:1em;\" type=\"text\" name=\"column[]\" id=\"column\">"; // add the newly created element and it's content into the DOM my_div = document.getElementById("org_div1"); document.body.insertBefore(newDiv, my_div); } HTML: Code: <div class="login"> <form name="tbCreate" method="post"> <label for="tableName">Table Name: </label> <input type="text" name="tableName"><br /> </form> <input type="button" name="addElement" onClick="addElement()" value="Add Column"> </div> <div id='org_div1'></div> Problem is, it only works if the org_div1 div not between any other tags apart from <body></body>. How can I make it so that the div can be put between the form tags? Hi All, I have two scripts which I want to try and integrate. I am using a nice gallery script to show thumbnails which are appended to a an image wrapper which on click of the thumbnail shows the larger image in the image wrapper, I am trying to implement cloud zoom which is a plugin which uses image srcs to then point to an anchor href to show another larger zoom image either in the same place.. which is what I am trying to do or in another div beside. I have had to set me img srcs up in a certain way to easily enter some product details. and I need to try an manipulate the code to make it work to suit my file layout. I am using a var= images [ with a series of file locations and info such as below { src: 'romanticabride/thumbs/tn_Shauna.jpg', srcBig: 'romanticabride/images/Shauna.jpg', title: 'Shauna', longDescription: '<b><H1>Shauna</H1></b><br><b>Romantica Of Devon <br><br><h2>Sizes Available:</h2><br> 6 - 32.<b><br><b><br><b><b><b><H2>Colours Available:</h2><b><br>Various<br>Please Enquire Below<br><br><br><br><a href="mailto:tracy@cherishbridal.co.uk?subject=Web Enquiry Regarding Romantica Shauna Bridal Gown"class="enquiry rose glow" >Click To Enquire About This Item </a>' }, what I need is for cloud zoom to work when the main image wrapper is hovered over which means it will need to add a class or when the whichever srcBig: is hovered over it gets wrapped by href to make the script work . one of my pages is http://www.cherishbridal.co.uk/romaticabride.html the cloud zoom script is at http://www.professorcloud.com/mainsite/cloud-zoom.htm.. I am happy to share a jsfiddle with someone or explain further or post some code. Thank you in advance |