使用mysql值填充动态选择字段

时间:2013-12-08 03:42:17

标签: php

我在当前从mysql表中名为courses_selection_list的值填充的表单中选择了字段。此表包含course_idcourse_name。它像课程目录一样工作。我有一个名为courses_by_academy的第二个表。此表有一个名为course_acad_id的唯一AI字段和两个外键academy_idcourse_id。我正在尝试使用选择查询从courses_by_academy中提取academy_id = 15的值,并通过选择字段显示这些结果。 EXAMPLE

<script>
$(document).ready(function () {
var option = $('#courses_offered').val();
showFields(option);

    function showFields(option){ 

        var content = '';
        for (var i = 1; i <= option; i++){
            content += '<div id="course_'+i+'"><label>Course # '+i+'</label><br /><label>Course Name:</label> <select id="coursename_'+i+'" name="coursename_'+i+'"><option value="">--- Select ---</option>"'
                    <?php
                        $course_query = $db_con->prepare("SELECT course_id, course_name FROM courses_selection_list;");
                        $course_query->execute();
                        $data = $course_query->fetchAll();
                        foreach ($data as $row){
                          //dropdown values pulled from database
                           echo 'content += \'<option value="' . $row['course_id'] . ':'.$row['course_name'].'">' . $row['course_name'] . '</option>\';';
                        }
                    ?>
            '"';                   

        content += '</select></br>Class Start Date: <input type="text" id="start_date_' + i + '" name="start_date_' + i + '" class="datepicker" />Class End Date: <input type="text" id="end_date_' + i + '" name="end_date_' + i + '" class="datepicker" /><div>';

        }
        $('#course_catalog').html(content);
        $('#course_catalog').find(".datepicker").datepicker({dateFormat: "yy-mm-dd"});
    }
});
</script>

HTML

<strong>How many courses offered?</strong>
<select name="courses_offered" id="courses_offered">
    <?php
    $db_select2  = $db_con->prepare("
        SELECT      a.academy_id
        FROM        academy a
        LEFT JOIN courses_by_academy ca ON a.academy_id = ca.academy_id
        WHERE a.academy_id = :id
        ");
    if (!$db_select2) return false;
    if (!$db_select2->execute(array(':id' => $id))) return false;
    $courses_count = $db_select2->rowCount();
    echo "<option value=\"$courses_count\" selected=\"selected\">$courses_count</option>";
    ?>
</select>
<div id="course_catalog"></div>

courses_selection_list

+-----------+--------------+
| course_id | course_name  |
+-----------+--------------+
|         1 | Biology      |
|         2 | Calculus     |
+-----------+--------------+

courses_by_academy

+----------------+------------+------------+--------------+-------------------+-----------------+
| course_acad_id | academy_id |  course_id |  course_name | course_start_date |course_end_date  |
+----------------+------------+------------+--------------+-------------------+-----------------+
|              1 |         15 |          1 | Bilogy       | 2012-11-20        | 2012-12-20      |
|              2 |         15 |          2 | Calculus     | 2012-11-20        | 2012-12-20      |
+----------------+------------+------------+--------------+-------------------+-----------------+

1 个答案:

答案 0 :(得分:0)

删除php代码并粘贴到单独的php文件中,然后通过ajax访问该文件,并将响应附加到变量content。试试这个:

function showFields(option){ 

    var content = '';
    for (var i = 1; i <= option; i++){
        content += '<div id="course_'+i+'"><label>Course # '+i+'</label><br /><label>Course Name:</label> <select id="coursename_'+i+'" name="coursename_'+i+'"><option value="">--- Select ---</option>"'

        var data = $.ajax({
         type: "POST",
         url: "demo.php",
         data: { value : option}
         }).responseText);

           content +=data;

 content += '</br>Class Start Date: <input type="text" id="start_date_' + i + '" name="start_date_' + i + '" class="datepicker" />Class End Date: <input type="text" id="end_date_' + i + '" name="end_date_' + i + '" class="datepicker" /><div>';

    }
    $('#course_catalog').html(content);
    $('#course_catalog').find(".datepicker").datepicker({dateFormat: "yy-mm-dd"});
}

Demo.php:

 <?php
 $course_query = $db_con->prepare("SELECT course_id, course_name FROM courses_selection_list;");
    $course_query->execute();
     $data = $course_query->fetchAll();
      foreach ($data as $row){
       //dropdown values pulled from database
     echo '\'<option value="' . $row['course_id'] . ':'.$row['course_name'].'">' . $row['course_name'] . '</option>\';';
       }
       echo '</select>';
 ?>