Question

我有这个表格

    <form action="send.php" method="post">
          <div class="col-md-12">
            <div class="input-group input-group-lg">
              <span class="input-group-addon" id="sizing-addon1"><i class="fa fa-credit-card"></i></span>

             <input id="nfc" name="nfc" type="text" required class="form-control" placeholder="Wristband UID will appear here...." aria-describedby="sizing-addon1">
             </div>

<br>
              <div class="input-group input-group-lg">
                  <span class="input-group-addon" id="sizing-addon1"><i class="fa fa-phone"></i></span>
                   <input id="phone" name="phone" type="text" value="254" required class="form-control" placeholder="Registered Phone Number" aria-describedby="sizing-addon1">
             </div>  

<br>
          <button type="submit" class="btn btn-color btn-lg">OK, Im Done</button>
</div>
            <div id="alert"></div>
</form>

我想通过这个php脚本处理输入：

<?php 
$nfc = $_POST["nfc"];
$phone = $_POST["phone"];


$post = [
'nfc' => $nfc,
//'password' => '9907',
'phone' => $phone,

];

header( "Content-Type: application/json" );

$ch = curl_init('myAPIUrl');//posts input to my api and i get a response

curl_setopt($ch, CURLOPT_POSTFIELDS, $post);


curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);

$server_output = curl_exec ($ch);

curl_close ($ch);

header( "refresh:1400;url=http://www.swype.co.ke/counter/index.html" );

var_dump($server_output);
?>

并在同一页面的div id“ALERT”中显示表单响应。我的API URL是一个api，其参数是输入字段。我得到了如下所示的api响应。

string(121) "{"idUser":42,"rfid":"4534543","username":"","transactionStatus":"NFC tag has been updated successfully","statusCode":200}"

Answer 1

为了通过PHP处理输入，您需要将表单数据发送到服务器。为了显示来自服务器响应的警报，您需要提交表单（从而刷新页面）或使用AJAX提交表单数据并等待响应。

现在你正在使用PHP做一些你可能用AJAX做的事情。尝试这样的事情：

angular.module('plunker', []);

function MainCtrl($scope, menuSvc) {
  // main controller sets the menu contents to the service
  menuSvc.putAll([{t:"item1"},{t:"item2"}]);
}


// a very simple menu service that keeps an object of menu items
angular.module('plunker').factory("menuSvc", [ function( ) {
    var items;

    var clear = function(){
        items = {};
    };

    var getAll = function(){
        return Object.keys(items);
    };

    var put = function( item ){
        items[item.t] = item;
    };

    var putAll = function( itemArray, dontClean ){
        if( !dontClean ){
            clear();
        }
        itemArray.forEach(
            function(i){
                put(i);
            }
        );
    };

    clear();
    return {
        put: put,
        getAll: getAll,
        putAll: putAll,
        clear: clear
    };
}]);


// directive that gets its content from the service
angular.module('plunker').directive('menu', function(){

  return {
    restrict: 'E',
    scope: {
    },

    templateUrl: 'menu.html',

    controller: function($scope, menuSvc) {
        $scope.menu = menuSvc.getAll();
    },

    replace: true
  };
});

如何在没有用ajax刷新的情况下在我的页面上显示我的php响应？

1 个答案: