Question

我的HTML表单数据不是POST

HTML查看页面： -

<div class="col-sm-12">
<div class="card-box">
    <form class="form-inline" name="addstock"
        ng-submit="saveStockPurchaseInvoice()">

        <h3 class="m-t-0 m-b-30 header-title text-center">Invoice
            Details</h3>
        <div class="row" style="margin-bottom: 20px;">

            <div class="form-group col-md-3" style="">
                <select name="supplier" ng-model="productStock.suppliername"
                    class="form-control" required="">
                    <option value="">Select a Supplier</option>
                    <option ng-repeat="allsupplier in supplier"
                        value="{{allsupplier.supplier_id}}">
                        {{allsupplier.supplier_name}}</option>
                </select> <br> <span style="color: red"
                    ng-show="addstock.supplier.$touched && addstock.supplier.$invalid">Supplier
                    is Required.</span>
            </div>

            <div class="form-group col-md-3">

                <input type="text" class="form-control"
                    ng-model="productStock.invoice" id="invoice" name="invoice"
                    placeholder="Enter Invoice Number" required> <br> <span
                    style="color: red"
                    ng-show="addstock.invoice.$touched && addstock.invoice.$invalid">Enter
                    Invoice Number.</span>
            </div>


            <div class="form-group col-md-3">

                <input type="date" name="productdate" id="productdate"
                    ng-model="productStock.productdate" class="form-control"
                    required=""> <br> <span style="color: red"
                    ng-show="addstock.productdate.$touched && addstock.productdate.$invalid">Date
                    is Required.</span>
            </div>

        </div>


        <h3 class="m-t-0 m-b-30 header-title text-center">ITEMS</h3>


        <div ng-repeat="productStock in productStocks"
            style="margin-bottom: 10px;">

            <div class="form-group">
                <!--<input type="text" name="product_name" ng-model="productsStock.product_name"  required="" placeholder="Product Name" class="form-control" id="product_name">-->

                <select name="productStock_name"
                    ng-model="productStock.productStock" class="form-control"
                    required="">
                    <option value="">Select a Product</option>
                    <option ng-repeat="products in allproducts"
                        value="{{products.product_id}}">
                        {{products.product_name}}</option>
                </select> <br> <span style="color: red"
                    ng-show="addstock.productStock_name.$touched && addstock.productStock_name.$invalid">Product
                    Name Required.</span>
            </div>


            <div class="form-group">
                <input id="productstock_qty" type="number" min="1" required=""
                    name="productstock_qty" ng-model="productStock.productstock_qty"
                    placeholder="Product Quantity" class="form-control"> <br>
                <span style="color: red"
                    ng-show="addstock.productstock_qty.$touched && addstock.productstock_qty.$invalid">Product
                    Quantity required.</span>
            </div>


            <div class="form-group">
                <input id="productstock_price" type="number" min="1"
                    ng-model="productStock.productstock_price"
                    name="productstock_price" placeholder="Product Price"
                    class="form-control" maxlength="15" size="10" required="">
                <br> <span style="color: red"
                    ng-show="addstock.productstock_price.$touched && addstock.productstock_price.$invalid">Price
                    required.</span>
            </div>

            <div class="form-group">
                <select name="product_units"
                    ng-model="productStock.productstock_units" class="form-control"
                    required="">
                    <option value="">Select Units</option>
                    <option ng-repeat="units in allunits" value="{{units.unit_id}}">
                        {{units.unit_name}}</option>
                </select> <br> <span style="color: red"
                    ng-show="addstock.product_units.$touched && addstock.product_units.$invalid">Units
                    is required.</span>


            </div>


            <div class="form-group">
                <input id="productstock_cgst" type="text"
                    ng-model="productStock.productstock_cgst" name="productstock_cgst"
                    placeholder="CGST" class="form-control" maxlength="10" size="6"
                    required=""> <br> <span style="color: red"
                    ng-show="addstock.productstock_cgst.$touched && addstock.productstock_cgst.$invalid">required.</span>
            </div>



            <div class="form-group">
                <input id="productstock_sgst" type="text"
                    ng-model="productStock.productstock_sgst" name="productstock_sgst"
                    placeholder="SGST" class="form-control" maxlength="10" size="6"
                    required=""> <br> <span style="color: red"
                    ng-show="addstock.productstock_sgst.$touched && addstock.productstock_sgst.$invalid">required.</span>
            </div>


            <!--<div class="form-group">-->
            <!--    <input id="productstock_gst" type="text"  ng-model="productStock.productstock_gst" ng-keydown="keydownevt()"  name="productstock_gst" placeholder="GST"  class="form-control"  maxlength="10" size="6" required="">-->
            <!--    <br>-->
            <!--    <span style="color:red" ng-show="addstock.productstock_gst.$touched && addstock.productstock_gst.$invalid">required.</span>     -->
            <!--</div>-->


            <div class="form-group">
                <input id="productstock_total" type="text"
                    ng-model="productStock.productstock_total"
                    name="productstock_total" placeholder="Total" class="form-control"
                    required=""> <br> <span style="color: red"
                    ng-show="addstock.productstock_total.$touched && addstock.productstock_total.$invalid">Total
                    is required</span>
            </div>

            <button class="btn btn-danger btn-sm" ng-show="$last"
                ng-click="removeStock()">
                <span class="glyphicon glyphicon-remove"></span>
            </button>
        </div>
        <!-- ng-repeat close for add dynamic product field-->


        <div class="form-group text-right m-b-0">

            <button class="addfields btn btn-info waves-effect waves-light"
                ng-click="addstockproduct()">Add Stock</button>
        </div>

        <div class="form-group text-right m-b-0 pull-right"
            style="margin-top: 10px;">

            <button type="submit" ng-click="" class="btn btn-primary">Save</button>
            <button type="reset" class="btn btn-warning">Reset</button>
        </div>


    </form>
</div>

angularjs控制器： -

//添加动态字段。

$scope.productStocks = [{id: 'firstField2'}];

$scope.addstockproduct = function(){

    var newItemNo2 = $scope.productStocks.length+1;
    $scope.productStocks.push({'id':'field'+newItemNo2});
}

$ scope.removeStock = function（）{

    var itemLast2 = $scope.productStocks.length-1;
    $scope.productStocks.splice(itemLast2);
};

angularjs代码用于添加记录： -

$scope.productStock={};
$scope.suplier_succ = false;
$scope.suplier_err = false;

$scope.saveStockPurchaseInvoice=function(){
   $http({
        method: 'post',
        url: 'stock/insert_stock',
        data: $scope.productStock,
        headers: {'Content-Type': 'application/x-www-form-urlencoded'}
    }).success(function (data)
    {
        if (data == 1) {
            $scope.suplier_succ = $scope.suplier_succ ? false : true;
            $scope.succ = "Stock added successfully";
            $timeout(function () {
                $(".modal").modal("hide");
            }, 3000);

            //  $scope.formsup = {}; // clears input fields
            // $scope.addsuppler.$setPristine(); 
            // $scope.addsuppler.$setUntouched(); 

        } else{
            $scope.suplier_err = $scope.suplier_err ? false : true;
            $scope.err = "Stock insertion failed! Try again.";
        }
    });
};

Codeigniter控制器： -

public function insert_stock（）{

    $request = json_decode(file_get_contents('php://input'), TRUE);
    print_r($request);
}

enter image description here

我的结果:-(所有记录值不是POST）

enter image description here

Answer 1

表格数据发布时遇到了同样的问题。

我可以通过在http请求中设置headers: { 'Content-Type': undefined }和transformRequest: angular.identity来解析它。

下面是我的示例代码。

  function Upload(containerName, objFile, objParams) {
        var deferred = $q.defer();

        var frmData = new FormData();
        frmData.append('file', objFile);

        var req = {
            method: 'POST',
            url: window.APIBaseUrl + 'containers/' + containerName + '/upload',
            data: frmData,
            params: objParams,
            headers: { 'Content-Type': undefined },
            transformRequest: angular.identity,
            dataType: "json"
        }

        $http(req).then(function (response) {
            deferred.resolve(response.data);
        }, function (err) {
            deferred.reject(handleHttpError(err));
            $log.error("Error in upload", err);
        });

        return deferred.promise;
    }

Answer 2

这可能会帮助你

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="myCtrl">


<div class="col-sm-6" style="width:50%;">
<div class="card-box">
    <form class="form-inline" name="addstock"
        ng-submit="saveStockPurchaseInvoice()">

        <h3 class="m-t-0 m-b-30 header-title text-center">Invoice
            Details</h3>
        <div class="row" style="margin-bottom: 20px;">

            <div class="form-group col-md-3" style="">
                <select name="supplier" ng-model="productStock.suppliername"
                    class="form-control" required="">
                    <option value="">Select a Supplier</option>
                    <option ng-repeat="allsupplier in supplier"
                        value="{{allsupplier.supplier_id}}">
                        {{allsupplier.supplier_name}}</option>
                </select> <br> <span style="color: red"
                    ng-show="addstock.supplier.$touched && addstock.supplier.$invalid">Supplier
                    is Required.</span>
            </div>

            <div class="form-group col-md-3">

                <input type="text" class="form-control"
                    ng-model="productStock.invoice" id="invoice" name="invoice"
                    placeholder="Enter Invoice Number" required> <br> <span
                    style="color: red"
                    ng-show="addstock.invoice.$touched && addstock.invoice.$invalid">Enter
                    Invoice Number.</span>
            </div>


            <div class="form-group col-md-3">

                <input type="date" name="productdate" id="productdate"
                    ng-model="productStock.productdate" class="form-control"
                    required=""> <br> <span style="color: red"
                    ng-show="addstock.productdate.$touched && addstock.productdate.$invalid">Date
                    is Required.</span>
            </div>

        </div>


        <h3 class="m-t-0 m-b-30 header-title text-center">ITEMS</h3>


        <div ng-repeat="item in productStocks track by $index"
            style="margin-bottom: 10px;">

            <div class="form-group">
                <!--<input type="text" name="product_name" ng-model="productsStock.product_name"  required="" placeholder="Product Name" class="form-control" id="product_name">-->

                <select name="productStock_name"
                    ng-model="productStock.items[$index].productStock" class="form-control"
                    required="">
                    <option value="">Select a Product</option>
                    <option ng-repeat="products in allproducts"
                        value="{{products.product_id}}">
                        {{products.product_name}}</option>
                </select> <br> <span style="color: red"
                    ng-show="addstock.productStock_name.$touched && addstock.productStock_name.$invalid">Product
                    Name Required.</span>
            </div>


            <div class="form-group">
                <input id="productstock_qty" type="number" min="1" required=""
                    name="productstock_qty" ng-model="productStock.items[$index].productstock_qty"
                    placeholder="Product Quantity" class="form-control"> <br>
                <span style="color: red"
                    ng-show="addstock.productstock_qty.$touched && addstock.productstock_qty.$invalid">Product
                    Quantity required.</span>
            </div>


            <div class="form-group">
                <input id="productstock_price" type="number" min="1"
                    ng-model="productStock.items[$index].productstock_price"
                    name="productstock_price" placeholder="Product Price"
                    class="form-control" maxlength="15" size="10" required="">
                <br> <span style="color: red"
                    ng-show="addstock.productstock_price.$touched && addstock.productstock_price.$invalid">Price
                    required.</span>
            </div>

            <div class="form-group">
                <select name="product_units"
                    ng-model="productStock.items[$index].productstock_units" class="form-control"
                    required="">
                    <option value="">Select Units</option>
                    <option ng-repeat="units in allunits" value="{{units.unit_id}}">
                        {{units.unit_name}}</option>
                </select> <br> <span style="color: red"
                    ng-show="addstock.product_units.$touched && addstock.product_units.$invalid">Units
                    is required.</span>


            </div>


            <div class="form-group">
                <input id="productstock_cgst" type="text"
                    ng-model="productStock.items[$index].productstock_cgst" name="productstock_cgst"
                    placeholder="CGST" class="form-control" maxlength="10" size="6"
                    required=""> <br> <span style="color: red"
                    ng-show="addstock.productstock_cgst.$touched && addstock.productstock_cgst.$invalid">required.</span>
            </div>



            <div class="form-group">
                <input id="productstock_sgst" type="text"
                    ng-model="productStock.items[$index].productstock_sgst" name="productstock_sgst"
                    placeholder="SGST" class="form-control" maxlength="10" size="6"
                    required=""> <br> <span style="color: red"
                    ng-show="addstock.productstock_sgst.$touched && addstock.productstock_sgst.$invalid">required.</span>
            </div>


            <!--<div class="form-group">-->
            <!--    <input id="productstock_gst" type="text"  ng-model="productStock.productstock_gst" ng-keydown="keydownevt()"  name="productstock_gst" placeholder="GST"  class="form-control"  maxlength="10" size="6" required="">-->
            <!--    <br>-->
            <!--    <span style="color:red" ng-show="addstock.productstock_gst.$touched && addstock.productstock_gst.$invalid">required.</span>     -->
            <!--</div>-->


            <div class="form-group">
                <input id="productstock_total" type="text"
                    ng-model="productStock.items[$index].productstock_total"
                    name="productstock_total" placeholder="Total" class="form-control"
                    required=""> <br> <span style="color: red"
                    ng-show="addstock.productstock_total.$touched && addstock.productstock_total.$invalid">Total
                    is required</span>
            </div>

            <button class="btn btn-danger btn-sm" ng-show="$last"
                ng-click="removeStock()">
                <span class="glyphicon glyphicon-remove"></span>
            </button>
        </div>
        <!-- ng-repeat close for add dynamic product field-->


        <div class="form-group text-right m-b-0">

            <button class="addfields btn btn-info waves-effect waves-light"
                ng-click="addstockproduct()">Add Stock</button>
        </div>

        <div class="form-group text-right m-b-0 pull-right"
            style="margin-top: 10px;">

            <button type="submit" ng-click="" class="btn btn-primary">Save</button>
            <button type="reset" class="btn btn-warning">Reset</button>
        </div>


    </form>
</div>


</div>


<div style="width:50%">
<pre>{{productStock | json}}</pre>
</div>


</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope,$http) {

$scope.productStocks = [{id: 'firstField2'}];

$scope.supplier = [{supplier_id:1, supplier_name:'abc'}];
$scope.allproducts = [{ product_name:'qwerty',product_id:1 }];
$scope.allunits = [{ unit_id:1,unit_name:'iop'}];


$scope.addstockproduct = function(){

    var newItemNo2 = $scope.productStocks.length+1;
    $scope.productStocks.push({'id':'field'+newItemNo2});
}
$scope.removeStock = function() {

    var itemLast2 = $scope.productStocks.length-1;
    $scope.productStocks.splice(itemLast2);
};
$scope.productStock={};
$scope.suplier_succ = false;
$scope.suplier_err = false;

$scope.saveStockPurchaseInvoice=function(){
   $http({
        method: 'POST',
        url: 'http://abcd/insert', //change to your url 
        data: JSON.stringify($scope.productStock),
        //headers: {'Content-Type': 'application/x-www-form-urlencoded'}
        headers: { 'Content-Type': undefined },
        transformRequest: angular.identity,
            dataType: "json"
    //  'Content-Type':'application/json'
    }).then(function (response)
    {
        if (data == 1) {
            $scope.suplier_succ = $scope.suplier_succ ? false : true;
            $scope.succ = "Stock added successfully";
            $timeout(function () {
                $(".modal").modal("hide");
            }, 3000);

            //  $scope.formsup = {}; // clears input fields
            // $scope.addsuppler.$setPristine(); 
            // $scope.addsuppler.$setUntouched(); 

        } else{
            $scope.suplier_err = $scope.suplier_err ? false : true;
            $scope.err = "Stock insertion failed! Try again.";
        }
    });
};
//$request = json_decode(file_get_contents('php://input'), TRUE);
//    print_r($request);


});
</script>

</body>
</html>

angularjs表单数据没有正确发布。

2 个答案: