www.webdeveloper.com
Results 1 to 9 of 9

Thread: Javascript successive functions fails?!

  1. #1
    Join Date
    Apr 2012
    Posts
    4

    Javascript successive functions fails?!

    Hi!
    Could anyone explain why the code below only executes the second comand
    CreateRecord(2), but not the first one?
    However if I put an alert("message") between the lines then it works perfectly.

    function forceit(){
    CreateRecord(1);
    CreateRecord(2);

    }//Only CreateRecord(2) is sent to the server

    function forceit(){
    CreateRecord(1);
    alert("wtf");
    CreateRecord(2);

    }//Both records are sent to the server

    My company wants me to post my worked daily hours during the last three months to their server. They have a page with a calender and they want me to click in everyday and input the hours in the form. Since it is more than 100 days I thought of making it automatically since I always work the same hours. However when I try to submit the form/record more than once,it doesn't work.
    Any ideas?

  2. #2
    Join Date
    Apr 2012
    Posts
    55
    The only difference between the two is the alert pauses the process after the first call to CreateRecord before the second call and gives your browser time to do whatever it needs to do. That means you need to wait until CreateRecord(1) is finished before you can do CreateRecord(2). We would need to see the CreateRecord function to come up with the best solution. Are you allowed to specify a callback function for when CreateRecord is finished?

    The following code should demonstrate what I'm talking about, but is not the best solution (since there's no guarantee of how long it will take CreateRecord(1) to complete):

    Code:
    CreateRecord(1);
    setTimeout(function() {
    // Wait 5 seconds for CreateRecord(1) to complete.
    CreateRecord(2);
    }, 5000);

  3. #3
    Join Date
    Apr 2012
    Posts
    4
    Hi again,
    I had actually tried something similar before, but after five minutes still nothing. I decided to try it in IE and it worked very well, even without the alert or the pause.
    The only problem now on IE is that it doesn't work if I put an iframe as the target for the php? that the server sends back showing me my post. However it worked well letting IE open all the 100 new IE-windows.
    So I managed to do what I wanted to do, but I still wonder why it wouldn't work in Firefox?

  4. #4
    Join Date
    Aug 2007
    Posts
    3,767
    Same answer that you were given before applies, without knowing how CreateRecord works, it will be very hard to tell.

  5. #5
    Join Date
    Apr 2010
    Location
    Oslo, Norway
    Posts
    89
    Hehe, let me guess, you are trying to do asynchronous ajax-calls in the function you are calling
    Square peg, round hole.
    Tried using a callback instead?

  6. #6
    Join Date
    Apr 2012
    Posts
    4

    Here is the code

    So here comes the code, it is just an empty page with a link that call the funtion to post two of my working hours.
    My idea was to have a funtion with a for-loop in it. for each day it would modify the form called record, and then submit it.

    it works in IE, but then i get 100 windows as reply from the server.
    doesnt work in firefox it only shows me the last value.


    <html>
    <head>
    <title>My Page</title>
    </head>


    <script type="text/javascript">


    function CreateRecord(day) {
    Updatetime(day,'M')
    record.action = "record.php?mode=new&action=save";
    record.submit();
    return true;
    }
    function Updatetime(dat,shift){
    var dat;
    var shift;
    record.startd.value=dat;
    record.endd.value=dat;
    if (shift=="M"){
    record.starth.value=6;
    record.startm.value=15;
    record.endh.value=14;
    record.endm.value=45;
    }
    if (shift=="A"){
    record.starth.value=14;
    record.startm.value=15;
    record.endh.value=22;
    record.endm.value=45;
    }

    if (shift=="N"){
    record.starth.value=22;
    record.startm.value=15;
    record.endh.value=6;
    record.endm.value=45;
    record.endd.value=record.startd.value+1;
    }

    }

    function forceit(){
    CreateRecord(1);
    CreateRecord(2);

    }

    </script>


    <a href="javascript: forceit()" >forceit</a>


    <form action="" method="POST" id="record" name="record" target="framen" >
    <input name="recordtypeid" value="3" type="hidden">
    <input type="hidden" value="2" name="locationid">
    <input type="hidden" value="43" name="projectid">

    <input type="text" name="startd" maxlength="2" style="width:25px;" value="" >
    <input type="text" name="startmo" maxlength="2" style="width:25px;" value="4" >
    <input type="text" name="starty" maxlength="4" style="width:45px;" value="2012" disabled>
    <input type="text" name="starth" maxlength="2" style="width:25px;" value="" >
    <input type="text" name="startm" maxlength="2" style="width:25px;" value="" >

    <input type="text" name="endd" maxlength="2" style="width:25px;" value="" >
    <input type="text" name="endmo" maxlength="2" style="width:25px;" value="4">
    <input type="text" name="endy" maxlength="4" style="width:45px;" value="2012" disabled>
    <input type="text" name="endh" maxlength="2" style="width:25px;" value="" >
    <input type="text" name="endm" maxlength="2" style="width:25px;" value="" >


    </form>

    <iframe width="100%" height="100%" name="framen">
    </iframe>

    </body>
    </html>

  7. #7
    Join Date
    Apr 2010
    Location
    Oslo, Norway
    Posts
    89
    Ok, there a few issues to consider here...Here is a pasted cleaned-up version of your code, with some comments....

    Code:
    <html>
    <head>
    	<title>My Page</title>	
    	<script type="text/javascript">
    	// Moved the whole script-section into the head-section
    		function CreateRecord(day) {
    			Updatetime(day,'M'); // Added missing semicolon
    			record.action = "record.php?mode=new&action=save"; // What is "record" supposed to be? The form with the id of "record"?
    			// You must declare a record variable that points to the form...
    			// And I don't think it's valid to address all it's items as form-id.input-element-id
    			// Give your input-fields and id and work with document.getElementById(id).value to change them before submitting
    			record.submit();
    			return true;
    		}
    		function Updatetime(dat,shift){
    			// var dat;  You shouldn't do this, the dat variable is already defined in the line above
    			// var shift; You shouldn't do this, the shift variable is already defined two lines above
    			record.startd.value=dat; // Whoa...record.startd? Agian, what is record and what is it's startd-property?
    			record.endd.value=dat;
    			if (shift=="M"){
    				record.starth.value=6;
    				record.startm.value=15;
    				record.endh.value=14;
    				record.endm.value=45;
    			}
    			if (shift=="A"){
    				record.starth.value=14;
    				record.startm.value=15;
    				record.endh.value=22;
    				record.endm.value=45;
    			}
    			if (shift=="N"){
    				record.starth.value=22;
    				record.startm.value=15;
    				record.endh.value=6;
    				record.endm.value=45;
    				record.endd.value=record.startd.value+1;
    			}
    		}
    
    		function forceit(){
    			CreateRecord(1);
    			CreateRecord(2);
    		}
    	</script>
    </head>
    
    
    
    <a href="javascript: forceit()" >forceit</a>
    <form action="" method="POST" id="record" name="record" target="framen" >
    	<input name="recordtypeid" value="3" type="hidden">
    	<input type="hidden" value="2" name="locationid">
    	<input type="hidden" value="43" name="projectid">
    	<input type="text" name="startd" maxlength="2" style="width:25px;" value="" >
    	<input type="text" name="startmo" maxlength="2" style="width:25px;" value="4" >
    	<input type="text" name="starty" maxlength="4" style="width:45px;" value="2012" disabled>
    	<input type="text" name="starth" maxlength="2" style="width:25px;" value="" >
    	<input type="text" name="startm" maxlength="2" style="width:25px;" value="" >	
    	<input type="text" name="endd" maxlength="2" style="width:25px;" value="" >
    	<input type="text" name="endmo" maxlength="2" style="width:25px;" value="4">
    	<input type="text" name="endy" maxlength="4" style="width:45px;" value="2012" disabled>
    	<input type="text" name="endh" maxlength="2" style="width:25px;" value="" >
    	<input type="text" name="endm" maxlength="2" style="width:25px;" value="" >
    </form>
    <iframe width="100&#37;" height="100%" name="framen"></iframe>
    </body>
    </html>
    See if my pointers will get you in the right direction ...

  8. #8
    Join Date
    Apr 2012
    Posts
    4

    I knew it

    Hi, Thanks for the pointers,
    Yes I assume I would be making plenty of mistakes, I am not a developer, and i am completely new to java script.
    the record is the id of my form.
    It did show at the beginning document.forms["record"] but i modified that.

    changing the value of the field with name startd, can be changend by adressing it from a function and doing record.startd.value= which is [form id].[parameter id].[property of the parameter i guess]

    I have tried today not to target the response of the server to an iframe but to a new window and it works perfectly.

    So the problem, or the interesting question remaining is.

    How come this doesnt work when you post it to an iframe?

  9. #9
    Join Date
    Apr 2010
    Location
    Oslo, Norway
    Posts
    89
    I must admit, I haven't been working with Iframes since..oh, 1999 or something.
    In todays world, this would be done with other techniques, avoiding form-targets and the iframes alltogether. I still think you should try to imeplement some kind of "delay" between your calls to the server though, as you practically send any and all of them at the same time. Remember, it doesn't wait for the first one to finish before it sends the other. ..

    Best of luck!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles