JavaScript - Most Probably Js Error-all Fields In A Web-app Blank
A PHP/JS application that runs fine on the live server misbehaves on localhost. All the prefilled fields are showing empty. Any help would be appreciated.
Thanks. Will update the thread with the code soon. Please let me know if there is a configuration error or general JS error. One error I get is something like : "Object does not support this method " or so.... Pls help Similar TutorialsSo, I'm trying to make a function that marks a specific form field if it triggers an error when the form submits. Doesn't seem to work, though. The function to mark the form field resides in a .js file separate from the function that validates the form. Not sure if that matters, but thought I'd post it here just to be sure. Here's the code for the field marking script: Code: function markFormField(fieldInError) { // start by changing its background color fieldInError.style.backgroundColor = "#FF99FF"; // check the parent tag to make sure it's a label if (fieldInError.parentNode.tagName == "LABEL") { // if it is, change the font color fieldInError.parentNode.style.color = "#FF0000"; } } Here's the code that validates the form: Code: function checkNewsInput() { // see if the DOM can be used if (!document.getElementById) return; // otherwise, set up the variables var newsCat = document.getElementById("category"); var newsTitle = document.getElementById("title"); var newsBody = document.getElementById("body"); var newsDesc = document.getElementById("desc"); var newsTags = document.getElementById("tags"); var newsInfo = document.getElementById("info"); var newsPwd = document.getElementById("pwd"); /* NOTE: cursorToEnd is a function I got from a helpful member of this forum. Its code is not listed in this post. */ if (newsCat.value == "") { window.alert("Please select a category."); return false; markFormField(newsCat); } else if (newsTitle.value.length < 5 || newsTitle.value == "") { window.alert("The title must be at least 5 characters in length."); return false; markFormField(newsTitle); cursorToEnd(newsTitle); } else if (newsBody.value.length < 10 || newsBody.value == "") { window.alert("The body of the post must be at least 10 characters in length."); return false; markFormField(newsBody); cursorToEnd(newsBody); } else if (newsDesc.value.length < 10 || newsDesc.value == "") { window.alert("The description must be at least 10 characters in length."); return false; markFormField(newsDesc); cursorToEnd(newsDesc); } else if (newsTags.value.length < 5 || newsTags.value == "") { window.alert("The tags field must be at least 5 characters in length."); return false; markFormField(newsTags); cursorToEnd(newsTags); } else if (newsInfo.value.length < 10 || newsInfo.value == "") { window.alert("The info must be at least 10 characters in length."); return false; markFormField(newsInfo); cursorToEnd(newsInfo); } else if (newsPwd.value == "") { window.alert("Please enter your password."); return false; markFormField(newsPwd); cursorToEnd(newsPwd); } else { // all is good, so let the form submit return true; } } 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, in my code I am checking a form field against a database Code: <script type="text/javascript"> $(document).ready(function() { $("#DiscountCode").blur(function() { //remove all the class add the messagebox classes and start fading $("#msgbox").removeClass().addClass('messagebox').text('Checking code...').fadeIn("slow"); //check the username exists or not from ajax $.post("check-code.php",{ DiscountCode:$(this).val() } ,function(data) { if(data=='no') //if username not avaiable { $("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox { //add message and change the class of the box and start fading $(this).html('<img src="resources/images/tick.png" /> Code matched!').addClass('messageboxok').fadeTo(900,1); }); } else { $("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox { //add message and change the class of the box and start fading $(this).html('<img src="resources/images/cross.png" /> Sorry, code incorrect!').addClass('messageboxerror').fadeTo(900,1); }); } }); }); }); </script> <p> <label>Discount code</label> <input class="text-input small-input" type="text" id="DiscountCode" name="DiscountCode" /> <span id="msgbox" style="display:none"></span> </p> I would only like this code to run if the form field is not blank please help?! thanks Hello all, First time back here in a while, but I'm trying to get proficient in JS. I want to make my input element reset its value attribute to blank, which is originally set to "your e-mail". You know the effect you see on forms that have text in them, then with the onclick attribute, you can clear the text in the box. So, after looking around trying to find out what to do, here's what I've attempted. HTML Code: <form id="emailbox" name="form1" method="post" action=""> <div> <input type="text" name="go" id="go" value="your e-mail" onclick="removeText()"/> <input type="submit" value="Join" /> </div> </form> JS: Code: <script type="text/javascript"> function removeText(){ var form = document.getElementById['emailbox']; var name = form.elements['go'].value; } </script> What do I do next to complete my objective? Hello all, I would like someone to help me with this. I'm building my portfolio website. I'm an illustrator and graphic designer (for printing). My website uses html and css. I introduce a jquery plugin to create a slide show with my work. Until then, everything was working well. The problem appears when I introduce php to my code in order not to repeat the navigation bar all the time. With php and the jquery together I get a blank page in my browser. This link shows the blank page I'm getting using php and jquery together. http://www.raulmv.com/calendar.php This is an example of the site without the jquery. http://www.raulmv.com/graphics.php Could someone please help me with this thanks. Code: <!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" /> <meta name="description" content="#" /> <meta name="keywords" content="#" /> <title>#</title> <meta name="google-site-verification" content="1ksaaEb5-Ur8h5ivruWp4iRcUB-tDLyM43L6yCl1OuQ" /> <link href="css/style.css" rel="stylesheet" type="text/css" /> <!-- include jQuery library --> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> <!-- include Cycle plugin --> <script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script> <script type="text/javascript" src="/js/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="/js/jquery.cycle.all.js"></script> <script type="text/javascript" src="/js/common.js"></script> <!--Google Analytics--> <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-12002561-1']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script> </head> <body class="#" id="portfolio"> <div id="container"> <!--Top Navigation--> <div id="navcontainer"> <?php {include("navbartop.html");} ?> </div> <!--Left Navigation--> <div id="navBar"> <?php include("navbarleft.html"); ?> </div> <!--Info--> <div id="info"> <span class="Title">ANYTIME CALENDAR | 2009</span> <span class="style">Calendar designed to be used any year, any occasion, anytime.</span> </div> <!--Imagenes--> <div id="showreel-nav-wrap"> <span> </span> </div> <ul id="buy-links" class="slideshow"> <li> </li> <li> </li> <li> </li> <li> </li> <li> </li> <li> </li> <li> </li> </ul> <div id="showreel"> <ul class="slideshow pics"> <?xml version="1.0" encoding="utf-8"?> <li><img src="images/Calendar.png" height="522px"/> </li> <li><img src="images/IMG_1162.png" height="522px" /> </li> <li><img src="images/IMG_1307.png" /> </li> <li><a href="images/Calendar/Instructions.gif"><img src="images/Instructions_small.gif" /></a> </li> </ul> </div><!--/showreel--> <script type="text/javascript"> $(function() { var totalImg = $("#showreel li").size() - 1; $("#buy-links li:gt(" + totalImg + ")").remove(); $("#showreel-nav-wrap span").after('<div id="showreel-nav" class="showreel-nav">') $('.slideshow').each(function(index) { $(this).cycle({ fx: 'fade', speed: 'slow', timeout: 0, sync: false, pager: '#showreel-nav', pagerAnchorBuilder: function(i) { if (index == 0) // for first slideshow, return a new anchor return '<a href="#">'+(i+1)+'</a>'; // for 2nd slideshow, select the anchor created previously return '#showreel-nav a:eq('+i+')'; } }); }); //Image to trigger showreel links activeLink = $('#showreel-nav').find('.activeSlide'); nextLink = activeLink.next(); $('.slideshow img').bind('click',function(){ activeLink = $('#showreel-nav').find('.activeSlide'); nextLink = activeLink.next(); nextLink.trigger('click'); }); //Get h1 text length var h1length = $('h1').text().length; if(h1length > 27) { $('.oj-title').css('margin-top','-21px'); } }); </script> <!-- end #mainContent --></div> </body> </html> Those <li> tags Im using is to numbered the images. It might not be a good practice but it works. Thanks for reading this post, I hope someone could help me. It's frustrating I have been for the last two days going around trying to change things and nothing seems to work. Does anyone know how I can modify the code below to show a question that has more then one fill in the blank? For example: _____ is an attitude or behavior which leads another to do ________. Thank you. Code: <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script language="JavaScript"> var question_type=new Array(4) question_type[0]="mult"; question_type[1]="mult"; question_type[2]="blank"; question_type[3]="blank"; var questions=new Array(4) questions[0]="The words used to <u>describe</u> the manifestation of Jesus as Messiah of Israel, Son of God and Savior of the world are ..."; questions[1]="Which of these is not a symbol of the Holy Spirit?"; questions[2]="Human life must be respected and protected absolutely from the moment of ______."; questions[3]="_____ is an attitude or behavior which leads another to do evil."; var answers = new Array(4) answers[0]= "B"; //The Epiphany answers[1]= "C"; //Sunshine [water, fire, anointing] answers[2]="conception"; answers[3]="scandal"; var each_question = new Array(3) each_question[0]="<table width='98%' border='0'>" + "<tr>" + "<td colspan='2'>" + "<font face='Arial, Helvetica, sans-serif'>" + questions[0] + "</font>" + "</td>" + "</tr>" + "<tr>" + "<td width='28%'>" + " " + "</td>" + "<td>" + " " + "</td>" + "</tr>" + "<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='A'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "The creed" + "</font>" + "</td>" + "</tr>" + "<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='B'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "The Epiphany" + "</font>" + "</td>" + "</tr>" + "<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='C'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "The magisterium" + "</font>" + "</tr>" + "<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='D'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "The Annunciation" + "</font>" + "</tr>" + "<tr>" + "<td width='28%' align='right'>" + " " + "</td>" + "<td>" + "<img src='line_animation.gif' width='160' height='14' align='right'>" + "</td>" + "</tr>" + "</table>" + "</font>"; each_question[1]="<table width='98%' border='0'>" + "<tr>" + "<td colspan='2'>" + "<font face='Arial, Helvetica, sans-serif'>" + questions[1] + "</font>" + "</td>" + "</tr>" + "<tr>" + "<td width='28%'>" + " " + "</td>" + "<td>" + " " + "</td>" + "</tr>" + "<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='A'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "Water" + "</font>" + "</td>" + "</tr>" + "<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='B'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "Fire" + "</font>" + "</td>" + "</tr>" + "<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='C'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "Sunshine" + "</font>" + "</tr>" + "<tr>" + "<td width='28%' align='right'>" + "<input type='radio' name='choice' value='D'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "Anointing" + "</font>" + "</tr>" + "<tr>" + "<td width='28%' align='right'>" + " " + "</td>" + "<td>" + "<img src='line_animation.gif' width='160' height='14' align='right'>" + "</td>" + "</tr>" + "</table>" + "</font>"; each_question[2] = "<table width='98%' border='0'>" + "<tr>" + "<td colspan='2'>" + "<font face='Arial, Helvetica, sans-serif'>" + questions[2] + "</font>" + "</td>" + "</tr>" + "<tr>" + "<td width='28%'>" + " " + "</td>" + "<td>" + " " + "</td>" + "</tr>" + "<tr>" + "<td width='28%' align='right'>" + "<input type='text' name='text_field'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "</font>" + "</td>" + "</tr>" + "<tr>" + "<td width='28%' align='right'>" + " " + "</td>" + "<td>" + "<img src='line_animation.gif' width='160' height='14' align='right'>" + "</td>" + "</tr>" + "</table>" + "</font>"; each_question[3] = "<table width='98%' border='0'>" + "<tr>" + "<td colspan='2'>" + "<font face='Arial, Helvetica, sans-serif'>" + questions[3] + "</font>" + "</td>" + "</tr>" + "<tr>" + "<td width='28%'>" + " " + "</td>" + "<td>" + " " + "</td>" + "</tr>" + "<tr>" + "<td width='28%' align='right'>" + "<input type='text' name='text_field'>" + "</td>" + "<td>" + "<font face='Arial, Helvetica, sans-serif'>" + "</font>" + "</td>" + "</tr>" + "<tr>" + "<td width='28%' align='right'>" + " " + "</td>" + "<td>" + "<img src='line_animation.gif' width='160' height='14' align='right'>" + "</td>" + "</tr>" + "</table>" + "</font>"; var currentQuestion=0; var score=0; function writeEachQuestion() { if(currentQuestion==0){ top.bottom_right.document.open(); top.bottom_right.document.write("<center>" + "<h3>" + "<font face='arial, helvetica, verdana'>" + "Go get 'em," + " " + userName + "!" + "<br>" + "</h3>" + "Let's see how well" + "<br>" + "you know your faith!" + "</center>" + "</font>"); top.bottom_left.document.write(each_question[currentQuestion]); } else { top.bottom_left.document.write(each_question[currentQuestion]); top.bottom_right.document.open(); } } function swapper() { top.bottom_left.document.fish_first.src="next2.gif"; } function unswapper() { top.bottom_left.document.fish_first.src="next.gif"; } function checkQuestionType() { if (question_type[currentQuestion-1]=="mult"){ multChecker(); } else if (question_type[currentQuestion-1]=="blank") { textChecker(); } } function multChecker() { var answerValue=answers[currentQuestion-1]; var checkedIndex = -1; for(i=0; i < top.bottom_left.document.quiz_questions.choice.length; i++) { //if a radio button is checked, the variable checkedIndex is set to the value of that index number. if(top.bottom_left.document.quiz_questions.choice[i].checked){ checkedIndex = i; selected_answer = top.bottom_left.document.quiz_questions[checkedIndex].value; } } if (selected_answer==answerValue) { score++; //The angelTableCorrect() function runs(see below). angelTableCorrect(); //An alert pops up if nothing's checked, with a string telling the user to guess next time. } else if (checkedIndex==-1){ alert("Next time," + " " + userName + "," + " " + "take a guess!"); //Because I'm heartless, the user isn't given a second chance. If not guess was made, angelTableWrong() executes (see below). angelTableWrong(); } else { angelTableWrong(); } } function textChecker() { var answerValue=answers[currentQuestion-1]; //theWord represents the user's input. var theWord = top.bottom_left.document.quiz_questions.text_field.value; theWordLower=theWord.toLowerCase(); if(theWordLower==answerValue) { score++; angelTableCorrect(); } else if (theWord!=answerValue) { angelTableWrong(); } } function angelTableCorrect () { top.top_right.document.open(); top.top_right.document.write("<table align='left'>" + "<tr>" + "<td align='center'>" + "<font face='Arial'>" + "Right," + " " + userName + "!" + "<br>" + "You're" + " " + score + " " + "out of" + " " + currentQuestion + "</td>" + "<td>" + "<img src='angel_correct.gif'>" + "</td>" + "</tr>" + "</table>"); } function angelTableWrong () { top.top_right.document.open(); top.top_right.document.write("<table align='left'>" + "<tr>" + "<td align='center'>" + "<font face='Arial'>" + "Wrong," + " " + userName + "." + "<br>" + "You're" + " " + score + " " + "out of" + " " + currentQuestion + "</td>" + "<td>" + "<img src='angel_wrong.gif'>" + "</td>" + "</tr>" + "</table>"); } function writeBeginning() { top.bottom_left.document.clear(); top.bottom_left.document.open(); top.bottom_left.document.write("<html>" + "<head>" + "</head>" + "<body>" + "<form name='quiz_questions'>"); } //This function writes the concluding part of each quiz question table in the bottom_left frame, except for the last one. //The last one's Next button has to call a different function, so I wrote the next function to do that. function writeEnding(){ top.bottom_left.document.write("<img name='fish_first' src='next.gif' align='right' onMouseOver='top.top_left.swapper();' onMouseOut='top.top_left.unswapper();' onMouseUp='top.top_left.onNext();'>" + "</form>" + "</body>" + "</html>") } //This function writes the concluding part of the last question, which has a next button that calls a //different function. function writeEndingLast(){ top.bottom_left.document.write("<img name='fish_first' src='next.gif' align='right' onMouseOver='top.top_left.swapper();' onMouseOut='top.top_left.unswapper();' onMouseUp='top.top_left.writeMailTable();'>" + "</form>" + "</body>" + "</html>") } function writeMailTable(){ top.top_right.document.open(); top.top_right.document.write("<font face='arial, verdana, helvetica'>" + "<center>" + "Thank you for" + "<br>" + "taking the quiz," + " " + userName + "!" + "<br><br>" + "</center>"); top.bottom_right.document.open(); top.bottom_right.document.write("<font face='arial, verdana, helvetica'>" + "<center>" + "If you don't have questions" + "<br>" + "you'd like to have answered," + " " + "<a href='http://www.archden.org' target='_blank')>" + "return to the" + "<br>" + "Archdiocese of Denver home page." + "</a>" + "</center>"); top.bottom_left.document.open(); top.bottom_left.document.write("<font face='arial, verdana, helvetica'>" + "Do you have questions about this quiz," + " " + userName + "?" + " " + "<img src='angel_final.gif' align='right'>" + "Post them in" + " " + "<a href='http://www.archden.org/ubb' target='_blank')>" + "The Upper Room," + "</a>" + " " + "the online community of the Archdiocese of Denver, in the 'What Does the Church Teach About ...?' forum!"); } function onNext() { //Write a table to the_questions.htm that includes a variable for the new question. if(currentQuestion==3) { currentQuestion++; textChecker(); doTheMath(); top.bottom_left.document.open(); top.bottom_left.document.write("<font face='arial, verdana, helvetica'>" + "<center>" + "You got" + " " + "<b>" + finalPercent + "%" + "</b>" + " " + "of the questions right," + " " + userName + "!" + "<br>" + "Click on the 'Next' fish" + "<br>" + "one more time to find out" + "<br>" + "how to get answers for those questions you missed." + "</center>" + "</font>"); writeEndingLast(); } else { currentQuestion++; checkQuestionType(); writeBeginning(); writeEachQuestion(); writeEnding(); } } //The doTheMath function divides the score by 20, and that multiplies that value by 100 to come up //with a final percentage value. That is used in the string written at the end (in the above onNext function). function doTheMath(){ thePercent=score/4; finalPercent=thePercent*100; } </script> </head> <body bgcolor="#FFFFFF" onLoad="writeBeginning(); writeEachQuestion(); writeEnding();"> <img src="title.gif" width="371" height="109"> <script language="JavaScript"> </script> </body> </html> hey guys i have the following test html that i want to grab information out of in paticular .match(/\s(\d{1,2}\%)<\/td>/)[1]; now this works for the first % which returns 4% on this line <td style="color: white;"> (4%)</td> but then i have the same matches again Code: CL = temp.match(/\s(\d{1,2}\%)<\/td>/)[1]; alert("CL = " + CL); //returns 4% Neo = temp.match(/\s(\d{1,2}\%)<\/td>/)[2]; alert("Neo = " + Neo);//returns undefined and should return 2% Oak = temp.match(/\s(\d{1,2}\%)<\/td>/)[3]; alert("Oak = " + Oak); //returns undefined and should return 14% Queen = temp.match(/\s(\d{1,2}\%)<\/td>/)[4]; alert("Queen = " + Queen); // returns undefined and should return 27% here is a link to the temp variable because it would get messy here http://pastebin.com/XFyiQ26K Hello, I have a three field contact form on an HTML5 page. Using CSS3/HTML5 techniques, the fields change state as the info is entered properly (green OK symbol if good, red "!" if not, etc). That all works as expected in all browsers. My final hurdle is preventing the form being submitted with nothing entered in the fields. I have done hours of research and have tried several ways of writing the checkFeedbackForm function. My problem is that none of the solutions I've found are recognized by FireFox (mac and pc) and IE. They just ignore the javascript and allow the empty form to be emailed. Here is the code that is checking the fields: Code: <script type="text/javascript"> function checkFeedbackForm(form){ if(form.fullname.value=='') { alert('Please enter your Name'); form.fullname.focus(); return false; } if(form.email.value=='') { alert('Please enter a valid Email address'); form.email.focus(); return false; } if(form.message.value=='') { alert('Please tell me a little bit about your ideas.'); form.message.focus(); return false; } return true; } </script> Here is my form: Code: <form id="signup" action="mailinfo.php" method="post" onSubmit="return checkFeedbackForm(this);" > <input type="hidden" name="returnURL" value="thankyou.html" /> <fieldset><ol> <li><label for="fullname">Name</label> <input type="text" id="fullname" name="fullname" placeholder="Your name" required /></li> <li><label for="email">Email</label> <input type="email" id="email" name="email" placeholder="Your email" title="Please enter a valid email" required /></li> <li><label for="message">Message</label> <textarea id="message" name="message" cols="32" rows="8" placeholder="Your message" required /></textarea></li></ol> </fieldset> <input type="submit" value="Send It" /> <div class="privacy">Your information is for our project only and will not be shared or sold. Promise.</div> </form> Through experimentation, I have found that removing the ID from the form allows the javascript to function in all browsers, but that kills my form styling. I think it will be easier to fix the javascript than redo my CSS. This may be obvious, but I'm not a programmer. I'm a designer who muddles through on small scale stuff like this. Any help is greatly appreciated. Thanks. Hi everyone, I have a very simple fill-in-the-blank quiz that I would like to add a randomizer to. Right now, the quiz has 3 questions that are asked one at a time, in order. I want to increase this to 100 possible questions (that part I can do), but I want the script to randomly choose 10 of them to ask. Then once the person has taken the quiz, they would be able to try again with 10 new questions. The script is live he http://www.elearnfrenchlanguage.com/...verb-quiz.html I have a quiz with a randomizing script, but it's for multiple choice questions, and I don't know how to adapt it so that it works with my script. Here is the working quiz: http://french.about.com/library/week...frenchquiz.htm And here is the randomizing script: http://french.about.com/library/weekly/longquiz.js I'd be so grateful for any help. My Javascript doesn't display an error when the "bid" field is blank but I want it to. Can someone help me fix it? Everything else works okay but I'm not a Javascript programmer so I don't know where to begin. Code: function checkBid(fieldName,minValue,maxValue){ var numberfield = fieldName; if (chkNumeric(fieldName,minValue,maxValue) == false){ numberfield.select(); numberfield.focus(); return false; } else{ return true; } } function chkNumeric(fieldName,minValue,maxValue){ var checkOK = "0123456789"; var checkStr = fieldName; var allValid = true; var decPoints = 0; var allNum = ""; for (i = 0; i < checkStr.value.length; i++){ ch = checkStr.value.charAt(i); for (j = 0; j < checkOK.length; j++) if (ch == checkOK.charAt(j)) break; if (j == checkOK.length){ allValid = false; break; } if (ch != ",") allNum += ch; } if (!allValid){ alertsay = "The bid field contains one or more invalid characters:\nPlease use only numeric digits in this field ...\n " alert(alertsay); return (false); } var chkVal = allNum; var prsVal = parseInt(allNum); if (chkVal != "" && !(prsVal >= minValue && prsVal <= maxValue)){ alertsay = "Your bid value is outside the acceptable bidding range:\nPlease enter a value from "+minValue+" to "+maxValue+" ...\n " alert(alertsay); return (false); } } I know I can use the functions like parseFromString() to access and modify an existing XML documents, but is it possible to use JavaScript to create a blank xml document? I want to take data entered into the client, package it up as XML and use ajax to transmit it to the server. So far I've written my own class to create a simple xml document, but I'd like to do it properly with the inbuilt functions. (previously posted in the wrong forum and re-posted in this one) Hi there, I have scoured the internet looking for the right code but to no avail. I have gotten as far as totaling up my form but now want to format the amounts and total as currency and also want the values that = 0 to just be blank. I have tried to use the code from other solutions (posted on the net) but I just think it is over my head because I cant figure it out. I thought I was close a few times but wasn't able to bring it on home. One of my issues is using somebody's code and not knowing where in my code to place it. http://www.whackyweedremoval.com/wwr-invoice.html I have tried exhaustively to solve on my own but there is a point. Please help Say I have a <textarea> input and I want to strip all the blank lines (lines with only whitespace). I have this regular expression, why doesn't it do anything? I've tried different variations with the flags (m and g). Code: ... var output = input.replace(/^\s*$/gm, "notworking!"); ... The very same regex works fine in my text editor (Notepad2), and I can match all empty lines. Code: LINE1 LINE4 ^(line 3 has some spaces) should become Code: LINE1 LINE4 And when I finally do get this to work, how would I remove the empty line? This used to work and suddenly it does not work in IE. Here's the function Code: function pdfWindow(loc) { if(loc == "#RefQuide") { location.href = loc; } else { // The window attributes var window_attribs = "height=650,width=850,resizable=yes,scrollbars=yes"; window.open(loc,"PDF",window_attribs); } } Here's part of the HTML Code: <form name="myForm"> <select name="hypercomList"> <option value="/CWRWeb/pdf/HypercomT4000.pdf">Hypercom T4000 </option> <option value="/CWRWeb/pdf/HypercomT4100.pdf">Hypercom T4100 </option> </select> <input type="button" value="Go!" onclick="pdfWindow(myForm.hypercomList.options[myForm.hypercomList.selectedIndex].value)"> </form> Any ideas why it would open a blank page instead of the PDF? Works ok in FF. Hi everyone, I run a math site and I just recently built a little program to generate math problems. When the user submits the correct answer the program changes the problem and all the steps/hints. Everything works fine except that during the change over there are all these weird blocks (same color as my background) (*FireFox Only). It only lasts for a couple of seconds, but it would be nicer if it smoothly replaced the problem. Here is the test site: http://www.rootmath.org/test/solving-limits The program/practice problem is at the bottom, if you don't know how to solve it you can hit "hint" until it gives you the answer. When you enter the correct answer and then click for a new problem you'll see the funky blocks. Any help/suggestions would be greatly appreciated! Here is the code: writeProblem() is called when the user gets the right answer and asks for another problem: Code: var writeProblem = function(){ //these are neccessary after the first call to writeProblem. $(".steps").hide(); $("#submit_answer").show(); $("#next_problem").hide(); showStep.reset(); //CLEAR "steps_area" var problem_area = document.getElementById('steps_area'); while(problem_area.firstChild){ problem_area.removeChild(problem_area.firstChild); } //Create a limit problem var limit = limits(); limit.setDenominator(rand(6,0)); var denom = limit.getDenominator(); var randInt = 0//rand(3,0); var lim = limit.getType(randInt, denom); var step = lim.step(denom); answer = lim.getAnswer(); //made global so checkAnswer() can access it var x = document.getElementById('problem'); x.innerHTML = addLatex(lim.problem); var problem_area = document.getElementById('steps_area'); //loop over array of steps and print them to steps div var length = step.length; for(var i=0; i<length; i++){ var divTag = document.createElement("div"); divTag.id = "step" + i; divTag.className = "steps"; divTag.innerHTML = step[i]; problem_area.appendChild(divTag); MathJax.Hub.Queue(["Typeset",MathJax.Hub,'step' + i]); } // MathJax Queue for processing latex that javascript filled in MathJax.Hub.Queue(["Typeset",MathJax.Hub,'problem']); } I was wondering if someone could help me? In my code below what if answers in question 2 were allowed to be in any order? Like: hips,body,knees or knees,hips,body and so on. How should I modify my code? Anyone please???? Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Quiz</title> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <script type="text/javascript"> var answer_list = [ ['False'], ['body,hips,knees'] // Note: No comma after final entry ]; var response = []; function getCheckedValue(radioObj) { if(!radioObj) return ""; var radioLength = radioObj.length; if(radioLength == undefined) if(radioObj.checked) return radioObj.value; else return ""; for(var i = 0; i < radioLength; i++) { if(radioObj[i].checked) { return radioObj[i].value; } } return ""; } function setAnswer(question, answer) { response[question] = answer; } function CheckAnswers() { var correct = 0; var resp, answ; for (var i = 0; i < answer_list.length; i++) { resp = response[i].toString(); resp = resp.toLowerCase(); answ = answer_list[i].toString(); answ = answ.toLowerCase(); //################################################################################################# if (resp == answ) { correct++; if(i==0){ document.forms[0].a1c.style.backgroundImage="url('correct.gif')"; document.forms[0].a1c.value = ""; } else{ document.forms[0].a1d.style.backgroundImage="url('correct.gif')"; document.forms[0].a1d.value = ""; } } else{ if(i==0){ document.forms[0].a1c.style.backgroundImage = "url('incorrect.gif')"; document.forms[0].a1c.value = " ANS: False. Position the head snugly against the top bar of the frame and then bring the foot board to the infant's feet."; } else{ document.forms[0].a1d.style.backgroundImage = "url('incorrect.gif')"; document.forms[0].a1d.value = " ANS: " + answ; } //################################################################################################### } } document.writeln("You got " + correct + " of " + answer_list.length + " questions correct!"); } </script> </head> <body> <form action="" method="post"> <div> <b>1. When measuring height/length of a child who cannot securely stand, place the infant such that his or her feet are flat against the foot board.</b><br /> <label><input type="radio" name="question0" value="True" />True</label> <label><input type="radio" name="question0" value="False" />False</label> <br /> <textarea rows="2" cols="85" name="a1c" style="background-repeat:no-repeat"></textarea> <br /> <b>2. When taking a supine length measurement, straighten the infant's <input type="text" name="question1_a" size="10" />, <input type="text" name="question1_b" size="10" />, and <input type="text" name="question1_c" size="10" />.</b> <br /> <textarea rows="2" cols="85" name="a1d" style="background-repeat:no-repeat"></textarea> <br /> <input type="button" name="check" value="Check Answers" onclick="setAnswer(0,getCheckedValue(document.forms[0].question0));setAnswer(1,[document.forms[0].question1_a.value,document.forms[0].question1_b.value,document.forms[0].question1_c.value]);CheckAnswers();" /> </div> </form> </body> </html> I have a popup window that has a "link" inside it, which needs to have a target=_blank but when ever clicked in IE, it stays inside the same window. I tried all of the following, none work PHP Code: <a href='http://www.myurl.net' onclick='window.close();' target='_blank'> <a href="http://www.myurl.net" target="_blank" onClick="javascript:window.close()"> <a href="http://www.myurl.net" target="_blank" onClick="javascript: setTimeout(window.close, 10);"> Thanks Sonny Edit: Nevermind
|