如何通过Ajax将具有表单值的js对象数组发送到电子邮件

时间:2017-08-26 18:13:03

标签: javascript php jquery html ajax

我有输入和js对象数组的html表单。对象数组与数组无关。它们是独立的单位。

HTML:

    <form id="form-order">
      First name:<br>
      <input type="text" name="firstname">
      <input type="tel" name="phonenumber" >
      <input type="submit" value="Submit">
    </form> 

JS

$.ajax({
   type: "POST",
   data: {mydata: JSON.stringify(MyObjects)}, 
   url: "index.php",
   success: function(data){
   }
});
    var array = [{count:1,image:"images/1.jpg",name:"Bouquet 1",price:49},{count:5,image:"images/1.jpg",name:"Bouquet 9",price:77}];
            $("#form-order").submit(function() {

                        var order_data = cart;
                        $.ajax({
                        type: "POST", 
                        url: "../order.php", 
                        data: {form: form_data, 
                        order:JSON.stringify(order_data)},
                        success: function() {                         
                        console.log('OK');
                        });
                });

PHP

$to = "mail@mail.ru";
    $message = '
            <html>
                <head> 
                </head>
                <body>
                   <p>Name: '.$_POST['first name'].'</p>
                   <p>Phone: '.$_POST['phone number'].'</p>
                   $someArray;
                   foreach ($extradata as $key => $value) {
                   $someArray .= "<p>".$value["image"] . ", " . 
                   $value["name"] . "</p>";
                  </body>
            </html>';

请您检查一下这段代码是否合理?

1 个答案:

答案 0 :(得分:1)

     <form id="formoid" action="" method="post">
                <input type="text" id="firstname" name="firstname" >
                <input type="text" id="lphonenumber" name="lphonenumber" >
                <input type="submit" id="submitButton"  name="submitButton" value="Submit">
     </form>
you could do something like this

    <script type='text/javascript'>
        /* attach a submit handler to the form */
        $("#formoid").submit(function(event) {

        var array = [{count:1,image:"images/1.jpg",name:"Bouquet 1",price:49},{count:5,image:"images/1.jpg",name:"Bouquet 9",price:77}];
          /* stop form from submitting normally */
          event.preventDefault();

          /* get the action attribute from the <form action=""> element */
          var $form = $( this ),
              url = $form.attr( 'action' );

          /* Send the data using post with element id firstname, lphonenumber along with your array*/
          var posting = $.post( url, { name: $('#firstname').val(), name2: $('#lphonenumber').val(),extradata: array } );

          /* Alerts the results */
          posting.done(function( data ) {
            alert('success');
          });
        });
    </script>

and in php you could do something like,

    <?php
    if(isset($_POST['name'])){
    // To send HTML mail, the Content-type header must be set
    $headers  = 'MIME-Version: 1.0' . "\r\n";
    $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
    // Convert JSON string to Array
    $extradata = json_decode($_POST['extradata'], true);
   // print_r($someArray);        // Dump all data of the Array
   // Loop through Array if necessary
  $someArray;
  foreach ($extradata as $key => $value) {
    $someArray .= "<p>".$value["image"] . ", " . $value["name"] . "</p>";
  }

    $to = "mail@mail.ru";
        $message = '
                <html>
                    <head> 
                    </head>
                    <body>
                       <p>Name: '.$_POST['first name'].'</p>
                       <p>Phone: '.$_POST['phone number'].'</p>'.$someArray.'
                      </body>
                </html>';
    $subject = "Wooo Email!";
    mail($to, $subject, $message, "From: system@yourdomain.com\r\n", $headers);
    } else {
      echo "error";
    }?>

or you could use phpmailer or swift mailer for the same