Using Javascript to load dropdown values

Question

I have following code where I am trying to load values into a dropdown from an array(from file page students.js):

student.js

var STU_NAME = 0;
var STU_ID = 1;
var STU_AGE = 2;
var STUDENTS = [
    ["Apple", 1, 15],
    ["Billy", 2, 16]
    ["Cathy", 3, 14]        
        ];

Functions.js

var jQ = $.noConflict();

function populateStudents() {
    jQ('#students').empty();
    jQ('#students').append(jQ("<option></option>").attr("value", "").text("-- Please Select --"));
    for (var _i = 0; _i < students.length; _i++) {
        jQ('#students').append(jQ("<option></option>").attr("value", _i).text(STUDENTS[_i][STU_NAME]));
    }
}

jQ(document).ready(function () {
    populateStudents();
});

mypage.aspx

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">

    </style>
</head>
<body>
    <div id="model">
        <form>
        <div>
            <div id="StudentLabel">
                Student:
            </div>
            <select id="students" name="students">
            </select>
        </div>      
        <script src="../Scripts/Functions.js" type="text/javascript"></script>
        <script src="../Scripts/student.js" type="text/javascript"></script>
        </form>
    </div>
</body>
</html>

I get an error "Microsoft JScript runtime error: '$' is undefined" at line 1 of Functions.js

Can anyone help me on what I would be missing to make it working here.

Sibu · Accepted Answer · 2012-10-19 11:59:23Z

2

You have forgotten to add the jquery library

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script src="../Scripts/Functions.js" type="text/javascript"></script>
<script src="../Scripts/student.js" type="text/javascript"></script>

It is highly recommended to use CDN version of jquery to improve pagespeed,check this link

edited Oct 19, 2012 at 11:59

answered Oct 19, 2012 at 11:54

Sibu

4,6272 gold badges30 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Adil · Accepted Answer · 2012-10-19 12:01:01Z

1

You need to include jquery library, you can download from here Add the script tag in head of page or before you use jquery.

<head runat="server">
    <title></title>
    <style type="text/css">

    </style>
   <script language="javascript" type="text/javascript" src="JS/jquery-1.7.2.js"></script>
    <script src="../Scripts/Functions.js" type="text/javascript"></script>
    <script src="../Scripts/student.js" type="text/javascript"></script>
</head>

edited Oct 19, 2012 at 12:01

answered Oct 19, 2012 at 11:50

Adil

148k25 gold badges217 silver badges207 bronze badges

1 Comment

RMN Over a year ago

That was so foolish of me. Thanks a lot.

Collectives™ on Stack Overflow

Using Javascript to load dropdown values

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related