webForumDet fria alternativet

sätta villkor för checkboxar i tabell

JavaScript

8 svar · 554 visningar · startad av devotion

Medlem sedan jan. 20013 582 inlägg
Frågan#1

Hej!

Jag har en tabell i ett formulär som ser ut som bifogad bild.

Koden ser ut så här (genereras av ett asp-script):

	<Form action="addArticleToCart.asp" method="post" >

	<input type="hidden" name="searchValue" id="searchValue" value="EKLK 3G1,5 T500" />
	<input type="hidden" name="searchType" id="searchType" value=""  />
		<table>
			<caption>S&ouml;kresultat</caption>
				<thead>
					<tr>
						<th>Leverant&ouml;r</th>

						<th>E-nummer</th>
						<th>Pris</th>
						<th>Avtalspris</th>
						<th>% h&ouml;gre</th>
						<th>Rabatt</th>
						<th>Kategori</th>

						<th>V&auml;lj</th>
					</tr>
				</thead>
				<tbody>
				
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#FFFFFF>
						<td>Storel<input type="hidden" name="supplier" id="supplier" value="Storel" /></td>
						<td>0423005</td>

						<td>39,50 kr</td>
						<td>5,25 kr</td>
						<td>0,0%</td>
						<td>86,7%</td>
						<td>EKK, EKLK, EKRK</td>
						<td><input name="defaultArticle" id="defaultArticle" type="checkbox" value="2|0423005" /></td>

					</tr>
					
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#EFEFEF>
						<td>Solar<input type="hidden" name="supplier" id="supplier" value="Solar" /></td>
						<td>0423405</td>
						<td>36,00 kr</td>
						<td>5,44 kr</td>
						<td>3,5%</td>

						<td>84,9%</td>
						<td>INST.LEDNING NEXANS</td>
						<td><input name="defaultArticle" id="defaultArticle" type="checkbox" value="1|0423405" /></td>
					</tr>
					
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#FFFFFF>
						<td>Elektroskandia<input type="hidden" name="supplier" id="supplier" value="Elektroskandia" /></td>
						<td>0423005</td>

						<td>20,10 kr</td>
						<td>5,63 kr</td>
						<td>7,1%</td>
						<td>72%</td>
						<td>EKLK DRAKA</td>
						<td><input name="defaultArticle" id="defaultArticle" type="checkbox" value="3|0423005" /></td>

					</tr>
					
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#EFEFEF>
						<td>Ahlsell<input type="hidden" name="supplier" id="supplier" value="Ahlsell" /></td>
						<td>0423405</td>
						<td>55,50 kr</td>
						<td>7,22 kr</td>
						<td>37,3%</td>

						<td>87%</td>
						<td>LED,FK,MK,EKK,EKRK,EKLK,INK HF</td>
						<td><input name="defaultArticle" id="defaultArticle" type="checkbox" value="4|0423405" /></td>
					</tr>
					
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#FFFFFF>
						<td>Selga<input type="hidden" name="supplier" id="supplier" value="Selga" /></td>
						<td>0423005</td>

						<td>45,50 kr</td>
						<td>7,28 kr</td>
						<td>38,6%</td>
						<td>84%</td>
						<td>Installationskablar PVC,över 1,5mm2 Draka</td>
						<td><input name="defaultArticle" id="defaultArticle" type="checkbox" value="5|0423005" /></td>

					</tr>
					
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#EFEFEF>
						<td>Selga<input type="hidden" name="supplier" id="supplier" value="Selga" /></td>
						<td>0423205</td>
						<td>45,50 kr</td>
						<td>7,28 kr</td>
						<td>38,6%</td>

						<td>84%</td>
						<td>Installationskablar PVC, 1,5mm2 Ericsson</td>
						<td><input name="defaultArticle" id="defaultArticle" type="checkbox" value="5|0423205" /></td>
					</tr>
					
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#FFFFFF>
						<td>Ahlsell<input type="hidden" name="supplier" id="supplier" value="Ahlsell" /></td>
						<td>0423005</td>

						<td>116,00 kr</td>
						<td>15,08 kr</td>
						<td>187,0%</td>
						<td>87%</td>
						<td>LED,FK,MK,EKK,EKRK,EKLK,INK HF</td>
						<td><input name="defaultArticle" id="defaultArticle" type="checkbox" value="4|0423005" /></td>

					</tr>
					
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#EFEFEF>
						<td>Selga<input type="hidden" name="supplier" id="supplier" value="Selga" /></td>
						<td>0423405</td>
						<td>45,50 kr</td>
						<td>45,50 kr</td>
						<td>766,1%</td>

						<td>0%</td>
						<td>Installationskablar PVC, 1,5mm2 Nexans</td>
						<td><input name="defaultArticle" id="defaultArticle" type="checkbox" value="5|0423405" /></td>
					</tr>
					
				</tbody>
		</table>
		<p>
		<label>Antal<input type="text" name="articleAmount" /></label>

		</p>
		<p>
		<input name="add" type="submit" value="L&auml;gg till" />
		</p>
	</Form>

Kan man göra så att det bara går att kryssa i en checkbox från varje leverantör. Finns samma leverantör med 2 gånger ska det bara gå att kryssa i den ena checkboxen.. Försöker man kryssa en till ska det stå typ: Ajabaja, det där var inte tillåtet...

Man kanske måste lägga till en räknare för att kunna särskilja de olikaleverantörerna eller något..

Mvh
Henrik

checkboxar.jpg
Medlem sedan jan. 2002341 inlägg
#2

Idé:

<form ... onsubmit="return validate()">

function validate(){
  var supplier = new Array();
  var inputs = document.getElementsByTagName('input');
  for(var i = 0; i < inputs.size; i++){
    if(inputs[i].type == 'checkbox'){
      var sup_id = inputs[i].value;
      if(supplier[sup_id] == undefined || supplier[sup_id] == null){
        supplier[sup_id] = true;
      } else {
        alert("ajabaja!");
        return false;
      }
    }
  }
}
return true;

Ovanstående förutsätter att value för varje checkbox är ett ID för en leverantör. Skriptet är ej testkört, men det borde (nästan iaf) fungera.

Edit: Hrm.. läste frågan lite slarvigt.. Min varnar inte förrän man fyllt i hela grejen, men vad du kan göra är helt enkelt att lägga onclick="validate()" på alla checkboxar så borde det fungera även då.

Medlem sedan jan. 20013 582 inlägg
#3

Oki, är på resande fot för tillfället...

Ska titta vidare på det när jag kommer hem i början av juli....

Mvh
Henrik

Medlem sedan dec. 20025 483 inlägg
#4
<script type="text/javascript">
function cbValidate(cb)
{
  if (!cb.checked) return;

  var elms = cb.form.elements[cb.name];
  if (elms){
    for (var i = 0; i < elms.length; ++i){
      if (elms[i] != cb && parseInt(cb.value.charAt(0)) == parseInt(elms[i].value.charAt(0)) && elms[i].checked){        
        cb.checked = false;
        alert("Ajabaja! V.g. avmarkera redan valt alternativ");
        break;
      }
    }
  }
}
</script>

	<Form action="addArticleToCart.asp" method="post" >

	<input type="hidden" name="searchValue" id="searchValue" value="EKLK 3G1,5 T500" />
	<input type="hidden" name="searchType" id="searchType" value=""  />
		<table>
			<caption>S&ouml;kresultat</caption>
				<thead>
					<tr>
						<th>Leverant&ouml;r</th>

						<th>E-nummer</th>
						<th>Pris</th>
						<th>Avtalspris</th>
						<th>% h&ouml;gre</th>
						<th>Rabatt</th>
						<th>Kategori</th>

						<th>V&auml;lj</th>
					</tr>
				</thead>
				<tbody>
				
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#FFFFFF>
						<td>Storel<input type="hidden" name="supplier" id="supplier" value="Storel" /></td>
						<td>0423005</td>

						<td>39,50 kr</td>
						<td>5,25 kr</td>
						<td>0,0%</td>
						<td>86,7%</td>
						<td>EKK, EKLK, EKRK</td>
						<td><input onclick="cbValidate(this)" name="defaultArticle" id="defaultArticle" type="checkbox" value="2|0423005" /></td>

					</tr>
					
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#EFEFEF>
						<td>Solar<input type="hidden" name="supplier" id="supplier" value="Solar" /></td>
						<td>0423405</td>
						<td>36,00 kr</td>
						<td>5,44 kr</td>
						<td>3,5%</td>

						<td>84,9%</td>
						<td>INST.LEDNING NEXANS</td>
						<td><input onclick="cbValidate(this)" name="defaultArticle" id="defaultArticle" type="checkbox" value="1|0423405" /></td>
					</tr>
					
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#FFFFFF>
						<td>Elektroskandia<input type="hidden" name="supplier" id="supplier" value="Elektroskandia" /></td>
						<td>0423005</td>

						<td>20,10 kr</td>
						<td>5,63 kr</td>
						<td>7,1%</td>
						<td>72%</td>
						<td>EKLK DRAKA</td>
						<td><input onclick="cbValidate(this)" name="defaultArticle" id="defaultArticle" type="checkbox" value="3|0423005" /></td>

					</tr>
					
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#EFEFEF>
						<td>Ahlsell<input type="hidden" name="supplier" id="supplier" value="Ahlsell" /></td>
						<td>0423405</td>
						<td>55,50 kr</td>
						<td>7,22 kr</td>
						<td>37,3%</td>

						<td>87%</td>
						<td>LED,FK,MK,EKK,EKRK,EKLK,INK HF</td>
						<td><input onclick="cbValidate(this)" name="defaultArticle" id="defaultArticle" type="checkbox" value="4|0423405" /></td>
					</tr>
					
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#FFFFFF>
						<td>Selga<input type="hidden" name="supplier" id="supplier" value="Selga" /></td>
						<td>0423005</td>

						<td>45,50 kr</td>
						<td>7,28 kr</td>
						<td>38,6%</td>
						<td>84%</td>
						<td>Installationskablar PVC,över 1,5mm2 Draka</td>
						<td><input onclick="cbValidate(this)" name="defaultArticle" id="defaultArticle" type="checkbox" value="5|0423005" /></td>

					</tr>
					
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#EFEFEF>
						<td>Selga<input type="hidden" name="supplier" id="supplier" value="Selga" /></td>
						<td>0423205</td>
						<td>45,50 kr</td>
						<td>7,28 kr</td>
						<td>38,6%</td>

						<td>84%</td>
						<td>Installationskablar PVC, 1,5mm2 Ericsson</td>
						<td><input onclick="cbValidate(this)" name="defaultArticle" id="defaultArticle" type="checkbox" value="5|0423205" /></td>
					</tr>
					
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#FFFFFF>
						<td>Ahlsell<input type="hidden" name="supplier" id="supplier" value="Ahlsell" /></td>
						<td>0423005</td>

						<td>116,00 kr</td>
						<td>15,08 kr</td>
						<td>187,0%</td>
						<td>87%</td>
						<td>LED,FK,MK,EKK,EKRK,EKLK,INK HF</td>
						<td><input onclick="cbValidate(this)" name="defaultArticle" id="defaultArticle" type="checkbox" value="4|0423005" /></td>

					</tr>
					
					<tr onMouseOver="this.style.backgroundColor='#D3DEF8';" onMouseOut="this.style.backgroundColor='';" bgcolor=#EFEFEF>
						<td>Selga<input type="hidden" name="supplier" id="supplier" value="Selga" /></td>
						<td>0423405</td>
						<td>45,50 kr</td>
						<td>45,50 kr</td>
						<td>766,1%</td>

						<td>0%</td>
						<td>Installationskablar PVC, 1,5mm2 Nexans</td>
						<td><input onclick="cbValidate(this)" name="defaultArticle" id="defaultArticle" type="checkbox" value="5|0423405" /></td>
					</tr>
					
				</tbody>
		</table>
		<p>
		<label>Antal<input type="text" name="articleAmount" /></label>

		</p>
		<p>
		<input name="add" type="submit" value="L&auml;gg till" />
		</p>
	</Form>

:)

Medlem sedan jan. 20013 582 inlägg
#5

Fantastiskt!

Tackar Peter S

..och välkommen tillbaka till wf.. ;)

Medlem sedan dec. 20025 483 inlägg
#6

:f

Medlem sedan jan. 20013 582 inlägg
#7

hmmm... :(

Det fungerade inte så bra... Det gick att markera flera checkboxar från samma leverantör...

Mvh
Henrik

Medlem sedan dec. 20025 483 inlägg
#8

Med ovanstående kod? Det lyckas jag ej med. Beskriv klicksekvenserna.

:)

Medlem sedan jan. 20013 582 inlägg
#9

Hej igen :r

Glömde sätta onclick i input.... sorry... Nu funkar det finfint!

Mvh
Henrik

265 ms totalt · 4 externa anrop · v20260731065814-full.a51de22e
124 ms — deklarationer (db)
0 ms — hämta statistik (cache)
138 ms — hämta tråd, inlägg och bilagor (db)
124 ms — ändringar (db)