Ajax不向PHP发送信息

时间:2017-03-01 02:32:35

标签: php ajax twitter-bootstrap

我有一个表单,通过ajax将用户信息发送到php文件,表单在bootstrap模式上。我试图添加一个额外的字段,以查看它是否更适合目的,但决定在该字段之前摆脱它,表单完美地工作。现在ajax没有向我的php文件发送信息。

FORM:

<?php

  include_once("php_includes/check_login_status.php");
  include_once("php_parsers/functions.php");
   ?>
   <!DOCTYPE html>
      <html>
     <head><meta http-equiv="Content-Type" content="text/html;  charset=gb18030">

   <title> <?php echo $u; ?></title>


   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.3/css/bootstrap.min.css" integrity="sha384-MIwDKRSSImVFAZCVLtU0LMDdON6KVCrZHyVQQj6e8wIEJkW4tvwqXrbMIya1vriY" crossorigin="anonymous">
   <link href="toolkit.css" rel="stylesheet">
   <link href="home.css" rel="stylesheet">



   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>

    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script>

     <script src="js/main.js"></script>
     <script src="js/ajax.js"></script>

      <script src="js/profile_edit.js"></script>

        <script src="js/join.js"></script>
         </head>
         <body>

        <div class="panel-body">
      <h5 class="m-t-0">About <?php 
      if ($isOwner == "yes"){
       echo '<small><a href="#" class="editlink" data-toggle="modal" data-target="#participantModal">Edit</a></small>';

      } ?></h5>
      <ul class="list-unstyled list-spaced">
        <li id="city" class="datainfo">City: <a href="#">
        <?php 
        if($city == ""){

        echo "Needs to be updated";
        } else {
        echo "$city";}
        ?>
        </a>
         <li id="state" class="datainfo">State: <a href="#">
        <?php 
        if($state == ""){

        echo "Needs to be updated";
        } else {
        echo "$state";}
        ?>
        </a>
        <li id="FavoriteSport" class="datainfo">Favorite Sport: <a href="#">
        <?php 
        if($favoriteSport == ""){

        $favoriteSport = "Needs to be updated";
        }
        echo $favoriteSport;
        ?>
        </a>
         <li id="participation" class="datainfo">Has participated in sport above: <a href="#">
        <?php 
        if($participation == ""){

        $participation = "Needs to be updated";
        }
        echo $participation;
        ?>
        </a>


      </ul>
        </div>
         </div>

      <?php include_once("template_pageBottom.php"); ?>

       <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script>
       <script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
         <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>


       <!-- Modal -->
        <div class="modal fade" id="participantModal" tabindex="-1" role="dialog" aria-labelledby="participantModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
         <div class="modal-content">
          <div class="modal-header">
           <button type="button" class="close" data-dismiss="modal" aria-label="Close">
             <span aria-hidden="true">&times;</span>
    </button>
           <h4 class="modal-title" id="participantModalLabel">Updating About</h4>
  </div>
            <div class="modal-body">
          <form id="aboutForm">
           <div class="form-group">
           <label for="updatedCity">City:</label>
           <input type="text" class="form-control" id="updatedCity" aria-describedby="updatedCity" placeholder="<?php if($city == ""){
           $city = "What city are you in?";
            } echo $city;?>">

             </div>
           <div class="form-group">
            <label for="updatedState">State:</label>
              <input type="text" class="form-control" id="updatedState" placeholder="<?php if($state == ""){
            $state = "What state are you in?";
            } echo $state;?>">
             </div>
          <div class="form-group">
           <label for="sportSelect">Which sport do you like?</label>
           <select class="form-control" id="sportSelect">
            <option value="">Select sport</option>
             <option value="Basketball">Basketball</option>
             <option value="Baseball">Baseball</option>

             </select>
             </div>
             <div class="form-group">
            <label for="playedSelect">Have you played this sport before?</label>
           <select class="form-control" id="playedSelect">
               <option value="">Select participation status</option>
               <option value="Yes">Yes</option>
               <option value="No">No</option>

               </select>
               </div>
     <input type="hidden" class="form-control" id="usernameSubmitting"  value="<?php echo $u; ?>">
      <div class="alert alert-success" id="successAlert" role="alert" style="display: none"></div>
       <div class="alert alert-danger" id="updateFail" style="display:none" ></div>
       <div class="alert alert-warning" id="warningAlert" role="alert" style="display: none"></div>
            </form>
           </div>
            <div class="modal-footer">
             <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
             <button type="button" class="btn btn-primary" onClick="about()">Save changes</button>
          </div>
           </div>
         </div>

AJAX:

      function about(){
      var updatedCity = $("#updatedCity").val();
      var updatedState = $("#updatedState").val();
       var x = document.getElementById("playedSelect");
       var playedSelect = x.options[x.selectedIndex].value;
        var p = document.getElementById("sportSelect");
       var sportSelect = p.options[p.selectedIndex].value;
        var usernameSubmitting = $("#usernameSubmitting").val();
           var aboutForm = document.getElementById("aboutForm");
    $.ajax({
     url: "../php_parsers/updateabout_parse.php",
     type: "POST",
     data: { 
    updatedCity: $("#updatedCity").val(),
    updatedState: $("#updatedState").val(),
    sportSelect: $("#sportSelect").val(),
    playedSelect: $("#playedSelect").val(),
    usernameSubmitting: $("#usernameSubmitting").val()

          }
         }).done(function(result) {
          if (result == "success") {
         $("#successAlert").html("Update successful").show();

         } else {
            $("#updateFail").html(result).show();
       }
           })

             $('#participantModal').on('hide.bs.modal', function (e) {
            if(updatedCity != ""){
           $("#city").html('City: <a href="#"> ' + updatedCity + '</a>');
           }
           if(updatedState != ""){
          $("#state").html('State: <a href="#"> ' + updatedState + '</a>');
           }
             if(playedSelect != ""){
           $("#participation").html('Has participated in sport above: <a href="#"> ' + playedSelect + '</a>');
            }
            if(sportSelect != ""){
          $("#FavoriteSport").html('Favorite Sport: <a href="#"> ' + sportSelect + '</a>');
}

        $("#successAlert, #updateFail, #warningAlert").hide();
         aboutForm.reset();

           });
             }

PHP:

<?php
   ini_set('display_errors', 1);
    ini_set('display_startup_errors', 1);
     error_reporting(E_ALL);

        include_once("../php_includes/db_conx.php");
      $city = "";
      $error = "";
      $u = "";
       $state = "";
      $sportSelect = "";
       $playedSelect = "";

     $u = mysqli_real_escape_string($db_conx, $_POST['usernameSubmitting']);

         if(!$_POST['updatedCity'] && !$_POST['updatedState'] && !$_POST['sportSelect'] && !$_POST['playedSelect']){
         $error .= "No information was entered";
         echo $error;

          }else{
           echo "success";

             }
           ?>

我没有收到任何错误消息,我正在使用bootstrap 4.感谢您提供反馈。

0 个答案:

没有答案