使用jquery / ajax创建PHP表单

时间:2014-06-10 14:04:41

标签: php jquery ajax

我想创建两个报告并使用类中的两个函数将报告数据提交到数据库:这里我有两个提交按钮:"创建ES报告"和"创建RP报告"。

(1)当我点击"创建ES报告"时,create_es_report表单应该显示并能够填充数据并成功提交到数据库,如果错误,它应该在同一个div上显示错误。

(2)当我点击"创建RP报告"时,create_rp_report表单应该显示并能够填充数据并成功提交到dataabase,如果错误,它应该在同一个div上显示错误。

Rightnow,当我点击任何提交按钮时,没有显示任何内容

的index.php

<html>
 <head>      
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  <script type="text/javascript">

   $(document).ready(function(){ 

      $('#es').click(function () 
      {
         create();
      });      

   });

function create(){

     $.ajax({  
      url: "check.php?proc=create",
      type: "POST",  
      dataType:'json',
      success: function(data)
      {  
             $('#returnMessage').show();
             $('#returnMessage').html(data.mes);
      }


   });  

return false;
}    

  </script>

 </head>

 <body>

<div class="container2">        
  <div style="float:left;margin:0px 0px;padding:7px;"><input type="submit" value="Create ES Report" id="es"></div>
  <div id="returnMessage" style="display:none;"></div>        
</div>   
 </body>
</html>

check.php

<?php
 require 'includes/config.inc.php';
 require 'classes/class.report.php';
 $report = new Report($db); 

 if(isset($_GET['proc']) && !empty($_GET['proc']))
 {
    $proc =  $_GET['proc'];
    if($proc == 'create')
    {
       $report->create_es_report();
       $return = array('mes' => 'Created' );
       header('content-type: application/json; charset=utf-8');
       echo json_encode($return);
    }

 }
 else
 {
     $return = array('mes' => 'The $_GET is empty , check if all parms and ajax function passing to the true file, good luck :).' );
     header('content-type: application/json; charset=utf-8');
     echo json_encode($return);
 }

?>

class.report.php

<?php
    class Report
    {
       private $db;

       public function __construct($database){
          $this->db = $database;
       }

       //CREATE DATASOURCE REPORT
       public function create_es_report()
       {
          if (isset($_POST['create_es_report']))
          {      
             $report_name = htmlentities($_POST['report_name']);            
             $from_address = htmlentities($_POST['from_address']); 
             $subject = htmlentities($_POST['subject']); 
             $reply_to = htmlentities($_POST['reply_to']); 


             if (empty($_POST['report_name']) || empty($_POST['from_address']) || empty($_POST['subject']) || empty($_POST['reply_to']))
             {
                $errors[] = '<span class="error">All fields are required.</span>';
             }
             else
             {
                if (isset($_POST['report_name']) && empty($_POST['report_name'])) { $errors[] = '<span class="error">Report Name is required</span>'; }
                else if (!ctype_alnum($_POST['report_name']))
                {  $errors[] = '<span class="error">Report Name: Whitespace is not allowed, only alphabets and numbers are required</span>';  }

                if (isset($_POST['from_address']) && empty($_POST['from_address'])) 
                { $errors[] = '<span class="error">From address is required</span>'; }
                else if (filter_var($_POST['from_address'], FILTER_VALIDATE_EMAIL) === false)
                { $errors[] = '<span class="error">Please enter a valid From address</span>';  }

                if (isset($_POST['subject']) && empty($_POST['subject'])) { $errors[] = '<span class="error">Subject is required</span>'; }
                else if (!ctype_alnum($_POST['subject']))
                {  $errors[] = '<span class="error">Subject: Whitespace is not allowed, only alphabets and numbers are required</span>';  }

                if (isset($_POST['reply_to']) && empty($_POST['reply_to'])) { $errors[] = '<span class="error">Reply To is required</span>'; }
                else if (filter_var($_POST['reply_to'], FILTER_VALIDATE_EMAIL) === false)
                { $errors[] = '<span class="error">Please enter a valid Reply-To address</span>';  }                        
             }

             if (empty($errors) === true)
             {               
                 $query = $this->db->prepare("INSERT INTO report(report_name, from_address, subject, reply_to) VALUES (?, ?, ?, ?) ");

                 $query->bindValue(1, $report_name);                
                 $query->bindValue(2, $from_address);
                 $query->bindValue(3, $subject);         
                 $query->bindValue(4, $reply_to);                 

                 try {
                   $query->execute();            
                 }

                 catch(PDOException $e) {
                    die($e->getMessage());
                 }  
                 header('Location:home.php?success');
                 exit();                 
             }
          } 

          if (isset($_GET['success']) && empty($_GET['success'])) 
          { 
              header('Location:home.php');
              echo '<span class="error">Report is succesfully created</span>';  
          }

          ?>

          <form action="" method="POST" accept-charset="UTF-8">
              <div style="font-weight:bold;padding:17px 80px;text-decoration:underline;">Section A</div>
              <table class="create_report">                           
                <tr><td><label>Report Name</label><span style="color:#A60000">*</span></td>
                    <td><input type="text" name="report_name" required placeholder="Name of the report" value="<?php if(isset($_POST["report_name"])) echo $report_name; ?>" size="30" maxlength="30">             
                </td></tr>              

                  <tr><td><label>From</label><span style="color:#A60000">*</span></td>
                      <td><input type="text" name="from_address" required placeholder="From address" value="<?php if(isset($_POST["from_address"])) echo $from_address; ?>" size="30">             
                  </td></tr>

                  <tr><td><label>Subject</label><span style="color:#A60000">*</span></td>
                      <td><input type="text" name="subject" required placeholder="Subject" value="<?php if(isset($_POST["subject"])) echo $subject; ?>" size="30">             
                  </td></tr>

                  <tr><td><label>Reply To</label><span style="color:#A60000">*</span></td>
                      <td><input type="text" name="reply_to" required placeholder="Reply address" value="<?php if(isset($_POST["reply_to"])) echo $reply_to; ?>" size="30">            
                  </td></tr>

               <tr><td><input type="submit" value="create report" style="background:#8AC007;color:#080808;padding:6px;" name="create_es_report"></td></tr> 
             </table>                       
          </form>

          <?php
            //IF THERE ARE ERRORS, THEY WOULD BE DISPLAY HERE
            if (empty($errors) === false) {
               echo '<div>' . implode('</p><p>', $errors) . '</div>';
            }                  
      }   

   }//Report CLASS ENDS   

2 个答案:

答案 0 :(得分:-1)

我的猜测是你的PHP失败并且成功选项没有触发。

我建议在你的成功选项中添加一个data.res的控制台写入,并添加一个错误选项并添加一个完整的选项,它会写一些与控制台不同的内容,这样你就可以确定jquery是否失败或者php是否失败。

作为旁注,我将create_es和create_rp函数组合为1,因为它们是相同的,除了在ajax中传递的查询字符串值。然后,您将在点击事件中调用create_report(&#34; es&#34;)和create_report(&#34; rp&#34;),并且您的ajax网址将为"check.php?proc=" + report,,其中report是您的函数参数。< / p>

答案 1 :(得分:-1)

您似乎也不知道如何处理PHP和AJAX。

首先更改网址E.G:

   url: "check.php?proc=create_es",

   url: "check.php?proc=create",

看看GET的check.php是如何工作的。

type: "POST",更改为type: "GET",

现在要回复错误,只需调用php函数就会更复杂。

要返回错误,您将从create_es_report错误返回到check.php文件并将json格式返回到您的html页面,这就是为什么我说首先学习ajax。

也不要使用htmlentities我建议您使用HTMLPURIFER来补充来自恶意输入的输入。