Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

Causing Uncaught Syntax error when clicking the dropdown list in navbar

Currently, I got an error when I click the dropdown list in my website. Error is Uncaught Syntax error, unrecognized expression: #. That error only cause when I use my website in Chrome or Edge. Currently, I’m using in IE11 and it cause no error for me but IE11 is shutting down, so I’m migrating to Chrome and I found that error. Is there any way to fix it?

echo "<ul>";
echo "<li class='dropdown'>"; //site
    echo "<label id='sit' class='dropbtn' value=''>CHOOSE SITE</label>";
        echo "<div class='dropdown-content'>";
        echo "<label class='content' value='sit_0'>ALL</label>";
      echo "<label class='content' value='sit_7'>AMK6E</label>";
        echo "<label class='content' value='sit_4'>AMKJ9</label>";
        echo "<label class='content' value='sit_9'>TPY</label>";
    echo "</div>";
echo "</li>";
echo "<li class='dropdown'>"; //year
    echo "<label id='yea' class='dropbtn' value=''>CHOOSE YEAR</label>";
        echo "<div id='year' class='dropdown-content'>";
        $sql = "SELECT DISTINCT LEFT(`yearweek`, 4) AS 'year' FROM `$tbl` WHERE LEFT(`yearweek`, 4) >= '2015' ORDER By `year` ASC";
        $result = mysqli_query($conn, $sql);
        while($row = mysqli_fetch_array($result)) {     
            echo "<label class='content' value='yea_".$row["year"]."'>".$row["year"]."</label>";
        }
    mysqli_close($conn);
    echo "</div>";
echo "</li>";
echo "<li class='dropdown'>"; //platform
    echo "<label id='pla' class='dropbtn'>CHOOSE PLATFORM</label>";
    echo "<div id='platform' class='dropdown-content'>";
    echo "</div>";
echo "</li>";
echo "<li class='dropdown'>"; //start week
    echo "<label id='str' class='dropbtn'>CHOOSE START WEEK</label>";
    echo "<div id='strweek' class='dropdown-content'>";
    echo "</div>";
echo "</li>";
echo "<li class='dropdown'>"; //end week
    echo "<label id='end' class='dropbtn'>CHOOSE END WEEK</label>";
    echo "<div id='endweek' class='dropdown-content'>";
    echo "</div>";
echo "</li>";
echo "<li class='dropdown'>"; //end week
  echo "<label id='run' class='dropbtn'>RUN</label>";
echo "</li>";

echo "</ul>";

Below is Javascript code.


    $(document).ready(function () {
    $('.content').click(function(){
        var raw = $(this).val(); 
        var sid = raw.substring(0,3);
        var val = raw.substring(4,raw.length);
        
        //alert('rep value: '+$('#rep').val());
        //alert(sid+" - "+val+": "+$(this).text());
        
        $('#'+sid).text($(this).text());
        $('#'+sid).val(val);
        //alert(raw+" | "+val);
        if(sid == "pla"){ alert(val); }
        if(sid == "yea"){ 
            //$('#sit').text();
            //alert(raw+" | "+val+" | "+$('#sit').text()+" | "+$('#rep').text());

            runQuery(sid, val);
        }
        
        //alert('rep value: '+$('#rep').val());
        
    }) 

    $('#run').click(function(){ 
        runQuery();;
    })
});

function stripId(x){
    //alert(x);
    var id = x.substring(0,3);
    var vl = x.substring(4,x.length);
    document.getElementById(id).innerHTML = vl;
    if(id != "end"){ runQuery(id, vl); }
}

function runQuery(id, val){
    //var drtn = $('#rep').text();
    var site = $('#sit').text();
    var year = $('#yea').text();
    var plfm = $('#pla').text();
    var stwk = $('#str').text();
    var edwk = $('#end').text();

    if(id == "yea"){ var rslt = "platform"; var page = "tester"; }
    else if(id == "pla"){ var rslt = "strweek"; var page = "week"; var slct = 0; }
    else if(id == "str"){ var rslt = "endweek"; var page = "week"; var slct = 1; }
    else { var rslt = "resultDiv"; var page = "Weekly/result"; }

    if(window.XMLHttpRequest){ // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
    } else { // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
    }
    
    xmlhttp.onreadystatechange = function(){
        if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
            document.getElementById(rslt).innerHTML = xmlhttp.responseText;
        }
    }
    //alert(rslt);
    //document.getElementById(rslt).innerHTML = '<div id="inResult"><img id="loading" src="/web/tools/_frontend/preloaders/Squares_3.gif"></img>Loading...</div>';
    if(page == "Weekly/result"){ document.getElementById(rslt).innerHTML = '<div id=inResultDiv><img src="/web/tools/_frontend/preloaders/Squares_3.gif" height="75" width="75" alt="Loading..."/><br>Loading..</div>'; }
    xmlhttp.open("GET", page+".php?site="+site+"&year="+year+"&plfm="+plfm+"&slct="+slct+"&stwk="+stwk+"&edwk="+edwk, true);
    xmlhttp.send();

}

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

>Solution :

When you try to get the .val() of $(‘.content’) clicked, the returned value is "" (empty string).

Change your code to: var raw = $(this).attr('value');
And it will work.

PD: you will need to do so, for each tag element.

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading