0

我有 3 个组合框:部门、课程、活动。从部门表中加载所有部门的部门组合框。我需要将课程加载到一个组合框中,并将活动加载到属于某个部门的另一个组合框中。表模式如下所示。

    Department Table
    ----------------
    | Dept | Name  |
    ----------------
    | 1    | Dept1 |
    | 2    | Dept2 |
    ----------------

    Department Course Table
    ----------------------
    | Cid |Dept | Course |
    ----------------------
    | 1   | 1   | abc    |
    | 2   | 1   | xyz    |
    | 3   | 1   | pqr    |
    | 4   | 2   | bar    |
    | 5   | 2   | foo    |
    ----------------------

    Department Activities Table
    ---------------------------
    | Aid | Dept | Activities |
    ---------------------------
    | 1   | 1    | foo1       |
    | 2   | 1    | foo2       |
    | 3   | 1    | foo3       |
    | 4   | 2    | bar1       |
    | 5   | 2    | bar2       |
    ---------------------------

部门组合框将加载部门1和部门2。当Dept1选择Dept1的课程时,应加载在课程中,组合框IE(ABC,XYX,PQR)和属于Dept1的活动应加载到活动组合盒中,富1,富2,富3)。

如何在 AJAX 或 jQuery 中同时调用两个函数?

4

2 回答 2

2

你可以这样做:

$('#department_combo').change(function(){
    $.ajax({
        url: "/someUrl/courses",
        success: function(data) {
            // Populate courses with data
        }
    });
    $.ajax({
        url: "/someUrl/activities",
        success: function(data) {
            // Populate activities with data
        }
    });
});
于 2013-07-25T09:48:16.150 回答
0

由于活动和课程是特定于部门的,我会做一个 ajax 请求,返回 JSON 对象中特定部门的课程和活动,当使用选择的部门 1 时可能看起来像这样:

{
courses : [
    {cid:1,course:'abc'},
    {cid:2,course:'xyz'},
    {cid:3,course:'prq'}],
activities : [
    {aid:1,activity:'foo1'},
    {aid:2,activity:'foo2'},
    {aid:3,activity:'foo3'}]
}

当用户选择 dep2 时:

{
courses : [
    {cid:4,course:'bar'},
    {cid:5,course:'foo'}],
activities : [
    {aid:4,activity:'bar1'},
    {aid:5,activity:'bar2'}]
}

因此,在您的部门下拉列表的更改事件中,您的事件处理程序将发出您的 ajax 请求,并使用从服务器返回的结果填充活动和课程下拉列表。

$('#department').change(function(){
    $.ajax(
       url: 'urlToYourServersideCode',
       success: function(coursesAndActvities){
           var courses = coursesAndActivies.courses,
               activites = coursesAndActivies.activities,
               sCourses='',
               sActivies = '';
           for(var idx = 0;idx < activities.length;++idx){          
               sActivities+= '<option value="'+ activities[idx].aid +'">' + activities[idx].activity +'</option>';

           }
           for(var idx = 0;idx < courses.length;++idx){         
               sCourses+= '<option value="'+ courses[idx].aid +'">' + courses[idx].course+'</option>';

           }
           $('#activities).empty().append(sActivities);
           $('#courses).empty().append(sCourses);
       }
 );
});
于 2013-07-25T10:12:32.287 回答