PHPportalen :: Visa Ämne - Javascript-variabler överkänsliga?

Javascript-variabler överkänsliga?

PHPportalen Forum Index » HTML/CSS/JavaScript/Design

Lägg ett bokmärke på hela tråden

Visa föregående ämne :: Visa nästa ämne

Startad av:

Meddelande

DrViolet

Medlem i: 1173 dagar

Status: Offline

#719465

Skrivet: 2012-01-21 13:54 Ämne: Javascript-variabler överkänsliga?

Har en ajax-funktion med dropdownmenyer, bla. en variabel inuti ajaxfunktionen:

KOD:

var underkategori = document.getElementById("underkategori").value;

En av dropdownlisterna har id="underkategori". Allting låser sig dock när detta skall utföras. När jag tar bort ovanstående kodrad så låser det sig inte.

Har dock kollat det mesta noggrant så jag förstår inte prioblemet.

Dessutom verkar det som om javascript-variabler i så fall är känsliga för fel? Om den inte hittar så låser sig allt?

Till toppen på sidan

DrPhil

Medlem i: 1860 dagar

Status: Offline

#719466

Skrivet: 2012-01-21 14:10 Ämne:

Den raden fungerar felfritt för mig. När du säger dropdownmeny så menar du väl en select? Du är säker på att din select har attributet id="underkategori"? Du råkar inte ha flera element med samma id? Är du säker på att det är denna rad som knasar? Om du har en alert före raden och en alert efter raden så är du säker på att bara den första körs? Om du fortfarande inte hittar något fel så får du nog ge oss fler ledtrådar att gå på. Ge oss åtminstone hur hela javascript-funktionen ser ut och hur din (x)html kod ser ut kring den select du försöker läsa av.

_________________
42

Till toppen på sidan

maxxie

Medlem i: 1625 dagar
Från: X:6459250 Y:1252192
Status: Offline

#719468

Skrivet: 2012-01-21 14:18 Ämne:

Vilken webbläsare använder du, för din kod fungerar inte i min läsare (FF 9.0.1).
Däremot så fungerar denna kod

KOD:

var underkategorier = document.getElementById("lol").getAttribute('value');

...
Det verkar vara flertalet javascript-funktioner som INTE fungerar i FF 9.

Till toppen på sidan

DrViolet

Medlem i: 1173 dagar

Status: Offline

#719469

Skrivet: 2012-01-21 14:48 Ämne:

Testade din rad, men det fungerade inte i alla fall. Fungerar inte i IE heller.

Ersätter man nedanstående kodrad

KOD:

var underkategori = document.getElementById("underkategori").value;

med exempelvis

KOD:

var underkategori = "alla";

så fungerar allt som det ska, dvs man väljer i en dropdownlist varvid en ny ploppar upp till höger om den med anpassade undermenyer. Koden fungerar alltså, men inte när ajax ska hämta in värdet på underkategori.

Ajax ser ut så här:

KOD:

function ajax(page, selected)

{

var kategori = document.getElementById("kategori").value;

var sortering = document.getElementById("sortering").value;

var underkategori = document.getElementById("underkategori").value;

if (kategori=="")

10:

{

11:

document.getElementById("replace").innerHTML="";

12:

return;

13:

}

14:

15:

if (window.XMLHttpRequest)

16:

{// code for IE7+, Firefox, Chrome, Opera, Safari

17:

xmlhttp=new XMLHttpRequest();

18:

}

19:

else

20:

{// code for IE6, IE5

21:

xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

22:

}

23:

24:

xmlhttp.onreadystatechange=function()

25:

{

26:

if (xmlhttp.readyState==4 && xmlhttp.status==200)

27:

{

28:

document.getElementById("replace").innerHTML=xmlhttp.responseText;

29:

document.getElementById("inprogress").style.display = "none";

30:

}

31:

}

32:

// Diverse variabler som sänds till gohere.php

33:

xmlhttp.open("GET","gohere.php?sortmc="+sortering+"&categorymc="+kategori+"&subcategorymc="+underkategori+"&page="+page+"&select="+selected,true);

34:

xmlhttp.send();

35:

36:

document.getElementById("inprogress").style.display = "block";

37:

}

38:

</script>

Ajax anropar kod som ser ut så här:

KOD:

<?php session_start(); ?>

<?php

function dropdownfunction($webpage, $tableName) {

// Här definieras kategorier och underkategorier. Kategorier (första ordet) och underkategorier (resterande ord). "Alla" läggs in automatiskt.

$kategorilista[0] = "pop,brittpop,dansbandspop,övrigt";

$kategorilista[1] = "imitationer,amerikanska,kandis";

10:

$kategorilista[2] = "rock,hårdrock,metal";

11:

$kategorilista[3] = "disco,70-tal,80-tal";

12:

13:

//Dropdown menyerna

14:

15:

// Dropdown sortera

16:

$re_html = '<form action="gohere.php" method="get">';

17:

$re_html .= '<input type="hidden" name="select" value="'.$_GET['select'].'">';

18:

$re_html .= '   SORTERA&nbsp';

19:

$re_html .= '<select name="sortmc" id="sortering" onchange="ajax(1, \''.$_GET['select'].'\')">';

20:

$re_html .= '<option'; if ($_GET['sortmc']=='ingen') $re_html .= ' selected="selected"'; $re_html .=' value="ingen">Ingen</option>';

21:

$re_html .= '<option'; if ($_GET['sortmc']=='downloads') $re_html .= ' selected="selected"'; $re_html .=' value="downloads">Downloads</option>';

22:

$re_html .= '<option'; if ($_GET['sortmc']=='datum') $re_html .= ' selected="selected"'; $re_html .=' value="datum">Datum</option>';

23:

$re_html .= '<option'; if ($_GET['sortmc']=='title') $re_html .= ' selected="selected"'; $re_html .=' value="title">Title</option>';

24:

$re_html .= '</select>';

25:

26:

// Kontrollerar vilken kategori som är vald och skickar tillbaks underkategorierna i en array

27:

function check_category($cat_item, $cat_array) {

28:

$categorywords = array();

29:

$count = 0;

30:

$items = count($cat_array);

31:

// Placerar alla huvudkategorier i en array

32:

for ($i = 0; $i < $items; $i++) {

33:

$ex = explode(",", $cat_array[$i]);

34:

$categorywords[$i] = $ex[0];

35:

}

36:

37:

// Tar fram index för rätt kategori

38:

$i = 0;

39:

while ($categorywords[$i] != $cat_item)

40:

$i++;

41:

// Ta fram en array på underkategorierna

42:

$subcategories = explode(",", $cat_array[$i]);

43:

$notused = array_shift($subcategories);

44:

return $subcategories;

45:

}

46:

47:

48:

// Dropdown lists

49:

$choice = "alla";

50:

$re_html .= '   KATEGORI ';

51:

$re_html .= '<select name="categorymc" id="kategori" onChange="ajax(1, \''.$_GET['select'].'\')">';

52:

$re_html .= '<option'; if ($_GET['categorymc']=='alla') { $re_html .= ' selected="selected"'; $choice = "alla"; } $re_html .=' value="alla">Alla</option>';

53:

54:

//Lägg till valmöjlighter i category

55:

$items = count($kategorilista);

56:

for ($cat = 0; $cat < $items; $cat++) {

57:

$pieces = explode(",", $kategorilista[$cat]);

58:

$re_html .= '<option'; if ($_GET['categorymc']=="$pieces[0]") { $re_html .= ' selected="selected"'; $choice = $pieces[0]; } $re_html .=' value="'.$pieces[0].'">'.$pieces[0].'</option>';

59:

}

60:

$re_html .= '</select>';

61:

62:

if ($choice != "alla")

63:

{

64:

$re_html .= '  ';

65:

//Lägg till valmöjlighter i subcategory, baserat på category

66:

$re_html .= '<select name="subcategorymc" id="underkategori" onChange="ajax(1, \''.$_GET['select'].'\')">';

67:

$re_html .= '<option'; if ($_GET['subcategorymc']=='alla') $re_html .= ' selected="selected"'; $re_html .=' value="alla">Alla</option>';

68:

69:

$subs = check_category($choice, $kategorilista);

70:

$items = count($subs);

71:

for ($subcounter = 0; $subcounter < $items; $subcounter++) {

72:

$subshort = $subs[$subcounter];

73:

$re_html .= '<option'; if ($_GET['subcategorymc']=="$subshort") $re_html .= ' selected="selected"'; $re_html .=' value="'.$subshort.'">'.$subshort.'</option>';

74:

}

75:

$re_html .= '</select>';

76:

}

77:

78:

$re_html .= '</form>';

79:

echo $re_html;

80:

}

81:

Till toppen på sidan

maxxie

Medlem i: 1625 dagar
Från: X:6459250 Y:1252192
Status: Offline

#719472

Skrivet: 2012-01-21 15:03 Ämne:

Jag applicerade din kod på en simplare select, för att se vad den skickar vid onchange och som ex. fick jag detta

KOD:

categorymc hiphop

page 2

select null

sortmc Välj

subcategorymc Välj

Så egentligen ser jag inget fel... Installera gärna Firebug (om du kör firefox! Smile

och aktivera "Konsol" och se vad som händer när du testar )

Till toppen på sidan

DrViolet

Medlem i: 1173 dagar

Status: Offline

#719473

Skrivet: 2012-01-21 15:08 Ämne:

Jag har redan aktiverat Firebug och kollat runt, har dock aldrig använt konsol, vad är det? Något fel är det, för det fungerar varken i FF, IE eller Chrome.

Till toppen på sidan

maxxie

Medlem i: 1625 dagar
Från: X:6459250 Y:1252192
Status: Offline

#719474

Skrivet: 2012-01-21 15:09 Ämne:

Där får du fram fel som sker antingen vid laddning av sida (i JS mm.) eller under tiden en javascriptfunktion används, så som din ajax()...

Till toppen på sidan

DrPhil

Medlem i: 1860 dagar

Status: Offline

#719489

Skrivet: 2012-01-21 18:18 Ämne:

Ledsen om jag förstår fel, men du menar att det från början inte finns ett element med id="underkategori"? Tror du att document.getElementById("underkategori").value skall returnera värdet på ett element som inte finns på sidan än? Om det inte finns något element med id="underkategori" så kommer document.getElementById("underkategori") att returnera null. Eftersom att null inte har något attribut value så kommer körningen av din kod självklart att stanna.

Lösningen borde bli något i stil med:

KOD:

var a = document.getElementById("underkategori");

if (a != null)

{

var underkategori = a.value;

}

_________________
42

Till toppen på sidan

DrViolet

Medlem i: 1173 dagar

Status: Offline

#719495

Skrivet: 2012-01-21 19:08 Ämne:

Det finns hela tiden ett element med id"underkategori", det märkliga är att det inte verkar hittas och att det därför blir fel (?). Felet skulle ju kunna ligga någon annanstans, jag får väl bryta ner koden och ta ut stycke för stycke och testa eller något liknande. Första gången koden anropas ligger dropdownlisterna i <div="replace">-ajaxtaggen. Dessa ersätts senare varje gångajax anropas. Sammanfattat: Allt verkar funka i koden etc förutom när "underkategori" skall inhämtas, då blir det något fel. Allt fungerar ju när man tilldelar javascript-variablen "underkategori" värdet "alla" (= alla underkategeorier) inuti ajaxfunktionen.

Till toppen på sidan

dinmamma

Medlem i: 2078 dagar

Status: Offline

#719506

Skrivet: 2012-01-21 21:37 Ämne:

DrViolet skrev:

Jag har redan aktiverat Firebug och kollat runt, har dock aldrig använt konsol, vad är det? Något fel är det, för det fungerar varken i FF, IE eller Chrome.

Ctrl + Shift + J för att öppna konsolen i Chrome. Klicka sen på "Script" i den lilla menyn som kommer upp i övre delen av konsolen för att se vad som gåt fel vid körningen.

Till toppen på sidan

DrViolet

Medlem i: 1173 dagar

Status: Offline

#719511

Skrivet: 2012-01-21 22:46 Ämne:

Ok, intressant. Det står: Uncaught TypeError: Cannot read property 'value' of null och även Uncaught TypeError: Cannot read property 'value' of null ajax (anonymous function) onchange och hänvisar till just den raden.

Till toppen på sidan

DrPhil

Medlem i: 1860 dagar

Status: Offline

#719512

Skrivet: 2012-01-21 22:49 Ämne:

Jag är ledsen för att tjata, men det låter som att getElementById returnerar null. Du är fortfarande helt säker på att selecten med id="underkategori" finns på sidan när funktionen körs? Om du har sidan på en server så kanske du kan ge oss adressen så att vi kan undersöka noggrannare själva?

_________________
42

Till toppen på sidan

DrViolet

Medlem i: 1173 dagar

Status: Offline

#719513

Skrivet: 2012-01-21 22:55 Ämne:

Märkligt att den hänvisar till de allra sista raderna i koden (116 och 117) för följande felmeddelanden:

(anonymous function)
onchange

På allra sista raden finns bara ett

</html>

Svar ja, den finns ju med i koden:

KOD:

<option value="disco">Disco</option>

<option value="blues">Blues</option>

<option value="klassisk">Klassisk musik</option>

<option value="metal">Metal</option>

<option value="reggae">Reggae</option>

10:

<option value="rnb">RnB/Rap/HipHop</option>

11:

12:

<option value="julmusik">Julmusik</option>

13:

<option value="melodifestivalen">Melodifestivalen</option>

14:

<option value="greatest">Greatest Hits</option>

15:

<option value="svenskt">Svenskt</option>

16:

<option value="Övrigt">Övrigt</option>

17:

</select>

18:

19:

20:

<option value="brittpop">Brittpop</option>

21:

</select>

Till toppen på sidan

dinmamma

Medlem i: 2078 dagar

Status: Offline

#719514

Skrivet: 2012-01-21 23:11 Ämne:

DrViolet skrev:

Ok, intressant. Det står:

Uncaught TypeError: Cannot read property 'value' of null

och även

Uncaught TypeError: Cannot read property 'value' of null
ajax
(anonymous function)
onchange

och hänvisar till just den raden.

Om du provar att lägga javascriptkoden längst ner i html-koden, funkar det bättre då?

Till toppen på sidan

DrViolet

Medlem i: 1173 dagar

Status: Offline

#719516

Inlägget är accepterad som det rätta svaret

Skrivet: 2012-01-21 23:33 Ämne:

Nope. Väldigt konstigt detta, får väl plocka ut stycke för stycke som sagt och se när det börjar bli fel.

Man ska väl kunna ha båda dropdownlisterna i samma <form> ? Tänkte om man skulle testa med två olika <form>.

Uppdaterat:

Jag fick det att fungera genom att använda mig av:

KOD:

var underkategori = document.getElementsByName("underkategori").value;

Mycket märkligt att det inte fungerar med getElementById.

Till toppen på sidan

Visa tidigare inlägg:

PHPportalen Forum Index » HTML/CSS/JavaScript/Design

Du kan inte skapa nya inlägg i det här forumet
Du kan inte svara på inlägg i det här forumet
Du kan inte ändra dina inlägg i det här forumet
Du kan inte ta bort dina inlägg i det här forumet
Du kan inte rösta i det här forumet
Du kan inte bifoga filer i detta forum
Du kan inte ladda ner filer från detta forum

Kontakta oss på adressen: info@phpportalen.net
Webbplatsen bygger i grunden på phpBB © 2001, 2002 phpBB Group

Modifieringar har senare gjorts i systemet av PHPportalen
Sid och logotypdesign skapad av Daren Jularic