JavaScript - Trying To Eliminate Javascript Race Condition
Currently I have a race condition existing in my Java script code. What I am trying to do with this code is convert all check boxes which are a part of the 'checkbox' class and are not checked into text boxes with a value of zero. Currently when you post a check box that is not checked it does not appear in the $_POST data. However I need to know all the values whether true or false for these particular set of check boxes.
The code I have is he Code: function checkboxConvert() { var chkBxs = $$('.checkbox'); for (var i = 0; i < chkBxs.length; i++) { if (chkBxs[i].checked == false) { chkBxs[i].type = 'textbox'; chkBxs[i].value = '0'; } } setTimeout("document.productForm.submit();",1000); } Now the problem that I have been getting is that when I try to submit this form the values of the recently changed text boxes does not appear in the $_POST data. Therefore, as you can see above I have postponed the page submit for 1 sec and then I have all the data available to me. However as time goes on and my data set gets larger, 1 sec may no longer be enough. This I think is a race condition and I need to figure some way of running the code only after all the check boxes have been converted and they have their new values. I would have thought that this would be unnecessary from the start, but for some reason it's trying to run both pieces simultaneously and I can't submit until I have the proper values in place. Any help is much appreciated! Similar TutorialsUpon clicking a button, my script will send a request to a PHP file, which will create a database entry and return it to the script, using json. Involving what's returned (which is an integer), javascript will create new div elements with that integer in the element blocks. My fear is that when the user sends two (or more) requests and there's a difference in ping, or he just has packet loss - that request #2 will come back while request #1 is executing. I could add a forced delay, where the PHP script will not allow a second entry within 5 seconds of the last entry. However, I'm afraid that massive packetloss could still interfere. For example, this could result in 2 div elements having the number of the first request, and 1 element having the number of the second request. If possible, I would like to avoid forcing the user to refresh the page to make the SQL entry (i.e., create the element with javascript and without SQL/PHP, but then upon submission, reload the page and send them to SQL.) Any suggestions? I have an table in which an select box like this OS:<td > <select name="os" id="os" class="SelectList Width200"> </select> </td> following have an option in OS: windows/Linux i only want when user select OS - linux ... then function call otherwise if user select OS - window ... no need to call this function validate() i think it requires if condition in function Validate() .... can u ans me how it is posible to put if condition in function validate() function Validate() { var dropdownIndex = document.getElementById('type').selectedIndex; var sztype = document.getElementById('type')[dropdownIndex].value; if(sztype == "1") { var szpassword = ""; var szguid = ""; var name = Trim(document.userform.name.value); var ip = Trim(document.userform.ip.value); if(ip.length == 0) { alert("Please specify IP/Host Name."); return false; } if(name.length == 0) { name=ip; } szusername = Trim(document.userform.username.value); if(szusername.length == 0) { alert("Please specify Username."); return false; } var szvalidchars = new RegExp("[~!@#$%^&*()+|{}:\"<>?,/;'=\\`]"); if(szvalidchars.test(szusername)) { alert("Username cannot contain invalid characters."); return false; } szpassword = Trim(document.userform.password.value); if(szpassword.length == 0) { alert("Please specify Password."); return false; } The "?" seems to be called the conditional operator. Code: var points = prompt('How many points do you want on ten?'); var result = (points >= 5) ? "succeeded!" : "didn't succeed ;-)"; window.alert("You " + result); i have been searching the net to find a way to condition ondragover results by file type being dragged. Code: function doDragOver(event) { if(event.dataTransfer.types.contains('image/png')){ event.preventDefault(); } if(event.dataTransfer.types.contains('image/gif')){ event.preventDefault(); } if(event.dataTransfer.types.contains('image/jpg')){ event.preventDefault(); } if(event.dataTransfer.types.contains('image/jpeg')){ event.preventDefault(); } } this is waht i have been trying based on the ondragover documentation on the MDN network. i need preventDefault to be triggered if what i am dragging is an image from thee users hard drive and not triggered if the element is dragged from the browser. i can find no listing of type formats or even discovering file types for the dragged item on any network. I would greatly appreciate any help. ps. i have been stuck on this for three days now, i may be losing my mind Could anyone tell me (or link me to some place that can) why the following if-statement will execute? if (5!=6 || 7!=8) { alert("Why does this work?"); } Thanks Hi to All, I have two menus, related each other, in this way: <head> var sum_db = new Object() sum_db["email1"] = [{value:"I01 - Problems of one level", text:"I01 - Problems of one level"}, {value:"I02 - Problems RDM", text:"I02 - Problems RDM"}, {value:"Free Text", text:"Free Text "}]; sum_db["email2"] = [{value:"I03 - Various", text:"I03 - Various"}]; // // function setIssue(chooser) { var newElem; var where = (navigator.appName == "Microsoft Internet Explorer") ? -1 : null; var Iss_Chooser = chooser.form.elements["iss_sum"]; while (Iss_Chooser.options.length) { Iss_Chooser.remove(0); } var choice = chooser.options[chooser.selectedIndex].value; var db = sum_db[choice]; if (choice == "email1") { newElem = document.createElement("option"); newElem.text = "Choose an issue ..."; newElem.value = "Choose Issue ..."; Iss_Chooser.add(newElem, where); } for (var i = 0; i < db.length; i++) { newElem = document.createElement("option"); newElem.text = db[i].text; newElem.value = db[i].value; Iss_Chooser.add(newElem, where); if ((choice == "email1") && (db[i].text.indexOf('Free Text')==0)) { document.getElementById("label_des").style.display=""; } else { document.getElementById("label_des").style.display="none"; } } } // </script> </head> <body> <form> <select size="1" name="mess" id="mess" onchange="setIssue(this)"> <option value="email1" selected>email1</option> <option value="email2">email2</option> </select> .... .... <select id="iss_sum" name="iss_sum"> <option value="<%=objRS("Issue_Summary")%>" selected><%=objRS("Issue_Summary")%></option> </select> <label for="iss_des" id="label_des" style="display:none; vertical-align:top">Description:<textarea id="iss_des" name="iss_des"><%=objRS("Issue_Description")%></textarea> </label> My problem is: I would like that if I select ONLY email1 and ONLY the option "Free Text", appears the textarea with label Description. Up to know if one selects email1, automatically the textarea appears near for every option; it seems that the condition of the if is not respected !!! Thanks a lot in advance !!! I can't figure this. Basically I have a dialogue pop out box. When you type a value in the pop out box,and press enter, it will change the value in the input boxes. Let say I have five input boxes, four of the input box has 7 as value,the last input box has 15 value. When I type 8 and enter, it should change only the value of 15(from 15 to 8) as 15 is greater than 8. If I type 4, it should change all the values of input boxes as all of the input box values are greater than 4. I have set the condition to 18 as input boxes are 18 columns. jsNewDisc is the user input value. Below are some pieces of codes. Of course if I type 5 and enter, this condition will change all the values in the five input boxes as they are all of greater value. If I input 8, input box that has a value of 15 will be the only one that will be change as it has greater value. Code: for (a=1;a < 18; a++){ if(document.getElementById('R4'+ a).value>jsNewDisc){ document.getElementById('R4'+ a).value = jsNewDisc; } } Hi, I have 3 sum fields which I want to change to a red colour if the value is > or < 100. Apparently this is a DAP, but I am using javascript to tweek some of the settings in DAP. function subtotal() if(document.getElementById("Sum1").value>100&&<100) { this.style.cssText='Z-INDEX: 2; LEFT: 6.667in; WIDTH: 0.729in; COLOR: red' { else this.style.cssText='Z-INDEX: 2; LEFT: 6.667in; WIDTH: 0.729in; COLOR: #339966' </SCRIPT> <SPAN class=MSTheme-Label id="Sum1_Label" style="Z-INDEX: 1; LEFT: 0.25in; OVERFLOW: hidden; WIDTH: 0.711in; POSITION: absolute; TOP: 0.125in; HEIGHT: 0.161in">Totals:</SPAN><SPAN class=MsoBoundSpan id="Sum1" onmouseover="subtotal()" dataFormatAs=TEXT style="Z-INDEX: 2; LEFT: 5.416in; WIDTH: 0.729in; COLOR: #339966; POSITION: absolute; TOP: 0.125in; HEIGHT: 0.187in" MsoTextAlign="General">Sum of Product 1</SPAN><SPAN class=MsoBoundSpan id="Sum2" onmouseover="subtotal()" dataFormatAs=TEXT style="Z-INDEX: 2; LEFT: 6.667in; WIDTH: 0.729in; COLOR: #339966; POSITION: absolute; TOP: 0.125in; HEIGHT: 0.187in" MsoTextAlign="General">Sum of Product 2</SPAN><SPAN class=MsoBoundSpan id="Sum3" dataFormatAs=TEXT style="Z-INDEX: 2; LEFT: 7.917in; WIDTH: 0.729in; COLOR: #339966; POSITION: absolute; TOP: 0.125in; HEIGHT: 0.187in" MsoTextAlign="General">Sum of Product 3</SPAN></DIV> I'm a noobie at coding, and I was wondeirng if anyone can help me with the coding. Many Thanks Hi, In the attached code the outcome always defaults to the first test, even if the condition is false. How would I alter the syntax so that both condtions are evalauted? Code: var res = document.calc.num1.value*100/document.calc.num2.value; function cost1() { if (isNaN(res)) { document.calc.result1.value=0; } else { document.calc.result1.value=document.calc.num1.value*100/document.calc.num2.value; } } Thanks Iain I am trying to do a pattern match and check something in a condition but cant get it to work. The first value changes and I need to check and do something if I get a hit on it. Code: var mydata = "?first=one&second=two&third=three"; if (mydata.indexOf("first") == "something") { alert("No Hit"); } else { alert("Hit"); } Basically I am trying to find out if first is equal to one in the mydata string. Please advise because my above attempt is not working. I have a function to accept number and certain text only when "Enter" key is pressed. Code: function handleEnter(field, event){ var keyCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode; var tmp_val = ""; if (keyCode == 13) { if(field.name=="number" && field.value.replace(/ /g,"").length>1){ field.value = field.value.replace(/ /g,""); field.value = field.value.toUpperCase(); tmp_val = field.value; if (isNaN(tmp_val) && tmp_val!="ABC") { field.value = ""; field.focus(); return false; } else { some codings here } } } } However, when I added a second condition, the code stops working Code: if (isNaN(tmp_val) && (tmp_val!="ABC" ||tmp_val!="DEF") ) Anyone pls help~ Tks~ Hello there, this is my first post on this forum. I have learned a good bit of PHP and have implemented it for use in my work as a math tutor. My kids are telling me, however, that it is too inconvenient to hit tab or click on the next text box and would prefer to use the old style pencil and paper. I thought of a good idea: Javascript would be able to automatically focus the curser on the next text box if some condition was met. For example: 6+7. If the textbox reads 13, it will focus on the next text box. Otherwise, nothing happens. This kills three birds with one stone; the user will know if they got the question right or wrong and it will move automatically if they got it correct. The problem is I lack any real JavaScript wisdom. I would guess this would be quite simple. The closest thing I have found upon searching was this from the user requestcode, but this has to do with once the user has typed in 4 characters it moves automatically. Code: <SCRIPT LANGUAGE="JavaScript"> function nextbox(fldobj,nbox) { if(fldobj.value.length>3) {document.forms[0].elements[nbox].focus()} } </SCRIPT> </head> <body onLoad="document.myform.txt1.focus()"> <CENTER> <FORM NAME="myform"> <INPUT TYPE="text" NAME="txt1" SIZE="4" MAXLENGTH="4" onKeyUp="nextbox(this,1)"> Thank you for the help. I want to have another go at Javascript. I have several books on the subject but I find that my eyesight is a major problem. Therefore I want to try an on-line solution, preferably free. I have Googled, but there are so many that I am almost dizzy with the choices. Perhaps someone could recommend one. Not too fussy visually. My knowledge is VERY basic. Frank Hello! I am trying to find a script that allows you to open multiple browser tabs and then close each of those tabs, either one by one or all at once. Does anyone know how to do this please? Thanks so much for your help. Does anyone know how to make URL links that use Javascript still work when users have Javascript disabled on their browser? The only reason I'm using JS on a URL is because my link opens a PDF file, and I'm forcing it not to cache so users have the latest version. I tried the <script><noscript> tags, but I'm not sure if I'm using it correctly, as my URL completely disappears. Below is my HTML/Javascript code: <p class="download"> <script type="text/javascript">document.write("<span style=\"text-decoration: underline;\"><a href=\"javascript:void(0);\" onclick=\"window.open( 'http://www.webchild.com.au/mediakit/Direct_Media_Kit_Web.pdf?nocache='+ Math.floor( Math.random()*11 ) );\" >The Child Magazines Media Kit</a></span> (PDF 1 MB) ");</script> <noscript><span style="text-decoration: underline;"><a href="http://www.webchild.com.au/mediakit/Direct_Media_Kit_Web.pdf" >The Child Magazines Media Kit</a></span> (PDF 1 MB)</noscript> </p> Thanks for any help, Michael Hi Guys, I am new at JavaScript and start to do some tutorials.What I am trying to do here is prompting user to input a name and if the name was valid the page(document) will display with all objects like the button.But if user enter a wrong name then the button will be disabled! I create the following code but it did not work <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> <script language="JavaScript" type=""> function changeColor(){ document.bgColor = "Gray"; } </script> </head> <body> <script language="JavaScript" type="text/javascript"> var person = ""; person = prompt('What is Your Name:'); if (person == "Foo") { document.write("<h1 />Welcome " + person); document.bgColor = "Yellow"; } else { document.write("<h1 />Access Denied!!!!"); document.bgColor = "Red"; document.getElementById("gree").disabled = true; } </script> <div> <p/><input id="gree" type="button" value="Gray " onClick="changeColor();"> </div> </body> </html> as you can see I used the: document.getElementById("gree").disabled = true; but it did not work , could you please give an idea how I can solve this problem? Thanks Hi, I have the following code snippet: test.html ====== <script language="javascript" type="text/javascript"> var testVariable = "test"; </script> <script language="javascript" type="text/javascript" src="test.js"> </script> test.js ===== var testVariable = window.top.testVariable; In firefox, I'm able to access testvariable defined within test.html in test.js. But in chrome, test.js couldnot get the window.top.testVariable field defined in test.html. Can any one please let me know how i can make it work in chrome?. Am i missing something here?. I want to insert this js snippet Code: function addText(smiley) { document.getElementById('message').value += " " + smiley + " "; document.getElementById('message').focus(); return false; } to a loaded iframe with name&id chtifrm. I can access it & change embed something in its html via using something like: Code: $(parent.chtifrm.document.body).append('<div id=\"smly\" style=\"cursor:pointer;float:left;top:200px;display:none;position:absolute;\"><\/div>'); .... Code: parent.chtifrm.document.getElementById('chatbox_option_disco').style.display == 'none' but how do I insert js in the head of loaded iframe? Hey, I've got to make the values of some textboxes change the co-ordinates of my sprite on a canvas and havent a clue on how to do it, Here is my form with the two textboxes and submit button: <form> x: <input type="text" name="x" /><br /> y: <input type="text" name:"y" /><br /> <input type="submit" value="Submit"/><br /> </form> And i need it so that they change the values of these: //this shows where my sprite will start on the canvas var block_x; var block_y; searched the internet for hours and cant really find anything i understand or works. any help is much appreciated |