asked on

body onload location.reload kill other javascript functions

Hi Experts,

I use location.reload() in a popup in order to ensure that the last record gets displayed after inserting from the main window.
But this method prevents the other scripts in the popup window from opening - I need to open a confirm dialoque for deleting records, but it simply do not open unless I remove the location.reload.

Here's the javascript function on the main page:

function ShowReservationDraftList(){
  var List;
  List = window.open('MCalInsertResDraftList.asp', 'formpopup', 'width=300,height=800,location=0,menubar=0, location=0, titlebar=0,resizeable=no,scrollbars=no,top=0');
  List.focus();
}

Open in new window

And heres the reload code in the popup:

function reloadlist(){
	//window.location.reload(true);
	//return false;
	}

Open in new window

And the form I need to submit:

<form action="MCalInsertResDraftListDelete.asp" onclick="return confirm('Vil du slette alle kladder?')">
<input type="submit" class="buttontxt" value="Slet alle kladder" />
<input type="hidden" name="DraftID" value="none" />
</form>

Open in new window

Any suggestions?

Best regards
MortenWB

Julian Hansen

How are your functions called from your page? You posted two functions neither of which appears to be called from anywhere in your code.

Also - consider using code tags - much easier to work with - I have added them for you.

MortenWB

ASKER

Hej Julian,

thanks for fast reply:)
heres the submits:

I call the "ShowReservationDraftList()" from an input submit button on the main page:

<form id="InsertResDraft'+TimeSlotCt+'" name="InsertRes'+TimeSlotCt+'" action="mcalinsertresdraft.asp" method=post"  onsubmit="ShowReservationDraftList()">
<input id="InsertRes'+TimeSlotCt+'" type="submit" value="liste" style="display:block;"><br>
</form>

Open in new window

And I call the "reloadlist()" from the popup windows body tag:

<body onload="reloadlist();">

Open in new window

And the confirm function are called directly from the forms onsubmit:

<form action="MCalInsertResDraftListDelete.asp" onclick="return confirm('Vil du slette hele listen?'); return false;">

Open in new window

- its that one that do not work, if i activate the location.reload...

oh, code tags! - of course, I was looking but couldn't find them - its been a while since I was on EE - its layout has changed ... but got it now:)

/MortenWB

MortenWB

ASKER

No suggestions yet?

/MortenWB

Julian Hansen

The reason this does not work is because it is an infinite loop
- onload reloadlist
- reload
- onload reloadlist
- etc
What are you trying to achieve?

<body onload="reloadlist();">
function reloadlist(){
	window.location.reload(true);
	return false;
}

Open in new window

MortenWB

ASKER

Ahh, I see - of course - I try to make the popup (child) window refresh following a submit of the form on the main page.

Form action on main page should do two things:
1. insert data into access database
2. Reopen and focus the popup showing the records from the database - including the last inserted record.

Julian Hansen

Does the form do a submit back to the server or are you using AJAX?

MortenWB

ASKER

The form does a submit back to the server - no, its not ajax, i´m using classic asp

Julian Hansen

Then why not just render the popup on the server side (in asp) or render out the javascript to display the popup.

Trying to understand - if you are submitting back to the server - what the issue is with creating the page as you want it to look?

MortenWB

ASKER

Tanks for staying with me, had to leave office for today...

What i suceed in doing is to insert new data in the database and following the submit open the popup that connects to the server, fetching the recordset - but miss the last record, just inserted. If I could make the popup refresh once after getting focus it will get the last record.

Have to return to you later - maybe tomorrow first

Julian Hansen

The popup is just an element on the page - unless you are opening a completely new browser window (which is a bit old school). Do you have some code or a link or screen shots we can look at.

MortenWB

ASKER

Well, i guess I'm rather old school :)

using this code:

function ShowReservationDraftList(){
  var List;
  List = window.open('MCalInsertResDraftList.asp', 'formpopup', 'width=300,height=800,location=0,menubar=0, location=0, titlebar=0,resizeable=no,scrollbars=no,top=0');
  List.focus();
}

Open in new window

opens a whole new browser popup which display a list of records using an ASP <%do while not recordset.EOF%> loop.
But the lastly inserted record do not load from the server untill the popup reload once after opening.

So i'm looking for a way to reload (like forcing one F5 key press) automatically after opening the popup, hence the misconcept of doing a body reload :/ Which more modern method rather than a popup browser window would you recommend to keep an updated recordset on top?

Julian Hansen

But the lastly inserted record do not load from the server untill the popup reload once after opening.

I don't understand what you mean - why would the last record not load?

MortenWB

ASKER

right, I need to clarify - but I have to put the question on hold for the coming week - meanwhile I'll prepare a thorough upload of the code, so You'll have better chance of understanding the methods I use - and the problem I'm adressing.

Thanks for being with me so far - hope You'll have patience till I return (on the 18th)

Best regards
/MortenWB

MortenWB

ASKER

Finally back!

In the frail hope that you or others will pick up on this again, I have made a login on my testsite for you, Julian (or others) to have a look:
Username Julian
password Julian15

the adress is mbweb.dk/bookings/mcallogin.asp

Let me continue the thread by trying this description:

1. I click a timeslot in an asp-generated calendar to open a form (generated in javascript)
2. The form opens already loaded with starttime and locale data, ready for filling in supplementary data
3. when You click submit three things happens:
first the action run an Asp page inserting the data and go back one history step in order to leave the form visible
secondly an onsubmit runs a javascript function transforming the submit button in the form to a confirmation message for preventing more submits of the same form
thirdly an onclick opens the popup list in wich i search for a way to display the new record just inserted

Here follows the flow with codes:

1. I click a timeslot in an asp-generated calendar to open a form (generated in javascript):

                    <div id="TimeSlot<%=TimeSlotCt%>" 
                    class="calendarhoursdiv" 
                    style="position:absolute; 
                    top:<%=firsthourpos%>px; 
                    left:<%=(RoomColW*iRowLoop)+TimecolW+calendarcolW%>px; 
                    width:<%=RoomColW%>px; 
                    height:<%=HourDivHeight%>px; 
                    background-color:<%=TRcolor%>;
                    z-index:1;"
                    onMouseOver="this.style.cursor='pointer'; this.style.background='#EEEEEE'"
                    onMouseOut="this.style.background='<%=TRcolor%>'"
                    onClick="NewRes(<%=TimeSlotCt%>,
                    '<%=myday%>',
                    '<%=mymonth%>',
                    '<%=myyear%>',
					'<%=roomID%>',
					'<%=roominfo("bygningnr")%>',
					'<%=roominfo("lokalenr")%>',
                    '<%=roominfo("lokaletype")%>',
                    '<%=roominfo("lokalenavn")%>',
					'<%=hours%>',
					'<%=hours+rsUserConfig("stdLength")%>',
                    '<%=nextResMinute%>', 
					'<%=firsthourpos%>',
					'<%=leftpos%>',
                    '<%=RoomColW%>', 
                    '<%=HourDivHeight%>', 
					'<%=userFirstname%>',
					'<%=userLastname%>' ,
					'<%=userId%>' 
                    );"
                    ></div>

Open in new window

2. The form opens already loaded with starttime and locale data, ready for filling in supplementary data

function NewRes(
TimeSlotCt, 
myday, 
mymonth, 
myyear, 
roomid, 
bygningnr, 
lokalenr, 
lokaletype, 
lokalenavn, 
fromhour, 
tohour, 
nextResFromMinute, 
firsthourpos, 
leftpos,
RoomColW, 
HourDivHeight, 
UserFirstname, 
UserLastname,
UserID){
//alert(TimeSlotCt+' '+ myday+' '+mymonth+' '+myyear+' '+roomid+' '+ bygningnr+' '+lokalenr+' '+lokaletype+' '+lokalenavn+' '+fromhour+' '+tohour+' '+nextResFromMinute+' '+firsthourpos+' '+ leftpos+' '+RoomColW+' '+HourDivHeight+' '+ userFirstname+' '+ userLastname)
//alert(firsthourpos);
var FormPos
if(firsthourpos >= 514){FormPos = firsthourpos-224};

if (fromhour>=24){fromhour=fromhour-24};
if (tohour>=24){tohour=tohour-24};
if(nextResFromMinute == ''){nextResFromMinute = -1}

var createResDiv = document.getElementById('TimeSlot'+TimeSlotCt);
var source = createResDiv.innerHTML;
var blank = source.search('');
var liste = source.search('liste');

var MyDate = (myday + '/' + mymonth + ' ' + myyear);
var MyDayNr = (new Date(myyear, mymonth, myday));
var weekday = new Array(7);
weekday[2]=  "S\u00F8";
weekday[3] = "Ma";
weekday[4] = "Ti";
weekday[5] = "On";
weekday[6] = "To";
weekday[0] = "Fr";
weekday[1] = "L\u00F8";
var MyDayName = weekday[MyDayNr.getDay()];
//alert(weekday[MyDayNr.getDay()]);


if (createResDiv.innerHTML == ''){

var DATA='\
<form id="InsertResDraft'+TimeSlotCt+'" name="InsertRes'+TimeSlotCt+'" action="mcalinsertresdraft.asp" method=post"  onsubmit="return ValReservationDraftForm('+TimeSlotCt+');">\
<div id="Anull'+TimeSlotCt+'" style="position:absolute; top:0px; display:block; color:#990000;">Anull\u00E9r</div>\
<div id="BGrnd'+TimeSlotCt+'" style="position:absolute; top:12px; width:100%; height:90%; background:#EEEEFF; cursor:text; border-top:thin; border-top-style:solid;" > \
OPRET RESERVATION<br><br>\
lokale <b>'+bygningnr+'.'+lokalenr+' </b><br>\
<input type="hidden" name="TimeSlotCt" value="'+TimeSlotCt+'">\
<input type="hidden" name="bygningnr'+TimeSlotCt+'" value="'+bygningnr+'">\
<input type="hidden" name="resourceId'+TimeSlotCt+'" value="'+lokalenr+'">\
<input type="hidden" name="roomid'+TimeSlotCt+'" value="'+roomid+'">\
<input type="hidden" name="UserID'+TimeSlotCt+'" value="'+UserID+'">\
\
\
'+MyDayName+' d. '+MyDate+'<br>\
<input type="hidden" name="myday'+TimeSlotCt+'" value="'+myday+'">\
<input type="hidden" name="mymonth'+TimeSlotCt+'" value="'+mymonth+'">\
<input type="hidden" name="myyear'+TimeSlotCt+'" value="'+myyear+'">\
\
fra kl. <b>'+fromhour+'</b>: \
<input type="hidden" id="SetFromHour'+TimeSlotCt+'" name="SetFromHour'+TimeSlotCt+'" value="'+fromhour+'">\
<input type="text" id="SetFromMinutes'+TimeSlotCt+'" name="SetFromMinutes'+TimeSlotCt+'" value="00" style="zIndex:4; width:15px;" onkeypress="myKeyPress(event, this)"; onblur="ValNextRes('+nextResFromMinute+', '+TimeSlotCt+');"><br>\
\
til kl. <input id="SetToHour'+TimeSlotCt+'" name="SetToHour'+TimeSlotCt+'" type="text" value="'+tohour+'" style="zIndex:4; width:15px;" onkeypress="myKeyPress(event, this)"; onblur="ValNextRes('+nextResFromMinute+', '+TimeSlotCt+');">:\
<input id="SetToMinutes'+TimeSlotCt+'" name="SetToMinutes'+TimeSlotCt+'" type="text" value="00" style="zIndex:4; width:15px;" onkeypress="myKeyPress(event, this)"; onblur="ValNextRes('+nextResFromMinute+', '+TimeSlotCt+');">\
<br><br>\
<input id="Rekvirent'+TimeSlotCt+'" name="rekvirent'+TimeSlotCt+'" type="text" value="Rekvirent" required style="width:90px; font-size:10px; zIndex:4; border-bottom:thin; border-bottom-style:solid;"><br>\
        <select id="deptcolor'+TimeSlotCt+'" class="submitLink" name="deptcolor'+TimeSlotCt+'" onchange="whichOption('+TimeSlotCt+');" style="text-align:left; width:90px; background-color:#FFFFFF; border-bottom:thin; border-bottom-style:solid;">\
        <option id="item6" tabindex="2" value="#FFFFFF">V\u00E6lg afd.</option>\
        <option id="item6" value="#BBBBBB" style="background-color:#BBBBBB">\u00C6K</option>\
        <option id="item6" value="#FF6666" style="background-color:#FF6666">Musik</option>\
        <option id="item6" value="#9966CC" style="background-color:#9966CC">F\u00E6lles BA</option>\
        <option id="item6" value="#66CCFF" style="background-color:#66CCFF">KUN</option>\
        <option id="item6" value="#FF9900" style="background-color:#FF9900">Retorik</option>\
        <option id="item6" value="#FF99FF" style="background-color:#FF99FF">F\u00E6lles SUP</option>\
        <option id="item6" value="#66CC66" style="background-color:#66CC66">LIT</option>\
        <option id="item6" value="#FFCC99" style="background-color:#FFCC99">Museologi</option>\
        <option id="item6" value="#FFCCFF" style="background-color:#FFCCFF">F\u00E6lles KAN</option>\
        <option id="item6" value="#FFFFCC" style="background-color:#FFFFCC">DRA</option>\
        <option id="item6" value="#FFFFFF" style="background-color:#FFFFFF">Div.</option>\
        </select><br>\
<b>notat</b><br><textarea id="Descript'+TimeSlotCt+'" name="Descript'+TimeSlotCt+'" required style="width:90px; font-size:10px; zIndex:4" >Form\u00E5l med reservationen</textarea>\
<label style="position:relative; top:-3px;">fest</label><input id="Party'+TimeSlotCt+'" name="Party'+TimeSlotCt+'" type="checkbox"><br><br>\
<input id="InsertResInList'+TimeSlotCt+'" type="submit" value="liste" style="display:block;" onclick="OpenResListWindow();"><br>\
</form>\
</div>';
    createResDiv.style.top= (FormPos)+'px';
    createResDiv.style.width='100px';
    createResDiv.style.height='260px';
    createResDiv.style.border='thin';
    createResDiv.style.borderStyle='solid';
    createResDiv.style.borderColor='#333333';
    createResDiv.style.zIndex=3;

    createResDiv.innerHTML=DATA;

document.getElementById('SetToHour'+TimeSlotCt).focus();
document.getElementById('SetToHour'+TimeSlotCt).select();

	document.getElementById('Rekvirent'+TimeSlotCt).onclick = function(e) { 
	e.stopPropagation(); }
	document.getElementById('BGrnd'+TimeSlotCt).onclick = function(e) { 
	e.stopPropagation(); }
	document.getElementById('Descript'+TimeSlotCt).onclick = function(e) { 
	e.stopPropagation(); }
	//document.getElementById('Fest'+TimeSlotCt).onclick = function(e) { 
	//e.stopPropagation(); }
}

else if (createResDiv.innerHTML.search('venteliste')==false) {OpenResListWindow();}

else
{
			
    createResDiv.style.top= (firsthourpos)+'px';
   	createResDiv.style.width=RoomColW+'px';
    createResDiv.style.height=HourDivHeight+'px';
    createResDiv.style.border='thin';
    createResDiv.style.borderStyle='solid';
    createResDiv.style.borderColor='#FFFFFF';
	createResDiv.style.borderBottom='none';
	createResDiv.style.borderTop='none';
    createResDiv.style.zIndex=1;

    createResDiv.innerHTML='';
	}

}

Open in new window

3. when You click submit three things happens:
first the action run an Asp page inserting the data and go back one history step in order to leave the form visible

SQL = "Insert Into reservationkladde" &_
"(dept, applicant, fromminute, tominute, resourceId, RoomID, myday, mymonth, myyear, userid, colorcode, inserttime, notat, party)" &_ 
" values ('" & dept & "', '" & applicant & "', " & fromminute & ", " & tominute & ", " & resourceid & ", " & roomid & ", " & myday & ", " & mymonth & ", " & myyear & ", " & userid & ", '" & deptcolor & "', '" & date() & " kl." & formatdatetime(time(),3) & "', '" & descript & "', " & party & ")"

cn.execute (SQL)

response.Write("<script language='javascript'>window.history.back();</script>")

Open in new window

secondly an onsubmit runs a javascript function transforming the submit button in the form to a confirmation message for preventing more submits of the same form

function ValReservationDraftForm(TimeSlotCt){

var SetDescript = document.getElementById('Descript'+TimeSlotCt);
var SetRekvirent = document.getElementById('Rekvirent'+TimeSlotCt);


if(SetRekvirent.value == 'Rekvirent'){
	alert('Udfyld venligst rekvirentens navn');
	SetRekvirent.style.color='#990000';
	SetRekvirent.value = 'Rekvirent';
	SetRekvirent.focus();
	SetRekvirent.select();
	return false;
	}

else if(SetDescript.value == 'Form\u00E5l med reservationen'){
	alert('Gi\' lige en kort beskrivelse af aktiviteten');
	SetDescript.style.color='#990000';
	SetDescript.value = 'Form\u00E5l med reservationen';
	SetDescript.focus();
	SetDescript.select();
	return false;
	}
document.getElementById('InsertResInList'+TimeSlotCt).type = 'text';
document.getElementById('InsertResInList'+TimeSlotCt).disabled = 'disabled';
document.getElementById('InsertResInList'+TimeSlotCt).style.width = '85px';
document.getElementById('InsertResInList'+TimeSlotCt).style.backgroundColor = '#EEEEFF';
document.getElementById('InsertResInList'+TimeSlotCt).style.color = '#0000ff';
document.getElementById('InsertResInList'+TimeSlotCt).style.fontWeight = 'bold';
document.getElementById('InsertResInList'+TimeSlotCt).value = 'Sat p\u00E5 venteliste';
document.getElementById('Anull'+TimeSlotCt).innerHTML = 'Se venteliste';


	List.window.close();
	List = window.open('MCalInsertResDraftList.asp', 'formpopup', 'width=300,height=800,location=0,menubar=0, location=0, titlebar=0,resizeable=no,scrollbars=no,top=0');
	List.reload(true);
	childWindow.location.reload();
	List.focus();
}

Open in new window

thirdly an onclick opens the popup list in wich i search for a way to display the new record just inserted

function OpenResListWindow(){
var List;
	List = window.open('MCalInsertResDraftList.asp', 'formpopup', 'width=300,height=800,location=0,menubar=0, location=0, titlebar=0,resizeable=no,scrollbars=no,top=0');
	List.reload(true);
	childWindow.location.reload();
	List.focus();
}

Open in new window

Thanks in advance
Morten B

ASKER CERTIFIED SOLUTION

MortenWB

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

MortenWB

ASKER

I did some standard javascript code proofreading and realized I've been blind to simple errors.