Link to home
Start Free TrialLog in
Avatar of Toube
Toube

asked on

Input image not working in IE

Hi,

I'm using this code for a form:
echo "<div class=\"foorum_lainaa_yksin\" style=\"height: 16px;\"><form method=\"post\" action=\"index.php?id=$pageid&amp;show=$topicID#quoted\"><input type=\"hidden\" name=\"postID\" value=\"$row[ID]\" /><input type=\"image\" value=\"Lainaa\" onMouseOver=\"this.src='../images/lainaa_over.gif'\" onMouseOut=\"this.src='../images/lainaa_normal.gif'\" src=\"../images/lainaa_normal.gif\" name=\"lainaa\" /></form></div>";

But problem here is that this form works well with mozilla but with IE it does nothing.. well it kind a just loads the pages over and nothing is being displayed as it should be.. any idea why IE is not working?

Thanks,

-T
ASKER CERTIFIED SOLUTION
Avatar of b0lsc0tt
b0lsc0tt
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of Toube
Toube

ASKER

Thanks for your answer.

I'm really not sure were to look.. my code is html tidy cleaned.
Here it is:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<!--<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">-->

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fi" lang="fi" >

<head>

<title>Toubes Intra</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
    <meta content="Web Design, Internetsivut, Kotisivut" name="Toubes Design" />
    <link rel="stylesheet" type="text/css" href="../images/toubesdesign.css" />
    <link rel="icon" type="image/x-icon" href="http://www.toubes-page.net/td/syksy/favicon.ico" />
    <meta content="MSHTML 6.00.2800.1106" name="GENERATOR" />
      <script src="../java/ul.js" type="text/javascript"></script>
      <script language="javascript" type="text/javascript">

function addSmiley(inputbox){
       txtArea = inputbox.form.post;
       txt = inputbox.alt;
       if( document.selection ){
            txtArea.focus();
            document.selection.createRange().text = txt;
       } else if ( txtArea.selectionStart != null )
            txtArea.value = txtArea.value.substring(0, txtArea.selectionStart )
                          + txt
                          + txtArea.value.substring(txtArea.selectionEnd, txtArea.value.length);
       else
            txtArea.value += txt;
       txtArea.focus();
    }

</script>
 </head>

<body id="top">

<a name="sivu_alkuun"></a>
<div id="banner">
<img onLoad="doLoad()" src="../images/banner_test1.jpg" alt="banner"/>
</div>

<div id="sisalto">

<div id="navbar">

<div id="dhtmlgoodies_menu">
<div class="globalnavi">

      <ul>
      <li><a class="" href="http://www.toubes-page.net/td/user/">Etusivu</a><img src="../images/washer.jpg" alt="washer" style="border: none; float: left;" /></li>
      <li><a class="" href="../uutiset">Uutiset</a><img src="../images/washer.jpg" alt="washer" style="border: none; float: left;" /></li>
      <li><a class="" href="../profile">Profiili</a><img src="../images/washer.jpg" alt="washer" style="border: none; float: left;" />
<ul>
                  <li style="font-size: 10px;"><a href="../profile/index.php?id=1">Muokkaa omia tietoja</a></li>
                  <li style="font-size: 10px;"><a href="../profile/index.php?id=2">Tarkistele omia tietoja</a></li>
                  <li style="font-size: 10px;"><a href="../profile/index.php?id=3">Tallennetut linkit</a></li>
</ul>
      </li>
      <li><a class="selected" href="http://www.toubes-page.net/td/user/foorumi">Foorumi</a><img src="../images/washer.jpg" alt="washer" style="border: none; float: left;" />
<ul>
<li style="font-size: 10px;"><a href="http://www.toubes-page.net/td/user/foorumi/index.php?id=1">Aktiiviset Keskustelut</a></li>
<li style="font-size: 10px;"><a href="http://www.toubes-page.net/td/user/foorumi/index.php?id=2">Vanhat keskustelut</a></li>
<li style="font-size: 10px;"><a href="http://www.toubes-page.net/td/user/foorumi/index.php?id=3">Uusimmat viestit</a></li>
<li style="font-size: 10px;"><a href="http://www.toubes-page.net/td/user/foorumi/index.php?id=4">Aloita uusi otsikko</a></li>
<li style="font-size: 10px;"><a href="http://www.toubes-page.net/td/user/rss.php">Uutissyöte</a></li>
</ul>

      </li>
      <li><a class="" href="../users">Käyttäjät</a><img src="../images/washer.jpg" alt="washer" style="border: none; float: left;" />
<ul>
                  <li style="font-size: 10px;"><a href="../users/index.php">Yleiset tiedot</a></li>
                  <li style="font-size: 10px;"><a href="../users/index.php?id=35">Tarkemmat tiedot</a></li>
</ul>
</li>
      <li><a class="" href="../albumi">Albumi</a><img src="../images/washer.jpg" alt="washer" style="border: none; float: left;" />
<ul>
                  <li style="font-size: 10px;"><a href="../albumi/index.php?id=2005">Vuosi 2005</a></li>
                  <li style="font-size: 10px;"><a href="../albumi/index.php?id=2006">Vuosi 2006</a></li>
                  <li style="font-size: 10px;"><a href="../albumi/index.php?id=2007">Vuosi 2007</a></li>
</ul>
</li>

      <li><a class="" href="../links">Linkit</a><img src="../images/washer.jpg" alt="washer" style="border: none; float: left;" /></li>

</ul>

<div class="nofloat"></div>

</div>
</div>

</div>
<br class="clear" />

</div>

<div id="bg">
<div class="logo_bg">
<div class="middle_box_member">

<div id="middle_bar_member">

<span class="member_links_underline" style="margin-left: 38px; font-size: 10px; font-weight: bold;"><a href="http://www.toubes-page.net/td/user/foorumi">Foorumi</a> <span style="font-size: 8px;">&gt;</span> </span> <span class="member_links_underline" style="font-size: 10px; font-weight: bold;"><a href="index.php?id=2">Vanhat keskustelut</a></span><span style="font-size: 8px; font-weight: bold;"> &gt;</span><span style="font-size: 10px; font-weight: bold;"> Tämä on testiotsikko </span></div>
<br/>

<div class="middle_box_member_forum">
<div class="li"><a style="font-size: 9px; margin-left: -4px;" href="index.php?id=1"><img onMouseOver="this.src='../images/aktiiviset_over.gif'"
onMouseOut="this.src='../images/aktiiviset.gif'" src="../images/aktiiviset.gif" style="border: none;" alt="aktiiviset keskustelut"/></a></div><div class="li"><a style="font-size: 9px;" href="index.php?id=2"><img src="../images/vanhat_over.gif" style="border: none;" alt="vanhat keskustelut"/></a></div><div class="li"><a style="font-size: 9px;" href="index.php?id=3"><img onMouseOver="this.src='../images/uusimmat_over.gif'"
onMouseOut="this.src='../images/uusimmat_normal.gif'" src="../images/uusimmat_normal.gif" style="border: none;" alt="uusimmat viestit"/></a></div><div class="li"><a style="font-size: 9px;" href="../rss.php"><img src="../images/uutissyote.gif" style="border: none;" alt="20 uusinta viestiä suosikeihin"/></a></div>
<br/><br/>

</div>
<div class="middle_box_member_forum">

<div style="margin-top: -4px; margin-bottom: 8px; font-size: 14px; font-weight: bold;">
<img src="../images/aktiivi.gif" alt="uusi" style="border: none;" />
Tämä on testiotsikko :</div><div class="new_message">
<span class="member_links_underline_"><img src="../images/uusi_viesti.gif" style="margin-right: 1px;" alt="uusi viesti"/><a href="#viesti">Uusi viesti</a></span></div>
<div style="margin-right: 10px;">


<div class="member_links" style="margin-bottom: 3px; font-size: 9px;"><a href="index.php?id=2&amp;show=41&amp;main_page=1"><img style="border: none;" src="../images/red_arrow_back.gif" alt="Previous page" title="edellinen sivu" /></a>  <a href="index.php?id=2&amp;show=41&amp;main_page=1">1</a>  <span style="font-weight: bold; color: #000000; background-color: #e4900d; padding-left: 2px; padding-right: 2px;">2</span>  <img style="border: none;" src="../images/red_arrow_front.gif" alt="Next page" /></div>
<table border="0" style="border: 1px solid #e4900d;" cellspacing="0" cellpadding="0" width="100%">


    <tr>
    <td width="12%" bgcolor="#490b0b" align="center" style="border-bottom: 1px solid #e4900d; padding: 2px 2px 2px 2px; font-weight: bold;">Kirjoittaja
    </td>
    <td width="100%" bgcolor="#490b0b" style="border-bottom: 1px solid #e4900d; border-left: 1px solid #e4900d; padding: 2px 2px 2px 2px;"><span style="margin-left: 285px; font-weight: bold;">Viesti</span> <span class="member_links_underline_"><img src="../images/arrow_down.gif" style="border: none; margin-left: 282px;" alt="loppuun" /><a style="margin-left: 2px;" href="#sivu_loppuun">Sivun loppuun</a></span>
    </td>
    </tr>


    <tr>
<td width="10%" style="border-bottom: 1px solid #e4900d;" bgcolor="#720606" valign="top">
        <table border="0" cellspacing="0" cellpadding="1" width="100%">
            <tr>
                <td>
                <div class="links_m" style="margin-bottom: -12px; font-weight: bold;">
                <img src="../images/star_black.gif" alt="taso" style="margin-left: 1px; margin-right: -2px; border: none;" />
                <a href="../users/index.php?id=0">Tobba</a></div>
                <br/><div style="color: #000000; font-size: 9px; margin-top: 3px; margin-left: 1px;">[<span style="font-weight: bold;">370</span>]
                <span style="color: #f4c41c;"><br />
                <span>m.a.n</span>                <br/>

                </span>

                </div>
                <div class="button"></div>
                </td>

<tr>
                <td>
                <div class="button_lainaa"></div>

                </td>
            </tr>
        </table>
    </td>

    <td style="width: 100%;" bgcolor= "#f9f3e9">
<div style="background-color: #720606; padding-bottom: 3px; border-left: 1px solid #e4900d;"><span style="color: #ffffff; margin-left: 5px; font-size: 9px; font-weight: bold;"><img src="../images/uusi_viesti.gif" style="border: none; margin-top: 2px;" alt="uusi viesti" />&nbsp;Viesti lähetetty:&nbsp;
10.05.2007 20:20:33</span></div>

        <table style="border-top: 1px solid #e4900d; border-left: 1px solid #e4900d; border-bottom: 1px solid #e4900d;" border="0" cellspacing="0" cellpadding="1" width="100%">
        <tr>

                        <td bgcolor= "#f9f3e9">

                        </td>
            </tr>

            <tr>

                <td bgcolor= "#f9f3e9" style="color: #000000;">

Juu viesti jonka l&auml;hetin &auml;sken eli edellinen viesti oli sen timestamp 20:17 ja forum_read taulun timestamp sanoi 20:16
<br />toisin sanoen on se j&auml;ljess&auml; v&auml;h&auml;n enemm&auml;n kuin 2 sekuntia.                </td>


            </tr>
<tr>
                <td bgcolor= "#f9f3e9">
                                </td>
                </tr>

            <tr>
            <td style="border-top: 1px solid #720606;">
            <table border="0" cellspacing="0" cellpadding="0" width="25%" align="right">
            <tr>
            <td align="right">

// here are button that not work in IE
<div class="foorum_lainaa_yksin" style="height: 16px;"><form method="post" action="index.php?id=2&amp;show=41#quoted"><input type="hidden" name="postID" value="923" /><input type="image" value="Lainaa" onMouseOver="this.src='../images/lainaa_over.gif'"
onMouseOut="this.src='../images/lainaa_normal.gif'" src="../images/lainaa_normal.gif" name="lainaa" /></form></div></td>

<td>

            </td>
            </tr>
            </table>

            </td>
            </tr>

        </table>
    </td>


</tr>
</table>

</div>

     <div style="margin-right: 10px;">
      <table style="border: 1px solid #e4900d; margin-top: -2px;" border="0" cellspacing="0" cellpadding="1" width="100%">
                    <tr>
                    <td bgcolor="#490b0b"><span><span class="member_links_underline_" style="float: right; margin-right: 3px; padding-bottom: 2px;"><img src="../images/arrow_up.gif" style="border: none;" alt="alkuun" /><a style="margin-left: 2px;" href="#sivu_alkuun">Sivun alkuun</a></span></span></td>
                    </tr>
            </table>
            </div>
            </div>

<div class="member_links" style="margin-left: 10px; margin-top: 3px; font-size: 9px;"><a href="index.php?id=2&amp;show=41&amp;main_page=1#viesti"><img style="border: none;" src="../images/red_arrow_back.gif" alt="Previous page" title="edellinen sivu" /></a>  <a href="index.php?id=2&amp;show=41&amp;main_page=1#viesti">1</a>  <span style="font-weight: bold; color: #000000; background-color: #e4900d; padding-left: 2px; padding-right: 2px;">2</span>  <img style="border: none;" src="../images/red_arrow_front.gif" alt="Next page" title="seuraava sivu" /></div>

<div style="margin-left: 10px;">
<form action="pages/content/process_post.php?id=2&amp;show=41" method="post">

<div style="border: 3px solid #e4900d; border-style: double; margin-top: 5px; margin-right: 10px; margin-bottom: 5px;  padding-top: 3px; padding-bottom: 4px; padding-left: 5px; padding-right: 5px; color: #ffffff; width: 210px;">
<p class="li" style="font-weight: bold;">Hymiöt:&nbsp;</p><p class="li"><input type="image" src="../images/smile.gif" alt=":)" onclick="addSmiley(this);return false;" /></p>
<p class="li"><input type="image" src="../images/wink.gif" alt=";)" onclick="addSmiley(this);return false;" /></p>
<p class="li"><input type="image" src="../images/laughing.gif" alt=":D" onclick="addSmiley(this);return false;" /></p>
<p class="li"><input type="image" src="../images/confused.gif" alt=":S" onclick="addSmiley(this);return false;" /></p>
<p class="li"><input type="image" src="../images/sad.gif" alt=":(" onclick="addSmiley(this);return false;" /></p>
<p class="li"><input type="image" src="../images/angry.gif" alt=":@" onclick="addSmiley(this);return false;" /></p>
<p class="li"><input type="image" src="../images/shock.gif" alt=":o" onclick="addSmiley(this);return false;" /></p>
<p class="li"><input type="image" src="../images/cool.gif" alt="(H)" onclick="addSmiley(this);return false;" /></p>
<br class="clear" /></div>

<input type="hidden" name="topicID" value="41" />
<input type="hidden" name="TopicName" value="Tämä on testiotsikko" />

<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td>

<table border="0" cellpadding="2" cellspacing="0" width="65%">
<tr>
<td valign="top">Viesti:</td>
<td>
<textarea style="border: 2px solid #e4900d;" name="post" rows="10" cols="65"></textarea></td></tr>
</table>
</td></tr></table>
<input id="uusiviesti" class="nappi" name="Submit" type="submit" value="Lisää uusi viesti" />

</form>

<a name="sivu_loppuun"></a>
<a name="viesti"></a>
<a name="quoted"></a>


</div>


</div>

</div>

<br class="clear"/><br/>
</div>

</body>
</html>

Regards,

T
It is hard to find a problem when I am not real sure what it is.  Is it possible to provide a link to us so we can see the site online?  Since the problem seems to be related to a part of the page with an image then all of the page HTML is not enough.  I don't have the images. :)

You are using the Strict XHTML doctype but the html doesn't validate for that.  Try switching the doctype to Transitional to see if that fixes the problem.  It is important that your html is valid (or as close as possible).  Errors can prevent the page from looking good, especially in different browsers.

If you need a validator try the one at http://validator.w3.org/.  It can give you a good idea of what to work on.  Look at and especially work on the big errors (i.e. missing, incomplete tags, invalid attributes, etc).

Let me know if you have a question or need more info.  The most helpful would be to get a link or at least a detailed description or what isn't working. :)

bol
Avatar of Toube

ASKER

Ok, I have the same problem when posting a message on same page.
With FF it works fine but with IE it just jumps to the forms action url and shows an empty page..
The page process_post.php adds the data to the db and returns to the same page showing the new message.. but with IE this isn't working when using image.. if I use submit it works fine??

<form action="pages/content/process_post.php?id=<?php echo $pageid;?>&amp;show=<?php echo $topicID; ?>" method="post">

<input style="margin-left: 41px;" type="image" value="Submit" onMouseOver="this.src='../images/lisaa_over.gif'"
onMouseOut="this.src='../images/lisaa_normal.gif'" src="../images/lisaa_normal.gif" name="Submit" />

</form>

So why is this type="image" such a problem for IE?
Avatar of Toube

ASKER

Ok,

you log on here:
http://www.toubes-page.net/td/index.php?id=cpanel&page=login
user: Guest
pass: guest321

and copy paste this to your url, and try to quote(lainaa) or post new message (lisää uusi viesti) using IE
http://www.toubes-page.net/td/user/foorumi/index.php?id=1&show=41#viesti

-T
Avatar of Toube

ASKER

I used a <input hidden field> with the same value and name as the type="image" and this works for IE also:)

-T
I'm glad you got it working.  I never had a chance to look at the URL or login but I'm glad I could help.  Thanks for the fun question.

bol
For the record, I'm facing the same problem.

This is the way Firefox and IE handle input type=image:
Example form:
<form>
<input type=image name=button1 value=button1val src=button1link>
<input type=image name=button2 value=button2val src=button2link>
<input type=text name=example value=something>
</form>

When the first button is clicked, and the form is submit, these values are sent to the webserver:
Firefox:
[button1] => [button1val]
[example] => [something]

Internet Explorer (tested with v7) however:
[example] => [something]


So IE isn't sending the input type=image details back to the webserver. Seems like the only workaround would be to use javascript to set a button ID to a hidden input value.