如何使用PHP和angularjs从模态中检索post数据


how to retrieve post data from a modal using php and angularjs

我已经尝试了5个小时,但仍然没有运气!

I want to

在index.html中提交一个模态,提交的数据应该用php和angular js打印出来。

My code index.html:
           <div class="container" ng-controller="myCrudController">
    <div class="row">
        <div class="col s12">
            <h4>Products</h4>
            <form id="modal-product-form" class="modal" >
                <div class="modal-content">
                    <h5 id="modal-product-title"></h5>
                    <div class="row">
                        <div class="input-field col s12">
                            <input  type="text" class="validate" id="form-name" placeholder="Type name here..." />
                            <label for="name">Name</label>
                        </div>
                        <div class="input-field col s12">
                            <textarea  type="text" class="validate materialize-textarea" placeholder="Type description here..."></textarea>
                            <label for="description">Description</label>
                        </div>

                        <div class="input-field col s12">
                            <input  type="text" class="validate" id="form-price" placeholder="Type price here..." />
                            <label for="price">Price</label>
                        </div>

                        <div class="input-field col s12">
                            <a id="btn-create-product" class=" btn margin-bottom-1em"  ng-click="createProduct()"><i class="material-icons left">add</i>Create</a>
                            <a id="btn-update-product" class=" btn margin-bottom-1em" ><i class="material-icons left">edit</i>Save Changes</a>
                            <a class="modal-action modal-close  btn margin-bottom-1em"><i class="material-icons left">close</i>Close</a>
                        </div>
                    </div>
                </div>
            </form>
            <!-- floating button for creating product -->
            <div class="fixed-action-btn" style="bottom:45px; right:24px;">
                <a class=" btn btn-floating btn-large red modal-open" href="#modal-product-form" ng-click="showCreateForm()"><i class="large material-icons">add</i></a
            </div>
        </div>
    </div>
</div>

我的angular脚本代码如下:

      var app = angular.module("myCrudModule", []).controller("myCrudController", function ($scope, $http, $log) {
    $scope.showCreateForm = function () {
        $scope.id = "";
        $scope.name = "";
        $scope.description = "";
        $scope.price = "";
        $scope.user = {};
        $('#modal-product-title').text("Create product form");
        $('#btn-update-product').hide();
        $('#btn-create-product').show();
        $scope.createProduct = function(){
            // fields in key-value pairs
            $http.post('create_product.php', {
                    'name' : $scope.name,
                    'description' : $scope.description,
                    'price' : $scope.price
                }
            ).success(function (data, status, headers, config) {
                console.log(data);
                // tell the user new product was created
                Materialize.toast(data, 4000);
                // close modal
                $('#modal-product-form').closeModal();
                // clear modal content
                $scope.id = "";
                $scope.name = "";
                $scope.description = "";
                $scope.price = "";
                // refresh the list
               // $scope.getAll();
            });
        }
    }
});

我的create_product PHP文件是

     <?php
include_once 'config/database_connection.php';
$database = new Database();
$db = $database->get_connection();
include_once 'objects/product.php';
$product = new Product($db);
// get posted data
$data = json_decode(file_get_contents("php://input"));
error_log($data->name);
// set product property values
$product->name = $data->name;
$product->price = $data->price;
$product->description = $data->description;
$product->created = date('Y-m-d H:i:s');
if($product->create()){
    echo "Product was created.";
}
// if unable to create the product, tell the user
else{
    echo "Unable to create product.";
}
?>

我得到空值时,我提交的形式,并希望打印数据如下

$data = json_decode(file_get_contents("php://input"));
error_log($data->name);

有人能帮我一下吗我是angular的新手

完整的文件URL必须用于ajax/get和post请求。在下面几行修改httppathtoyourscript/create_product.php。

$http.post('create_product.php', {
                    'name' : $scope.name,
                    'description' : $scope.description,
                    'price' : $scope.price
                }