Question

我有一个由用户选择

生成的表单

这是代码：

<select id="skillcat" name="skillcat[]" class="form-control" onChange="getSkillDescription(this.value)">
<option value ="">SELECT SKILL CATEGORY</option>
<?php 
     foreach($results as $displayCategory) { ?>
     <option value="<?php echo $displayCategory["SkillCatID"]; ?>"><?php echo $displayCategory["SkillCatName"]; ?></option>
<?php } ?>
</select>
<i class="arrow"></i>

<select id="skilldes" name="skilldes[]" class="form-control"></select>
<i class="arrow"></i>

所以当我为第一个选项选择一个值时，它会改变第二个选项的值。

这是getSkillDescription（）

的javascript

<script type="text/javascript">
function getSkillDescription(val) {
$.ajax({
type: "POST",
url: "get_skilldescription.php",
data:'skill_id='+val,
success: function(data){
$("#skilldes").html(data);
}});}
</script>

该脚本将前往get_skilldescription.php。下面是代码：

<?php
include("include/dbconn.php");
session_start();
     $kp = $_SESSION["id"];
function runQuery($query) {
    $result = mysql_query($query);
    while($row=mysql_fetch_assoc($result)) {
        $resultset[] = $row;
    }       
    if(!empty($resultset))
        return $resultset;
}

if(!empty($_POST["skill_id"])) {

$skill=$_POST["skill_id"];

switch($skill)
{
 case 1: $query ="SELECT * FROM skill WHERE skillCatID = 1";
            $results = runQuery($query); break;
    case 2: $query ="SELECT * FROM skill WHERE skillCatID = 2";
            $results = runQuery($query); break;
    case 3: $query ="SELECT * FROM skill WHERE skillCatID = 3";
            $results = runQuery($query); break;
    case 4: $query ="SELECT * FROM skill WHERE skillCatID = 4";
            $results = runQuery($query); break;
    case 5: $query ="SELECT * FROM skill WHERE skillCatID = 5";
            $results = runQuery($query); break;
    case 6: $query ="SELECT * FROM skill WHERE skillCatID = 6";
            $results = runQuery($query); break;
    case 7: $query ="SELECT * FROM skill WHERE skillCatID = 7";
            $results = runQuery($query); break;
    case 8: $query ="SELECT * FROM skill WHERE skillCatID = 8";
            $results = runQuery($query); break;
    case 9: $query ="SELECT * FROM skill WHERE skillCatID = 9";
            $results = runQuery($query); break;
    case 10: $query ="SELECT * FROM skill WHERE skillCatID = 10";
            $results = runQuery($query); break;
    case 11: $query ="SELECT * FROM skill WHERE skillCatID = 11";
            $results = runQuery($query); break;
    case 12: $query ="SELECT * FROM skill WHERE skillCatID = 12";
            $results = runQuery($query); break;
    case 13: $query ="SELECT * FROM skill WHERE skillCatID = 13";
            $results = runQuery($query); break;
    case 14: $query ="SELECT * FROM skill WHERE skillCatID = 14";
            $results = runQuery($query); break;
    case 15: $query ="SELECT * FROM skill WHERE skillCatID = 15";
            $results = runQuery($query); break;
    case 16: $query ="SELECT * FROM skill WHERE skillCatID = 16";
            $results = runQuery($query); break;
    case 17: $query ="SELECT * FROM skill WHERE skillCatID = 17";
            $results = runQuery($query); break;
    case 18: $query ="SELECT * FROM skill WHERE skillCatID = 18";
            $results = runQuery($query); break;


}
?>
<option value="">Select Skill</option>
<?php
foreach($results as $displayskill) {
?>
<option value="<?php echo $displayskill["SkillID"]; ?>"><?php echo $displayskill["SkillDescription"]; ?></option>
<?php
}
}
?>

现在问题是，当我添加新表单时，它将创建另外两个选项。但是当我更改新创建的表单的第一个选项时，它将更改第一个表单的选项值，而不是新创建的表单。我希望你们能帮助我解决这个问题。谢谢

Answer 1

您正在添加一个新表单，其中元素与第一个表单具有相同的ID。

ID是唯一的，请确保每个表单都包含具有唯一ID的字段。

此外，您再次调用getSkillDescription，它明确设置了第一个选择选项$("#skilldes")，因此您需要将此函数设置为通用，并传递您将填充的选择的ID。

function getSkillDescription(val, selectID) {
    $.ajax({
       type: "POST",
       url: "get_skilldescription.php",
       data:'skill_id='+val,
       success: function(data){
          $("#" + selectID).html(data);
       }
    });
}

Answer 2

您使用相同的ID #skilldes使用Ajax调用的响应填充您的第二个表单。确保为每个使用唯一的ID。

如何将更改应用于动态表单

2 个答案: