Page 1 of 2

javascript not executing (onChange="return function();&

Posted: Sat Oct 25, 2003 1:41 pm
by m3rajk
ok. i'm trying to figure out why these three javascript functions aren't working. from my understanding, they should be working. i don't see any errors, so i figure there's something i don't know about javascript that i need to. i would love to be taught whatever i'm missing.

the page giving issues uses three functions.

mlu() is suppossed to update the location of an image corresponding to a select box (it's called by the selectbox using onChange, i have something similar elsewhere theat works.).
preImgUp() is suppossed to change an iframe (i have a similar thing that changes frames correctly, so i'm perplexed as to why it's not working here) the iframe gerts re-written to display an image (i'm hoping the browsers will query the server for the new image. as of now i expect to get a broken image since i don't have the domain pointing anywhere)
moodselector() is suppossed to take the current mood and mood image location and insert them into a form in the document that called this one. i know all the form names are correct.

currently JAM is the only one of you with an account there, and therfore the only one who can access the pages directly. if anyone would like screen shots i will take them and post them so you can see the layout.

thanx in advance for the help

code for the page with the issue:

Code: Select all

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>FindYourDesire.com -- Help With moods</title>
    <meta name="Author" content="Pages coded by Josh Perlmutter for Desired Creations LLC">
    <meta name="Author" content="Graphics created by ? for Desired Creations LLC">
    <meta name="Author" content="Smileys created by ? for Desired Creations LLC">
    <style type="text/css">
      @import url(textStyle.css);
    </style>
  </head>

  <body>
    <p>This is to help find an internal image/mood combination. You may override this with a mood or image of your own after choosing here</p>
    <form name="moodfind" onReset="window.close();" onSubmit="return moodselector();">
      <table cellspacing="0" class="regnw">
	  <tr>
	    <td><select name="mood" onChange="return mlu();"><option value="http://www.FindYourDesire.com/sitepics/smilies/angry.gif">angry</option><option value="http://www.FindYourDesire.com/sitepics/smilies/broken-hearted.gif">broken-hearted</option><option value="http://www.FindYourDesire.com/sitepics/smilies/love.gif">love</option></select></td>
	    <td><input type="text" name="mil" value=""></td>

	    <td><input type="button" onClick="return prevImgUp();" value="Preview Image"></td>
	  </tr>
	  <tr>
	    <td class="center"><input type="reset" value="I'll use my own"></td>
	    <td class="center"><input type="submit" value="I wanna use these"></td>
	    <td class="previmg"><iframe name="imgview" src="/findyourdesire/help.php?disp=blank"></iframe></td>
	  </tr>
      </table>
    </form>

    <script language="Javascript">
function moodselector(){ // sets mood and mood image location
  var mood=document.moodfind.mood.value; // what is the mood?
  var mil='http://www.FindYourDesire.com/sitepics/smilies/'+mood+'gif'; // where is the image?

  window.opener(document.entry.mood=mood); // set the mood
  window.opener(document.entry.mil=mil); // set the mood image location
  window.self.close(); // close THIS window
}

function mlu(){ // update the mood image location
  var mood=document.moodfind.mood.value; // what is the mood?
  var mil='http://www.FindYourDesire.com/sitepics/smilies/'+mood+'gif'; // where is the image?

  document.moodfind.mil.value=mil; // set the image location
}

function prevImgUp(){ // updates preview of mood image
  var mood=document.moodfind.mood.value; // what is the mood?
  var mil='http://www.FindYourDesire.com/sitepics/smilies/'+mood+'gif'; // where is the image?
  var newpg='<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>Mood Image Preview</title>
     <style type="text/css">
      @import url(textStyle.css);
    </style>
  </head>
  <body>
    <img src="'+mil+'" alt="'+mood+'">
  </body>
</html>'; // new image page

  window.imgview.document.open(); // open the iframe for witing
  window.imgview.document.write(newpg); // update the image
  window.imgview.document.close(); // close the iframe
}

    </script>
      <p>&nbsp;
        <span class="pgcls">
	  <br />Pages coded by Josh Perlmutter for Desired Creations LLC
	  <br />Graphics created by ? for Desired Creations LLC
	  <br />Smileys created by ? for Desired Creations LLC
	  <br />All creations copyrighted by their respective Creators. Reproduction Requires Consent of the Creator and Desired Creations LLC.
        </span>
      </p>
  </body>

</html>

Posted: Sat Oct 25, 2003 3:25 pm
by volka
you can't have multiline string literals in javascript
also it's quite dangerous having html-tags within the script block, at least (though it doesn't change much atm) mark the section as cdata (-comment)

Code: Select all

<script language="Javascript">
    // <!&#1111;CDATA&#1111;
function moodselector()&#123; // sets mood and mood image location
  var mood=document.moodfind.mood.value; // what is the mood?
  var mil='http://www.FindYourDesire.com/sitepics/smilies/'+mood+'gif'; // where is the image?

  window.opener(document.entry.mood=mood); // set the mood
  window.opener(document.entry.mil=mil); // set the mood image location
  window.self.close(); // close THIS window
&#125;

function mlu()&#123; // update the mood image location
  var mood=document.moodfind.mood.value; // what is the mood?
  var mil='http://www.FindYourDesire.com/sitepics/smilies/'+mood+'gif'; // where is the image?

  document.moodfind.mil.value=mil; // set the image location
&#125;

function prevImgUp()&#123; // updates preview of mood image
  var mood=document.moodfind.mood.value; // what is the mood?
  var mil='http://www.FindYourDesire.com/sitepics/smilies/'+mood+'gif'; // where is the image?
  var newpg='<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">'+
'<html>' +
'  <head>' +
'    <title>Mood Image Preview</title>' +
'     <style type="text/css">' +
'      @import url(textStyle.css);' +
'    </style>' +
'  </head>' +
'  <body>' +
'    <img src="'+mil+'" alt="'+mood+'">' +
'  </body>' +
'</html>'; // new image page

  window.imgview.document.open(); // open the iframe for witing
  window.imgview.document.write(newpg); // update the image
  window.imgview.document.close(); // close the iframe
&#125;
// ]]>
    </script>

Posted: Mon Oct 27, 2003 2:33 am
by m3rajk
i didn't know that about multi-string literals. what's the CDATA do? i can't find it in the orielly book i have

Posted: Mon Oct 27, 2003 2:43 am
by twigletmac
IIRC, CDATA is XML character data, it basically says to an XML parser, 'ignore what follows it's not your concern' - same effect as using single quotes around stuff you don't want PHP to parse.

Mac

Posted: Mon Oct 27, 2003 2:54 am
by m3rajk
thanx for the quick response twig. i appreciate it. i figured i'd search on it when more awake... can't get to sleep tongiht :(

Posted: Mon Oct 27, 2003 3:08 am
by m3rajk
even switching to a non-multiline literal and cdata, the function mlu isn't working, so i didn't bother trying the other two since i figure i can take for granted the error sill affect them all.

anyone else have a suggestion?

Posted: Mon Oct 27, 2003 8:39 am
by volka
what's document.entry?

I strongly suggest using a javascript debugger. The mozilla suite has one on-board. If you're using IE you can download a script debugger at http://msdn.microsoft.com/library/defau ... frame=true

Posted: Mon Oct 27, 2003 11:29 am
by m3rajk
how do i get the one in mozilla 1.3.1 ? i looked but didn't see it. i know the old netscape 4.xx you simply typed "javascript" into the command bar. is it the same? i'm testing in mozilla 1.3.1 and then going back and trying it in M$IE 6.0 after it works right in mozilla. i figure after the announcement of M$IE's end-of-life it's more important that it works in mozilla since M$IE has nothing planned to replace it until 2005.

Posted: Mon Oct 27, 2003 12:20 pm
by moerlien
Hi Josh,

A few things going on here. Throw some alerts into your functions so that you can look at what your variable values are.

In function moodselector()
To return a value back to the parent window that pops up this one, use window.opener.document.<formname>.<formfieldname>.value=value;
You're currently assigning the value back to the 'object'.

In your form, change your option values for mood to be the same as your displayed words. Right now, you are concatenating the URL inside of the URL in
var mood=document.moodfind.mood.value; // what is the mood?
var mil='http://www.FindYourDesire.com/sitepics/ ... +mood+'gif'; // where is the image?
Also, make it '.gif' instead of 'gif'.

-Bill

Posted: Mon Oct 27, 2003 1:18 pm
by volka
Image
can't remember if 1.3's menus differs from 1.5's

Posted: Mon Oct 27, 2003 8:01 pm
by m3rajk
ok. i just noticed this elsewhere since it's the same in moz 1.3.1 as 1.5

i take a comment from the db and remove the slashes. issue is mysql has more things that it needs to have slashes on than a string in javascript with '' on the ends.

i tried to

Code: Select all

preg_replace("/''/", "\\''", stripslashes($friend['comment']))
but that doesn't seem to help

Posted: Mon Oct 27, 2003 9:03 pm
by m3rajk
ok. i tried commenting out the one function with an issue.
the other two work perfectly. so now the issue is now to fix one line so that it all works.

the code for the page (the php section from elseif to elseif) the problem line is where i set up the new page for the iframe.

Code: Select all

}elseif(preg_match('/^moods$/i',$_GET['disp'])){ # moods stuff for all blog users
 foreach($moodimages as $mood){ // for each mood
   $moods.="<option value="$mood">$mood</option>";
 }

  bgnmsgpg("Help With {$_GET['disp']}");
  echo <<<END
    <p>This is to help find an internal image/mood combination. You may override this with a mood or image of your own after
 choosing here</p>
    <form name="moodfind" onReset="window.close();" onSubmit="return moodselector();">
      $tsnw
          <tr>
            <td><select name="mood" onChange="return mlu();">$moods</select></td>
            <td><input type="text" name="mil" value=""></td>
            <td><input type="button" onClick="return prevImgUp();" value="Preview Image"></td>
          </tr>
          <tr>
            <td class="center"><input type="reset" value="I'll use my own"></td>
            <td class="center"><input type="submit" value="I wanna use these"></td>
            <td class="previmg"><iframe name="imgview" src="{$_SERVER['PHP_SELF']}?disp=blank"></iframe></td>
          </tr>
      </table>
    </form>
    <script language="Javascript">
    // <![CDATA[
function moodselector(){ // sets mood and mood image location
  var mood=document.moodfind.mood.value; // what is the mood?
  var mil='http://www.FindYourDesire.com/sitepics/smilies/'+mood+'.gif'; // where is the image?

  window.opener.document.entry.mood.value=mood; // set the mood
  window.opener.document.entry.mil.value=mil; // set the mood image location
  window.self.close(); // close THIS window
}

function mlu(){ // update the mood image location
  var mood=document.moodfind.mood.value; // what is the mood?
  var mil='http://www.FindYourDesire.com/sitepics/smilies/'+mood+'.gif'; // where is the image?

  document.moodfind.mil.value=mil; // set the image location
}
/*
function prevImgUp(){ // updates preview of mood image
  var mood=document.moodfind.mood.value; // what is the mood?
  var mil='http://www.FindYourDesire.com/sitepics/smilies/'+mood+'.gif'; // where is the image?
  var newpg="<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">\n<html>\n  <head>\n    <title>Mood Image Prev
iew</title>\n     <style type="text/css">\n      @import url(textStyle.css);\n    </style>\n  </head>\n  <body>\n    <img 
src=""+mil+'" alt="'+mood+"" />\n  </body>\n</html>"; // new image page

  window.imgview.document.open(); // open the iframe for writing
  window.imgview.document.write(newpg); // update the image
  window.imgview.document.close(); // close the iframe
}
*/
// ]]>
    </script>
END;
  clspg();
}elseif(preg_match('/^place$/i',$_GET['disp'])){
it doesn't like the line
var newpg="<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">\n<html>\n <head>\n <title>Mood Image Prev
iew</title>\n <style type=\"text/css\">\n @import url(textStyle.css);\n </style>\n </head>\n <body>\n <img
src=\""+mil+'" alt="'+mood+"\" />\n </body>\n</html>"; // new image page

and says that...
Error: unterminated string literal
Source File: http://24.91.157.113/findyourdesire/help.php?disp=moods
Line: 49, Column: 78
Source Code:
var newpg='<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">'+"
it doesnt' change for ' or to have the entire thing in " with \" where needed. not sure why. i think at this point i've been starting at ti to long see see the issue. pointers would be greatly appreciated

Posted: Mon Oct 27, 2003 10:05 pm
by m3rajk
nevermind. i realized the \n was being interpreted by the php, so i changed it to \\n which got interpreted to \n and it's ... dammit! the other two functions are working now. i still need some help... well. maybe. gimme a sec to try and figure it out on my own.


volka: many thanx on showing me where the javacript console is in mozilla.
:):):)

Posted: Mon Oct 27, 2003 10:55 pm
by m3rajk
ok. i think i know what's causing this:
Error: [Exception... "Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIURI.hostPort]" nsresult: "0x80004005 (NS_ERROR_FAILURE)" location: "JS frame :: chrome://navigator/content/nsBrowserStatusHandler.js :: anonymous :: line 350" data: no]
Source File: chrome://navigator/content/nsBrowserStatusHandler.js
Line: 350
and if i'm right the issue is that the smiley isn't found cuz i haven't got the domain pointing to the server, so that should go away. gonna test it pointing to the server

ok. tested. it looks like that's what causing it

Posted: Tue Oct 28, 2003 7:15 am
by volka
the right tool for the right job ..
it's much easier this way, isn't it. Gosh, I love debuggers (...and syntax highlight of course ;) )