Värjäytyvä rivi formissa

Minulla on taulukko jonka rivien ekassa solussa on radio buttoneita. Millä tavalla pitäisi toteuttaa sellainen toiminto jossa radio buttonin valitsemalla taulukon kyseinen rivi värjäytyy? Siis tr-elementin taustavärin pitäisi aktivoitua klikkauksesta, ei submit-nappulan painalluksesta.
4409
Äänestä

Muut lukivat myös

Vastaukset 4

Vanhimmat

Jokaiseen radiobuttoniin oheinen koodi:

onClick="javascript:vaihda(x);"

x) vaihda järjestysnumero jokaisen rivin kohdalla.

HEAD-osioon oheinen js-koodi:

function toggle( n ){
var row = document.getElementById("rivi" n);
if ( row.style ) {
row.style.backgroundColor = ('red' == row.style.backgroundColor)?
'white' : 'red';
}
}

Jokaiseen taulun riviin yksilöllinen id (esim. id="rivi1", id="rivi2", jne).

Äänestä
  • Kiitos, tuo toimii mainiosti. Ainoa vaan että siinä kun klikkaa radio buttonia ja klikkaa uudestaan jotain toista, tuo väritys jää edelliseen riviin. Pitäisi siis saada jonkinlainen "offClick"-toiminto. Onnistuisiko tämä jollain ehtolausekkella?

    Äänestä

  • Linda87 kirjoitti:

    Kiitos, tuo toimii mainiosti. Ainoa vaan että siinä kun klikkaa radio buttonia ja klikkaa uudestaan jotain toista, tuo väritys jää edelliseen riviin. Pitäisi siis saada jonkinlainen "offClick"-toiminto. Onnistuisiko tämä jollain ehtolausekkella?

    Lisää taulukon riveihin (tr) onmouseover ja onmouseout tapahtumakutsut.

    < tr id="row1" onMouseOut="javascript:toggle(1);" onMouseOver="javascript:toggle(1);" >

    Jokaisella rivillä on siis yksilöllinen numero. Nyt väri vaihtuu kun hiiri on rivin päällä ja palautuu kun hiiri viedään pois. Väri jää pysyväksi jos radiobuttoni on valittuna.

    Äänestä

  • juhakorkeapudas kirjoitti:

    Lisää taulukon riveihin (tr) onmouseover ja onmouseout tapahtumakutsut.

    < tr id="row1" onMouseOut="javascript:toggle(1);" onMouseOver="javascript:toggle(1);" >

    Jokaisella rivillä on siis yksilöllinen numero. Nyt väri vaihtuu kun hiiri on rivin päällä ja palautuu kun hiiri viedään pois. Väri jää pysyväksi jos radiobuttoni on valittuna.

    Hei, kiitos ohjeista. Tein tuon nyt pelkästään sellaisena että rivi värjäytyy onMouseOverilla.

    Haluaisin vielä tietää, onko mahdollista sellainen että rivin sijasta sarake värjäytyy kun sarakkeen ylimmän solun (tai minkä tahansa sarakkeen solun) päälle vetää hiiren? onMouseOver pitäisi siis saada kohdistumaan useampaan soluun kun vain yhden solun päälle vie hiiren.

    Kiitän avusta!

    Äänestä

Kommentoi aloitusta


Linda87 kirjoitti:

Minulla on taulukko jonka rivien ekassa solussa on radio buttoneita. Millä tavalla pitäisi toteuttaa sellainen toiminto jossa radio buttonin valitsemalla taulukon kyseinen rivi värjäytyy? Siis tr-elementin taustavärin pitäisi aktivoitua klikkauksesta, ei submit-nappulan painalluksesta.

Anonyymi
5000

Ilmoita asiaton sisältö

  • Sisältää materiaalia, joka on loukkaavaa, herjaavaa, rasistista, uhkailevaa tai ahdistelevaa.

  • Materiaali sisältää nimiä, yhteystietoja tai muita henkilökohtaisia tietoja. Julkisuuden henkilöistä, julkisissa viroissa toimivista ihmisistä sekä yritysten vastuuhenkilöistä saa keskustella työhön liittyen. Myös yksityiselämään liittyvistä asioista voi keskustella siltä osin, kuin niistä on julkisesti kerrottu.

  • Sisältää lapsille haitallista tai heiltä kiellettyä materiaalia. Seksuaalinen sisältö on sallittua aiheeseen tarkoitetuilla palstoilla, joiden ikäraja on 18 vuotta.

  • Lainvastaista sisältöä voi olla mm. yksityiselämää loukkaavan tiedon levitys, kiihottaminen kansanryhmää vastaan, laiton uhkaaminen, alaikäisiin liittyvä seksuaalinen sisältö/grooming, petokset, identiteettivarkaudet, kunnianloukkaukset ja tekijänoikeusrikkomukset.

  • Sisältö ei liity palstan tai keskusteluketjun aiheeseen.

  • Viesti ei ole suomea tai ruotsia (pl. International Forums), se sisältää mainontaa, se sisältää tekijänoikeuksin suojattua materiaalia, se on massapostitus tai jokin muu syy.

Jaa keskustelu