zend jquery ajax输出与所选值相关的正确值

时间:2016-12-15 18:45:54

标签: javascript php jquery ajax zend-framework

我的目标是在用户选择人时显示与所选值对应的正确信息。例如,如果用户选择第一个人(保罗),我想显示正确的状态并访问与保罗相对应的值。

此外,如果用户向一个人添加了多次访问,我只想显示他们访问过的所有状态。

截至目前,我通过所选输入值显示所有信息。我很困惑,失去了如何处理这个问题。

    // populate people/states, also person/visit form submit
$(document).ready(function(){
    zendPopulatePeople();
    zendPopulateStates();
    displayPeopleData();
    displayStatesData();
    displayVisitsData();

    $('#addPersonSubmit').click(function(e){
        e.preventDefault();
            addPerson();
    });

    $('#addVisitSubmit').click(function(e){
        e.preventDefault();
            addVisit();
    });
});

// display People Data
function displayPeopleData()
{
    $("#SelectHumanDropDown").change(function(){
        var selectedPerson = $("#SelectHumanDropDown").val();
        $.ajax({
            type: "GET",
            url: "api/people/" + selectedPerson,
            dataType: "json",
            success: function(data)
            {
                $("#PeopleInfo").empty();
                var firstName = data[0]["firstname"];
                var lastName = data[0]["lastname"];
                var food = data[0]["food"];

                $("#PeopleInfo").append(
                "First name: " + firstName +
                "<br> Last name: " + lastName +
                "<br> Favorite food: " + food);
            }
        });
    });
}

//display States Data
function displayStatesData()
{
    $("#SelectHumanDropDown").change(function(){
        var selectedPerson = $("#SelectHumanDropDown").val();
        $.ajax({
            type: "GET",
            url: "api/states/" + selectedPerson,
            dataType: "json",
            success: function(data)
            {
                $("#StatesInfo").empty();
                var dataLength = data.length;

                if(dataLength > 0)
                {
                    $.each(data, function(i, item)
                    {
                        var stateName = data[i]["statename"];
                        $("#StatesInfo").append("Visited the State : " + stateName + "<br>");
                    });
                }
                else
                {
                    alert("You need to add a visit");
                }
            }
        });
    });
}

//display Visits Data
function displayVisitsData()
{
    $("#SelectHumanDropDown").change(function(){
        var selectedPerson = $("#SelectHumanDropDown").val();
        $.ajax({
            type: "GET",
            url: "api/visits/" + selectedPerson,
            dataType: "json",
            success: function(data)
            {
                $("#VisitsInfo").empty();
                var dataLength = data.length;

                if(dataLength > 0)
                {
                    $.each(data, function(i, item)
                    {
                        console.log(data[i]);
                        var dateVisit = data[i]["date_visited"];
                        $("#VisitsInfo").append(" on " + dateVisit);
                    });
                }
                else
                {
                    alert("You need to add a visit");
                }
            }
        });
    });
}

//populate zendPeople's dropdowns
function zendPopulatePeople()
{
    $.ajax({
        type:"GET",
        url:"api/people",
        dataType:"json",
        success : function(data)
        {
            $("#SelectHumanDropDown option").not("#personOptions").remove();
            $("#humanNameDropDown option").not("#personOptions").remove();

            $.each(data, function(i,item)
            {
                $("#SelectHumanDropDown").append("<option value='" + data[i].id + "'>" + data[i].firstname + "</option>");
                $("#humanNameDropDown").append("<option value='" + data[i].id + "'>" + data[i].firstname + "</option>");
            });
        },
        error : function(data)
        {
            console.log('failed');
            console.log(data);
        }
    });
}

//populate zendState's dropdown
function zendPopulateStates()
{
    $.ajax({
        type:"GET",
        url:"api/states",
        dataType:"json",
        success : function(data)
        {
            $.each(data, function(i,item)
            {
                $("#stateNameDropDown").append("<option value='" + data[i].id + "'>" + data[i].statename + "</option>");
            });
        }
    });
}

//Add person to database
function addPerson()
{
    $.ajax({
        type: "POST",
        url: "api/people",
        data: $("#personForm").serialize(),
        success: function(data)
        {
            alert("You have added a person");
            console.log(data);
            console.log($("#personForm").serialize());
            zendPopulatePeople();
            displayPeopleData();
        },
        error:function(data)
        {
            alert("Please fill out all inputs");
            console.log(data);
            console.log($("#personForm").serialize());
        }
    });
}

//Add visit to database
function addVisit()
{
    $.ajax({
        type: "POST",
        url: "api/visits",
        data: $("#visitForm").serialize(),
        success: function(data)
        {
            alert("You have added a visit");
            console.log(data);
            console.log($("#visitForm").serialize());
        },
        error: function(data)
        {
            alert("Please fill out all inputs");
            console.log(data);
            console.log($("#visitForm").serialize());
        }
    });
}

所以这是我的init.php(数据库):

    <?php

//zf configure db-adapter "adapter=PDO_MYSQL&dbname=[myDB]&host=[localhost]&username=[root]&password=[root]" -s development

// Define variables. 
$host = "localhost";
$user = "root";
$password = "root";
$database = "myDB";

//Create connection
$connection = mysqli_connect($host, $user, $password);

// Check connection
if(!$connection){
die("Could not connect: " . mysqli_connect_error());}
else{
    echo "Connection successfully \n";
}

// Drop database
$dropDB = "DROP DATABASE myDB";

// Check drop database
if($connection->query($dropDB) === TRUE){
     echo "Database myDB was successfully dropped \n";
} else {
    echo "Error dropping database: \n" . $connection->error;
}

//Create Database called "myDB"
$db = "CREATE DATABASE IF NOT EXISTS myDB";

//Check Datebase
if($connection->query($db) === TRUE){
    echo "Database created successfully \n";
} else {
    echo "Error creating database: \n" . $connection->error;
}

// Select Database
$connection->select_db($database);

//Create States Table
$statesTable = "CREATE TABLE IF NOT EXISTS States
(
id INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
stateabb varchar(2) NOT NULL,
statename varchar(40) NOT NULL
)";

// Create People Table
$peopleTable = "CREATE TABLE IF NOT EXISTS People
(
id INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
firstname varchar(40) NOT NULL,
lastname varchar(40) NOT NULL,
food varchar(40) NOT NULL
)";

// Create Visit Table
$visitTable = "CREATE TABLE IF NOT EXISTS Visits
(
id INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
p_id INT(40) NOT NULL,
s_id INT(40) NOT NULL,
FOREIGN KEY (p_id) REFERENCES People(id),
FOREIGN KEY (s_id) REFERENCES States(id),
date_visited varchar(40) NOT NULL
)";

//Check States Table
if($connection->query($statesTable) === TRUE) 
{
    echo "States Table created successfully \n";
}
else
{
    echo "States Table wasn't created \n" . $connection->error;
}

//Check People Table
if($connection->query($peopleTable) === TRUE) 
{
    echo "People Table created successfully \n";
}
else
{
    echo "People Table wasn't created \n" . $connection->error;
}

//Check Visit Table
if($connection->query($visitTable) === TRUE) 
{
    echo "Visit Table created successfully \n";
}
else
{
    echo "Visit Table wasn't created \n" . $connection->error;
}

// Insert data into states table
$insertData = " INSERT INTO States (stateabb, statename) 
                VALUES ('LA', 'Louisiana');";
$insertData .= "INSERT INTO States (stateabb, statename) 
                VALUES ('FL', 'Florida');";
$insertData .= "INSERT INTO States (stateabb, statename) 
                VALUES ('TX', 'Texas');";
$insertData .= "INSERT INTO States (stateabb, statename) 
                VALUES ('NM', 'New Mexico');";
$insertData .= "INSERT INTO States (stateabb, statename) 
                VALUES ('ID', 'Idaho');";
$insertData .= "INSERT INTO States (stateabb, statename) 
                VALUES ('IA', 'Iowa');";
$insertData .= "INSERT INTO States (stateabb, statename) 
                VALUES ('ME', 'Maine');";
$insertData .= "INSERT INTO States (stateabb, statename) 
                VALUES ('NV', 'Nevada');";
$insertData .= "INSERT INTO States (stateabb, statename) 
                VALUES ('NY', 'New York');";
$insertData .= "INSERT INTO States (stateabb, statename) 
                VALUES ('UT', 'Utah');";

// Insert data into people table
$insertData .= "INSERT INTO People (firstname, lastname, food) 
                VALUES ('Paul', 'Chu', 'Rice');";
$insertData .= "INSERT INTO People (firstname, lastname, food) 
                VALUES ('Chui', 'Chu', 'Steak');";
$insertData .= "INSERT INTO People (firstname, lastname, food) 
                VALUES ('Pandalord', 'Chu', 'Cookies');";
$insertData .= "INSERT INTO People (firstname, lastname, food) 
                VALUES ('LordBabyPanda', 'Chu', 'Milk');";

// Insert data into Visits table
$insertData .= "INSERT INTO Visits (p_id, s_id, date_visited) 
                VALUES ('1', '1', '1994/07/14');";
$insertData .= "INSERT INTO Visits (p_id, s_id, date_visited) 
                VALUES ('1', '2', '1994/07/14');";
$insertData .= "INSERT INTO Visits (p_id, s_id, date_visited) 
                VALUES ('2', '10', '1994/07/14');";
$insertData .= "INSERT INTO Visits (p_id, s_id, date_visited) 
                VALUES ('3', '9', '1994/07/14');";
$insertData .= "INSERT INTO Visits (p_id, s_id, date_visited) 
                VALUES ('4', '7', '1994/07/14');";

// Check stateData in table
if($connection->multi_query($insertData) === TRUE)
{
    $lastID = $connection->insert_id;
    echo "insertData create successfully. Last inserted ID is: " . $lastID . "\n";
}

else
{
    echo "Error: \n" . $connection->error;
}

//Close Connection
$connection->close();
?>

请感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

所以我通过在后端执行它来解决我的问题并将正确的信息反射回数组然后只回显json_encode。

os.environ.setdefault("DJANGO_SETTINGS_MODULE", "myapp.settings")