JavaScript - Web Crawler With Customiseable Search Fields
Hi All,
We run a record label, and are looking for a free piece of software/server install that will allow us to enter several [Artist] - [Title] entries, and for that software to then search the internet/specific sites for if that song has been played/tracklisted anywhere. Is there something already in place for this job? Many Regards Similar TutorialsAbout a year ago I conceived of a monstrously foolish concept: Multiple Multidirection Conveyor Belt slideshows with Lightbox. With the help of the creator of jsCrawler, jscheuer, we made things work but I couldn't leave well enough alone. (the og thread for said discussion is here - no one seems to be home over there these days: http://www.dynamicdrive.com/forums/a...p/t-49625.html ) Before my beta site ever got off the ground I decided that Colorbox was more elegant ... and I still think so but dang if it didn't muss things up. The issue is this: the first click will give you the "rel="nofollow" target=_blank" effect, but all subsequent clicks will successfully trigger the Colorbox js. Check it out: http://www.coreyshead.com/beta/monstersandrobots.html Now I know it's nuts, that I'm totally hogging CPU with this boneheaded thing - and I may trim it down to three crawlers in the long run, or maybe even one, but the issue remains. What's tripping things up? I've tried all manner of things any non-js coder might but am obviously missing something: reordering the head, stripping elements to find the culprit. All I could come up with was: "Colorbox and Crawler don't play well together." What am I missing? Thanks. 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> <? } ?> In this case, Let's take Google Search as example: The code is JScript .NET, which is basically a .NET version of Javascript. Regardless of language, Anyone with appending type of skill can answer my question. This code is used in Fiddler(It's a Man-in-the-middle proxy) Code: if (oSession.uriContains("&q=")) // oSession is a Fiddler object session // uriContains() function, checks for case-insensitive string from the URI { var str = oSession.fullUrl; var sAppend = "test1+test2+test3"; if (!oSession.uriContains(sAppend)) { oSession.fullUrl = str.replace( "&q=","&q="+sAppend); } } For those who are confused, It says, If &q= is present in the URI, replace/append &q= with &q=test1+test2+test3 Problem: It appends test1+test2+test3 instantly, when it sees &q= in the URL. Basically, how do I make it wait until I click the submit/search button Thank you. Update: I heard about Onsubmit() event, but not really familiar with it. How do I use it? like, should I go to google source page and edit the form id? Also, Any other methods besides Onsubmit()? Hi Everyone! I have a website that I'm designing where I have the need to search multiple sites at specific times. By this I mean that In some cases, we would want to search only the internet using google, or only search the site that I've created (which currently uses the jse_search.js solution), or only our company's website. I currently have four different search boxes that will search either the internet, the internal site, a separate internal site, or a third-party website, which all working fine. The problem is that the search boxes take up quite a bit of space, and the layout is becoming cumbersome. Is there a way in Javascript I could use a single search box and a drop-down list to select which method to use? The code I'm currently using is below. With the exception of the Google search function, I've modified some of the site names to general site names and paths to preserve the company's anonymity: Code in the <head> tag: Code: <script language="JavaScript1.3" type="text/javascript" src="jse_form.js"> </script> Code in the <body> tag: Code: <!--Begin Internal Site Search 1!--> <div> <p style="text-align: center;"> <table border="0" cellpadding="0"> <tr><td><form name="jse_Form" onsubmit="search_form(jse_Form);return false"> <input type="text" name="d" size="30"> </tr></td> <tr><td> <input type="button" value="Internal Site Search 1" onclick="search_form(jse_Form)"> </form> </tr></td> </table> <!--End Internal Site Search 1!--> <!--Begin Internal Site Search 2!--> <div> <p style="text-align: center;"> <table border="0" cellpadding="0"> <tr><td> <!--webbot bot="Search" S-Index="all" S-Fields S-Text="Search for:" I-Size="20" S-Submit="Start Search" S-Clear="Reset" S-TimestampFormat="%m/%d/%Y" TAG="BODY" b-useindexserver="1" startspan --> <form action="http://sitesearch2.idq" method="POST"><input type="text" name="UserRestriction" size="30" value> </tr></td> <tr><td style="text-align: center;"> <input type="submit" value="Internal Site Search 2"></form> </form> <!--webbot bot="Search" i-checksum="4210" endspan --> </td></tr> </table> </div> <!--End Internal Site Search!--> <!--Begin Google Search!--> <form method="get" action="http://www.google.com/search"> <div> <p style="text-align: center;"> <table border="0" cellpadding="0"> <tr><td> <input type="text" name="q" size="30" maxlength="233" value="" /> </tr></td> <tr><td align="center"> <input type="submit" value="Google Search" /></td></tr> </table> </div> </form> <!--End Google Search!--> <!--Begin Third Party Search!--> <form id="keywordSearchForm" method="get" action="http://www.site3.html"> <div> <p style="text-align: center;"> <table border="0" cellpadding="0"> <tr><td> <input class="input" type="text" name="keyword" size="30" /> </tr></td> <tr><td align="center"> <input type="hidden" name="origin" value="keywordsearch" /><input id="go" class="button" tabindex="0" type="submit" value="Third Party Search" /> </td></tr> </table> </div> </form> <!--End Third Party Site Search!--> Hi experts, is it possible via Javascript to search certain websites with certain keywords without having to use specific search engines? example search only the following: 1. www.yyy.com 2. www.aaa.com 3. www.zzz.com for the keyword "Laminat" and open the sites accordingly. thx Hello people. I'm looking to create a simple search engine capable of searching multiple search engines simultaneously together (e.g. Google, Bing, Yahoo, etc.) and then displaying the results below for all sites on the same page. I don't want each search engine results page opening up in individual windows or anything, nor do I want people to have to manually select the search engine to search with. Just a single page where a user types in something, pressed [Enter] and then presented with all results from multiple sites on one page (without duplicates). I'm also looking to do this with image and torrent sites, etc. How would I go about doing this? Thanks a million guys. You have bigger brains than me. 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! 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? 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 am using a script that duplicates a fieldset and an onBlur event that updates a sub total when you enter a value into 3 fields in the set but I am having one glitch that I can not figure out and would appreciate any insight you can provide. Here is the trouble: The duplication of the fieldset works great. I have another script which is creating a sum ("sum") of the fields named "unitPrice" in the original fieldset. When I duplicate the fieldset that has the new "unitPrice" fields they do not get calculated into that sum. I am sure the "unitPrice" fields are being renamed in the new fieldset but what name would I use and how do I write it into the calculation so that the sub total ("sum") is updated with all of the "unitPrice" fields? Thanks for your help. Code: <!DOC HTML> <html> <head> <title> Untitled </title> <script type="text/javascript"> function insertAfter(newElement, targetElement) { var parent = targetElement.parentNode; if (parent.lastChild == targetElement) { parent.appendChild(newElement); } else { parent.insertBefore(newElement, targetElement.nextSibling); } } // Suffix + Counter var suffix = ':'; var counter = 1; // Clone nearest parent fieldset function cloneMe(a) { // Increment counter counter++; // Find nearest parent fieldset var original = a.parentNode; while (original.nodeName.toLowerCase() != 'fieldset') { original = original.parentNode; } var duplicate = original.cloneNode(true); // Label - For and ID var newLabel = duplicate.getElementsByTagName('label'); for (var i = 0; i < newLabel.length; i++) { var labelFor = newLabel[i].htmlFor if (labelFor) { oldFor = labelFor.indexOf(suffix) == -1 ? labelFor : labelFor.substring(0, labelFor.indexOf(suffix)); newLabel[i].htmlFor = oldFor + suffix + counter; } var labelId = newLabel[i].id if (labelId) { oldId = labelId.indexOf(suffix) == -1 ? labelId : labelId.substring(0, labelId.indexOf(suffix)); newLabel[i].id = oldId + suffix + counter; } } // Input - Name + ID var newInput = duplicate.getElementsByTagName('input'); for (var i = 0; i < newInput.length; i++) { var inputName = newInput[i].name if (inputName) { oldName = inputName.indexOf(suffix) == -1 ? inputName : inputName.substring(0, inputName.indexOf(suffix)); newInput[i].name = oldName + suffix + counter; } var inputId = newInput[i].id if (inputId) { oldId = inputId.indexOf(suffix) == -1 ? inputId : inputId.substring(0, inputId.indexOf(suffix)); newInput[i].id = oldId + suffix + counter; } } // Select - Name + ID var newSelect = duplicate.getElementsByTagName('select'); for (var i = 0; i < newSelect.length; i++) { var selectName = newSelect[i].name if (selectName) { oldName = selectName.indexOf(suffix) == -1 ? selectName : selectName.substring(0, selectName.indexOf(suffix)); newSelect[i].name = oldName + suffix + counter; } var selectId = newSelect[i].id if (selectId) { oldId = selectId.indexOf(suffix) == -1 ? selectId : selectId.substring(0, selectId.indexOf(suffix)); newSelect[i].id = oldId + suffix + counter; } } // Textarea - Name + ID var newTextarea = duplicate.getElementsByTagName('textarea'); for (var i = 0; i < newTextarea.length; i++) { var textareaName = newTextarea[i].name if (textareaName) { oldName = textareaName.indexOf(suffix) == -1 ? textareaName : textareaName.substring(0, textareaName.indexOf(suffix)); newTextarea[i].name = oldName + suffix + counter; } var textareaId = newTextarea[i].id if (textareaId) { oldId = textareaId.indexOf(suffix) == -1 ? textareaId : textareaId.substring(0, textareaId.indexOf(suffix)); newTextarea[i].id = oldId + suffix + counter; } } duplicate.className = 'duplicate'; insertAfter(duplicate, original); } // Delete nearest parent fieldset function deleteMe(a) { var duplicate = a.parentNode; while (duplicate.nodeName.toLowerCase() != 'fieldset') { duplicate = duplicate.parentNode; } duplicate.parentNode.removeChild(duplicate); } </script> <script> function myFunction(){ var the_fields = document.getElementsByName("unitPrice"); var the_sum = 0; for (var i=0; i<the_fields.length; i++){ if (the_fields[i].value != "" && !isNaN(the_fields[i].value)) { the_sum += Number(the_fields[i].value); } } document.repairform.sum.value = (the_sum.toFixed(2)); } </script> <SCRIPT LANGUAGE="JavaScript"> function CalculateTotal() { firstnumber = document.repairform.sum.value/100; secondnumber = document.repairform.tax.value; total = (firstnumber * secondnumber -0) + (document.repairform.sum.value -0); document.repairform.grandTotal.value = total.toFixed(2) ; } </SCRIPT> <script> function checkDecimal(obj, objStr){ var objNumber; if(isNaN(objStr) && objStr!=''){ alert('Value entered is not numeric'); objNumber = '0.00'; } else if(objStr==''){ objNumber = '0.00'; } else if(objStr.indexOf('.')!=-1){ if(((objStr.length) - (objStr.indexOf('.')))>3){ objStr = objStr.substr(0,((objStr.indexOf('.'))+3)); } if(objStr.indexOf('.')==0){ objStr = '0' + objStr; } var sLen = objStr.length; var TChar = objStr.substr(sLen-3,3); if(TChar.indexOf('.')==0){ objNumber = objStr; } else if(TChar.indexOf('.')==1){ objNumber = objStr + '0'; } else if(TChar.indexOf('.')==2){ objNumber = objStr + '00'; } } else{ objNumber = objStr + '.00'; } obj.value = objNumber; } </script> </head> <body> <form id="item_details" name="repairform" method="post" action="#" onSubmit="return false;"> <h2>Contact Information</h2> <fieldset> <table cellspacing="10"> <tr> <td> <label for="name"> Name: </label> </td> <td> <input type="text" id="name" name="name" /> </td> <td> <label for="form-phone"> Phone: </label> </td> <td> <input id="form-phone" type="tel" required> </td> </tr> <tr> <td> <label for="form-date"> Date: </label> </td> <td> <input id="form-date" type="date"required> </td> <td> <label for="form-datewanted"> Date Wanted </label> </td> <td> <input id="form-datewanted" type="date" required> </td> </tr> <tr> <td> <label for="form-address"> Address </label> </td> <td> <input id="form-address" type="text"> </td> </tr> </table> </fieldset> <h2>Vehicle Information</h2> <fieldset> <table cellspacing="10"> <tr> <td> <label for="form-ymc"> Year-Model-Color</label> </td> <td> <input id="form-ymc" type="text" required> </td> <td> <label for="form-make">MAKE</label> </td> <td> <input id="form-make" type="text"> </td> </tr> <tr> <td><label for="form-bodytype">BODY TYPE</label> </td> <td> <input id="form-bodytype" type="text"> </td> <td> <label for="form-unitno">UNIT NO.</label> </td> <td> <input id="form-unitno" type="text"> </td> </tr> <tr> <td> <label for="form-serialno">SERIAL NO.</label> </td> <td> <input id="form-serialno" type="text"> </td> <td> <label for="form-motorno">MOTOR NO.</label> </td> <td> <input id="form-motorno" type="text"> </td> </tr> <tr> <td> <label for="form-mileage">MILEAGE</label> </td> <td> <input id="form-mileage" type="text"> </td> <td> </td> <td> </td> </tr> </table> </fieldset> <h2>Repair Estimate</h2> <fieldset> <span class="tab"> <a href="#" onClick="cloneMe(this); return false;" class="cloneMe" title="Add">+</a> <a href="#" onClick="deleteMe(this); return false;" class="deleteMe" title="Delete">x</a> </span> <table cellspacing="10"> <tr> <td> <label for="repair_replace">Repair/Replace</label> </td> <td class="mainText"> <input class="radio" name="repair_replace" type="radio" value="Repair" />Repair<br> <input class="radio" name="repair_replace" type="radio" value="Replace" />Replace </td> <td> <label for="form-description">Description: </label> </td> <td > <textarea id="form-description" name="form-description" cols="5" rows="5" ></textarea> </td> </tr> <tr> <td> <label>PARTS AND MATERIALS </label> </td> <td><input name="unitPrice" value="" id="parts" onBlur="myFunction(); checkDecimal(this,this.value)" onFocus="this.focus();" class="dollar" /> </td> <td> <label>LABOR </label> </td> <td ><input name="unitPrice" value="" id="labor" type="text" onblur="myFunction(); checkDecimal(this,this.value)" class="dollar"/> </td> </tr> <tr> <td> <label>REFINISHING </label> </td> <td><input name="unitPrice" id="refinishing" type="text" onBlur="myFunction(); checkDecimal(this,this.value)" class="dollar"/> </td> <td> </td> <td > </td> </tr> </table> </fieldset> <h2>Price Estimate</h2> <fieldset> <table cellspacing="10"> <tr> <td><label>SUB TOTAL </label> </td> <td><input type="text" name="sum" class="dollar" readonly/> </td> <td> <label>Tax %</label> </td> <td> <input class="tax" type="text" name="tax" onBlur="CalculateTotal()" /> </td> </tr> <tr> <td> <label>GRAND TOTAL </label> </td> <td> <input type="text" name="grandTotal" class="dollar" readonly/> </td> <td> </td> <td > <p> <input type="submit" value="Send Estimate" onClick="myFunction()"> </p> </td> </tr> </table> </fieldset> <p> <input type="submit" value="Submit" class="button" /><input type="reset" value="Reset" class="button" /> </p> </form> </body> </html> Hi, I have absolutley no experience in using javascript so, if answering, please be gentle with me! I have a form (below) which I need the user to enter some/any data into every field. Can you please advise what code I need and where to put the code? Code: <form name="Contact Us" method="post" action="contact_form.php"> <p> </p> <table width="90%" border="0" align="center"> <tr> <td width="35%"><strong>Your Name:</strong></td> <td width="65%"><input name="name" type="text" id="name" size="26"></td> </tr> <tr> <td width="35%"><strong>House name/number:</strong></td> <td width="65%"><input name="house" type="text" id="house" size="26"></td> </tr> <tr> <td width="35%"><strong>Road name:</strong></td> <td width="65%"><input name="road" type="text" id="road" size="26"></td> </tr> <tr> <td width="35%"><strong>Town/City:</strong></td> <td width="65%"><input name="town" type="text" id="town" size="26"></td> </tr> <tr> <td width="35%"><strong>County:</strong></td> <td width="65%"><input name="county" type="text" id="county" size="26"></td> </tr> <tr> <td width="35%"><strong>Postcode:</strong></td> <td width="65%"><input name="postcode" type="text" id="postcode" size="26"></td> </tr> <tr> <td><strong>Telephone No:</strong> </td> <td><label> <input name="telephone" type="text" id="telephone" size="26"> </label></td> </tr> <tr> <td><strong>Email Address:</strong> </td> <td><label> <input name="email" type="text" id="email" size="26"> </label></td> </tr> <tr> <td><strong>Area of Interest: </strong></td> <td><label> <select name="interest" id="interest"> <option>Accommodation</option> <option>Conferencing / Banqueting</option> <option>Restaurant</option> <option>Weddings</option> <option>Other</option> </select> </label></td> </tr> <tr> <td><strong>Your Enquiry:</strong></td> <td><label> <textarea name="enquiry" cols="30" rows="3" id="enquiry"></textarea> </label></td> </tr> <tr> <td colspan="2"><strong>Subscribe to Mail List: </strong> <input name="subscribe" type="checkbox" id="subscribe" value="yes" checked></td> </tr> <tr> <td> </td> <td> </td> </tr> <tr> <td> </td> <td><label> <input type="submit" name="Submit" value="Submit"> </label> <label for="Submit"></label> <input type="reset" name="Submit2" value="Reset" id="Submit"></td> </tr> </table> Here's what I have so far in my validation part. However, I need help as to how to validate the following fields when the user clicks the submit button. -Radio Button *title (4 options) *member (3 options) *vegetarian (2 options) -Drop down lists *regstartdate (3 options) *regenddate (3 options) *confdinner (2 options) *paymethod (3 options) -UK Post Code (text box with maxlength=8) My current code shows 1 popup with all the error messages. Here's what I have so far: Redacted how can i copy the contents of the fields in this form so that i can just paste it anywhere? thanks! <!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 http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <SCRIPT LANGUAGE="JavaScript"> function copy(other) { var tempval=eval("document."+other) tempval.focus() tempval.select() therange=tempval.createTextRange() therange.execCommand("Copy") } </script> </head> <body> <form id="other" name="other" method="post" action=""> <p>DSL Number: <input type="text" name="phonenumber" /> </p> <p>Full Name: <input type="text" name="fullname" /> </p> <p>Country: <input type="text" name="country"/> </p> <p> <textarea name="txtarea" id="txtarea" cols="45" rows="5"></textarea> </p> <p> <input type="button" value="Copy" onclick="copy();" /> </p> </form> </body> </html> So I made myself this code so I could have a file upload input field, and the option to add more fields. but it got really big, and I have a fixed number of fields, can't quickly change the number I want. here's my javascript: Code: function new_field(id) { var f = document.getElementById(id); if(f.style.display == 'none') f.style.display = 'block'; } function hide_mais(id) { var g = document.getElementById(id); g.style.display = 'none'; } and the html: Code: <form> <div id="file_a" style="display:block"><input type="file" /><a href="#" id="link_a" onclick="new_field('file_b');hide_mais('link_a')">mais</a></div> <div id="file_b" style="display:none"><input type="file" /><a href="#" id="link_b" onclick="new_field('file_c');hide_mais('link_b')">mais</a></div> <div id="file_c" style="display:none"><input type="file" /><a href="#" id="link_c" onclick="new_field('file_d');hide_mais('link_c')">mais</a></div> <div id="file_d" style="display:none"><input type="file" /><a href="#" id="link_d" onclick="new_field('file_e');hide_mais('link_d')">mais</a></div> <div id="file_e" style="display:none"><input type="file" /><a href="#" id="link_e" onclick="new_field('file_f');hide_mais('link_e')">mais</a></div> <div id="file_f" style="display:none"><input type="file" /><a href="#" id="link_f" onclick="new_field('file_g');hide_mais('link_f')">mais</a></div> <div id="file_g" style="display:none"><input type="file" /><a href="#" id="link_g" onclick="new_field('file_h');hide_mais('link_g')">mais</a></div> <div id="file_h" style="display:none"><input type="file" /><a href="#" id="link_h" onclick="new_field('file_i');hide_mais('link_h')">mais</a></div> <div id="file_i" style="display:none"><input type="file" /><a href="#" id="link_i" onclick="new_field('file_j');hide_mais('link_i')">mais</a></div> <div id="file_j" style="display:none"><input type="file" /><a href="#" id="link_j" onclick="new_field('file_k');hide_mais('link_j')">mais</a></div> <div id="file_k" style="display:none"><input type="file" /><a href="#" id="link_k" onclick="new_field('file_l');hide_mais('link_k')">mais</a></div> <div id="file_l" style="display:none"><input type="file" /><a href="#" id="link_l" onclick="new_field('file_m');hide_mais('link_l')">mais</a></div> <div id="file_m" style="display:none"><input type="file" /><a href="#" id="link_m" onclick="new_field('file_n');hide_mais('link_m')">mais</a></div> <div id="file_n" style="display:none"><input type="file" /><a href="#" id="link_n" onclick="new_field('file_o');hide_mais('link_n')">mais</a></div> <div id="file_o" style="display:none"><input type="file" /><a href="#" id="link_o" onclick="new_field('file_p');hide_mais('link_o')">mais</a></div> <div id="file_p" style="display:none"><input type="file" /><a href="#" id="link_p" onclick="new_field('file_q');hide_mais('link_p')">mais</a></div> <div id="file_q" style="display:none"><input type="file" /><a href="#" id="link_q" onclick="new_field('file_r');hide_mais('link_q')">mais</a></div> <div id="file_r" style="display:none"><input type="file" /><a href="#" id="link_r" onclick="new_field('file_s');hide_mais('link_r')">mais</a></div> <div id="file_s" style="display:none"><input type="file" /><a href="#" id="link_s" onclick="new_field('file_t');hide_mais('link_s')">mais</a></div> <div id="file_t" style="display:none"><input type="file" /><a href="#" id="link_t" onclick="new_field('file_u');hide_mais('link_t')">mais</a></div> <div id="file_u" style="display:none"><input type="file" /><a href="#" id="link_u" onclick="new_field('file_v');hide_mais('link_u')">mais</a></div> <div id="file_v" style="display:none"><input type="file" /><a href="#" id="link_v" onclick="new_field('file_w');hide_mais('link_v')">mais</a></div> <div id="file_w" style="display:none"><input type="file" /><a href="#" id="link_w" onclick="new_field('file_x');hide_mais('link_w')">mais</a></div> <div id="file_x" style="display:none"><input type="file" /><a href="#" id="link_x" onclick="new_field('file_y');hide_mais('link_x')">mais</a></div> <div id="file_y" style="display:none"><input type="file" /><a href="#" id="link_y" onclick="new_field('file_z');hide_mais('link_y')">mais</a></div> <div id="file_z" style="display:none"></div> </form> any suggestions of a more efficient way to do that? also a button to reset form into initial state, with one field only, without having to refresh the page would be cool. thanks in advance I would appreciate assistance with the following case. Thank you in advance. I have two fields with values, e.g. Field1: 123456-1- 01 Field2: 01 -0001 I need to compare the last two digits of Field1( 01 ) against the First two digits of Field2 ( 01 ) I would assume OnChange moving from Field2. If the two do not match throw an alert. Thanks!! |