[JS] Wstawianie opcji z obrazkiem do komórki wiersza

justynasankiel · Post autor: **justynasankiel** » ndz sty 11, 2009 11:42 am

Witam!

Czy może mi ktoś powiedzieć jak mając taką stronę i tabelkę na niej:

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

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
<title>Algorytm - Zmieniacz liter na znaki</title>

<style type="text/css">

body {background-color:#FFF}

#box {
    position:absolute; left:30%; width:27%;
    visibility:hidden; overflow:auto; z-index:400;
    padding: 10px;
    background-color:snow;
    border:3px solid goldenrod;
    color:black; font:normal bold 12px Verdana,Arial,Tahoma;
    text-align:center;
}
body > #box {position:fixed}

#box a:link        {text-decoration:none; color:goldenrod}
#box a:visited    {text-decoration:none; color:goldenrod}
#box a:hover        {text-decoration:underline; color:gold}
</style>

<script type="text/javascript">
function box(ide){
     this.id = ide;
     this.open = function(x){
         with(document.getElementById(this.id)){
           style.height='';
           innerHTML=x;
           var y=window.innerHeight?innerHeight:document.body.clientHeight, m=y-50;
           style.height=offsetHeight>m?m+'px':'';
           style.bottom=y/2-offsetHeight/2+'px';
           style.visibility='visible';
         }
     }
     this.close = function(){
         document.getElementById(this.id).style.visibility='hidden';
         return;
     }
}
var prompt = {
                 name : '<fieldset><legend>Wybierz opcję:</legend><center><table width="200">'+
                        '<tr><td></td></tr>'+
                        '<tr><td width="150">Wykonano:</td><td><button name="submit" id="wstaw" onclick="box.open(prompt)"><img src="tak.png" width="30" height="30"></td></tr>'+
                    '<tr><td width="150">Nie wykonano:</td><td><button name="submit" id="wstaw" onlcick="box.open(prompt)"><img src="nie.png" width="30" height="30"></td><td></tr>'+
                    '<tr><td width="200" colspan=2 align="center"><input type="button" value="Cofnij" onClick="box.close(prompt)"></td></tr>'+
                    '</table></center></fieldset>'
             };
var box = new box('box');





wstaw=function(){

u=tabela.getElementsByTagName('TR').getElementsByTagName('TD')[4]

u.appendChild(img_xx);

_okienko_wstaw.style.display='none';
}
</script>


</head>
<body>

<div id="box"></div>

<table border=1>
              <tr>
                  <th width=10 bgcolor="yellow">Nr</td><td width=50 bgcolor="yellow">Temat</th><th width=57 bgcolor="yellow">Wykonanie</th>
              </tr>
              <tr>
                  <td width=10>1</td><td width=50>Czyszczenie samochodu</td><td width=57 bgcolor="snow" onClick="javascript: box.open(prompt.name);"/></td>

              </tr>
              <tr>
                  <td width=10>2</td><td width=50>Mycie samochodu</td><td width=57 bgcolor="snow" onClick="javascript: box.open(prompt.name);" /></td>
              </tr>
</table>


</div>

</body>
</html>

spowodować, żeby klikając w komórkę ostatniej kolumny dla danego wiersza (czyli Wykonanie), uruchamiać skrypt z własnym okienkiem i wybierać opcję (z obrazkiem) poprzez kliknięcie w inputa z obrazkiem i zapisywanie go w komórce ostatniej kolumny, jeśli chciałoby się zrezygnować, to klika się na przycisk Cofnij.

Czyli np dla wiersza 2, klikam w ostatnią komórkę, pojawia mi się okienko, w którym klikam w inputa z obrazkiem tak.png (ponieważ coś zostało wykonane) i dzięki temu ten obrazek zapisuje się w tej komórce, w którą kliknęłam.

I tak samo dla pierwszego wiersza i kolejnych wierszy.

Czy mógłby mi ktoś doradzić jak zrobić, żeby był zapisywany obrazek z przycisku w komórce, w zależności od tego który się kliknie przycisk w okienku?

Zrobiłam również skrypt do zapisywania ale nie działa mi.

Byłabym wdzięczna za okazaną pomoc

justynasankiel