Question

我想获取select标签id =“departmentselect”的数据，以便在提交表单之前将其值存储在mysql数据库中。我听说您在提交表单之前会使用AJAX来获取数据。因为当我选择College select标签及其相应的部门选择标签值时，它只会在数据库的部门中存储一个数字。

示例MYSQL数据库：

在mysql的查询中，部门没有获取JSON文件的值。它只显示数字。

这是我的 PHPCode

<!DOCTYPE html>
<html>
<head>
    <title>Sample</title>
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<form action="SignupProcess.php" method="POST" onsubmit="return check_password();" id="signupform">
    <select id="collegeselect" name="collegeselect">
      <option value="">College</option>
      <option value="College of CAS">College of CAS</option>
    </select>

    <select id="departmentselect" name="departmentselect">
        <option value="">Department</option>
    </select>
</form>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
<script src="GetCollegeJsonData.js"></script>
<script>
        $('#signupform').submit(function(e))
        {
            if($('#departmentselect').val() != '')
            {
                $ajax
                ({
                    type: 'POST',
                    url: 'Signup.php?select' += select,
                    success: function(data)
                    {
                        alert(data);
                    }
                });
            }
            else
            {
                alert('error');
            }
            e.preventDefault();
        });
</script>
</html>

脚本类型 这是使用ajax的脚本，但似乎没有任何效果。

<script>
        $('#signupform').submit(function(e))
        {
            if($('#departmentselect').val() != '')
            {
                $ajax
                ({
                    type: 'POST',
                    url: 'Signup.php?select' += select,
                    success: function(data)
                    {
                        alert(data);
                    }
                });
            }
            else
            {
                alert('error');
            }
            e.preventDefault();
        });
</script>

JQUERY Code 文件名 GetCollegeJsonData.js

我从文件中获取JSON数据并将其读入我的Jquery文件，然后使用脚本将文件链接到我的PHP代码

//Get json
$('body').on('change', '#collegeselect', function() {
    var selected_college = $(this).val();

    $('#departmentselect').html('');

    $.getJSON("CollegeAndDepartment.json", function(data) {
        $.each(data[selected_college], function(key, val) {
            $('#departmentselect').append("<option value='" + key + "'>" + val + "</option>");
        });
    });
})

JSON文件

{
    "College of CAS": ["Biology", "English", "LIACOM", "Library & Information Science", "Mass Communication", "Philosophy", "Political Science", "Psychology"]
}

我的Ajax功能是不正确的？

Answer 1

您的ajax方法代码有语法错误，当您使用post方法时，您必须使用数据选项而不是URL来发布数据。数据应该在json对象或查询字符串中。你的ajax函数应该是

<script>
        $('#signupform').submit(function(e))
        {
            if($('#departmentselect').val() != '')
            {
                $.ajax({
                    type: 'POST',
                    url: 'Signup.php',
                    data: {select: $('#departmentselect').val()},
                    success: function(data)
                    {
                        alert(data);
                    }
                });
            }
            else
            {
                alert('error');
            }
            e.preventDefault();
        });
</script>

Answer 2

我已编辑了您的代码，如下所示。

boolean

如何在提交到PHP之前使用AJAX从select标签中获取数据？

2 个答案: