POST http://localhost:4400/api.php 404 (Not Found) angularjs

Question

html code

<form>
                <div class="list">
                    <div class="list list-inset" >
                        <label class="item item-input"  id="descriptions">
                            <input type="text" height:"90" class="description" placeholder="Description ..." ng-model="data.describe" required>
                        </label>
                        <label input="email" class="item item-input" id="email" ng-model="data.email" required >
                            <span class="input-label">Email</span>
                            <input type="email">
                        </label>
                        <label class="item item-input">
                            <span class="input-label">Date</span>
                            <input type="date">
                        </label>
                    </div>
                    <button class="button button-block button-balanced" type="submit" ng-click="AddItem(); submitForm()">
                        Add Item
                    </button>
                    <button class="button button-block button-assertive" ng-click="closeModal()"> cancel</button>

                </div>
            </form>

app.js

  $scope.data = {
        description: "default",
        email: "default",
        date: "default",

    };

    $scope.submitForm = function() {
        console.log("posting data....");
        $http.post('http://localhost:4400/api.php', JSON.stringify($scope.data)).success(function () {/*success callback*/ });
    };

api.php

<?php 

   $name=$_POST['descriptions']; 
    $email=$_POST['email']; 
    $message=$_POST['date'];

    if (($descriptions =="")||($email=="")||($date=="")) 
        { 
        echo "All fields are required, please fill <a href=\"\">the form</a> again."; 
        } 
    else{         
        $from="From: $descriptions<$email>\r\nReturn-path: $email"; 
        $subject="Message sent using your contact form" + $date; 
        mail("testing@gmail.com", $subject, $message, $from); 
        echo "Email sent!"; 
        } 

?>

I am trying to send contents of a form to an email address provided. The problem is when I try and do this, I get an error: POST http://localhost:4400/api.php 404 (Not Found). I have looked on other posts and cannot resolve this issue thank you.

enter image description here

Answer 1

use http://localhost:4400/api.php instead of api.php at your code and change submit like this

<form action="api.php" method="post" id="myform" name="myform">    

and

<button onclick="document.getElementById("myform").submit()">SUBMIT</button>

Answer 2

You can link your php file with a relative url. If your file api.php is in app/ , you can write in your app.js :

$scope.submitForm = function() {
   $http.post('api.php', JSON.stringify($scope.data), {
       headers: {
         'Content-Type': 'application/x-www-form-urlencoded'
       }
   });
};

In api.php :

   $descriptions = $_POST['descriptions']; 
   $email = $_POST['email']; 
   $date = $_POST['date'];