1

jquery / ajaxを使用して、ページを更新せずにフォームを送信しています。

これが私のフォームコードです：

<div id="event_form">
    <form name="event_submit" method="post" action="">
        <label for="what" id="what_label">What is the event?</label>
        <input type="text" name="what" id="what" class="entry_field" />
        <br />
        <label class="error" for="what" id="what_error">This field is required.</label>
        <br />
        <label for="where" id="where_label">Where is the event?</label>
        <input type="text" name="where" id="where" class="entry_field" />
        <br />
        <label class="error" for="where" id="where_error">This field is required.</label>
        <br />
        <label for="when" id="when_label">When is the event?</label>
        <input type="text" name="when" id="when" class="entry_field" />
        <br />
        <label class="error" for="when" id="when_error">This field is required.</label>
        <br />
        <label for="details" id="details_label">Additional details</label>
        <textarea rows="8" cols="30" name="details"></textarea>            
        <br />
        <input type="submit" value="Post Event" name="submit" class="submitButton" title="Click to post event" />
    </form>
</div>

これが私のjquery/ajaxです：

  $(function() {
    $('.error').hide();

    $(".submitButton").click(function() {
      // validate and process form
      // first hide any error messages
      $('.error').hide();

      var what = $("input#what").val();
      if (what == "") {
        $("label#what_error").show();
        $("input#what").focus();
        return false;
      }
      var where = $("input#where").val();
      if (where == "") {
        $("label#where_error").show();
        $("input#where").focus();
        return false;
      }
      var when = $("input#when").val();
      if (when == "") {
        $("label#when_error").show();
        $("input#when").focus();
        return false;
      }

      var dataString = 'what='+ what + '&where=' + where + '&when=' + when;
      //alert (dataString);return false;

      $.ajax({
        type: "POST",
        url: "event_submit.php",
        data: dataString,
        success: function() {
          $('#event_form').html("<div id='message'></div>");
          $('#message').html("<h2>Event Submitted!</h2>");
        }
       });
      return false;
    });
  });

そしてここにphpがあります：

<?php

include "conf.php";

if ((isset($_POST['what'])) && (strlen(trim($_POST['what'])) > 0)) {
    $what = stripslashes(strip_tags($_POST['what']));
} else {$what = 'No description of the event entered.';}
if ((isset($_POST['where'])) && (strlen(trim($_POST['where'])) > 0)) {
    $where = stripslashes(strip_tags($_POST['where']));
} else {$where = 'No location entered for the event.';}
if ((isset($_POST['when'])) && (strlen(trim($_POST['when'])) > 0)) {
    $when = stripslashes(strip_tags($_POST['when']));
} else {$when = 'No time entered for the event.';}
if ((isset($_POST['details'])) && (strlen(trim($_POST['details'])) > 0)) {
    $details = stripslashes(strip_tags($_POST['details']));
}

if(isset($details)){
    mysql_query("INSERT INTO `events` (`school_id`, `what`, `where`, `when`, `details`) VALUES ('$school_id', '$what', '$where', '$when', '$details')") or die(mysql_error());
}
else {
    mysql_query("INSERT INTO `events` (`school_id`, `what`, `where`, `when`) VALUES ('$school_id', '$what', '$where', '$when')") or die(mysql_error());
}

exit;
?>

フォームが表示されているページには、URLに？school=1687などの「$school_id」があります。$ _GETを使用してフォームページでそれを取得できますが、この変数をajax / phpに渡すにはどうすればよいですか？変数としてテーブルに挿入する必要があります。

4

4 に答える 4

1

のようなものはどうですか

<input type="hidden" name="schoolid" value="<?php echo $_GET['school_id']; ?>">

あなたの形で？サニタイズされていない GET パラメータをエコーするのは説明のためだけであることを理解してください。これにより、CSS に対して広く開かれることになります。

于 2012-11-27T00:14:53.383 に答える
0

試す：

//Retrieving $_GET['school_id']  and passing as JSON object
var school_id = <?php echo $_GET['school_id']; ?>
var dataString = { 'what': what, 'where' : where, 'when': when, 'school_id': school_id }
$.ajax({
    type: "POST",
    url: "event_submit.php",
    data: dataString,
    type: json,
    success: function() {
      $('#event_form').html("<div id='message'></div>");
      $('#message').html("<h2>Event Submitted!</h2>");
    }
   });

$_POST['school_id']のようにアクセスできますevent_submit.php。

于 2012-11-27T01:14:49.803 に答える
0

非表示の入力を使用できます。何かのようなもの：

<input type="hidden" id="school_id" value="<?php echo $school_id" />

次に、それをデータ変数に追加します。

var dataString = 'school_id='+$('#school_id').val()+'&what='+ what + '&where=' + where + '&when=' + when;

次に、php ページで取得します。

$school_id = $_POST['school_id'];
于 2012-11-27T00:15:00.120 に答える
0

次のようなフォームに隠しフィールドを追加します

 <input type="hidden" id="school_id" value="<?php echo $_REQUEST['school']; ?>" />

jQueryスクリプトでは、1行のコードですべてのフォーム要素の値を簡単に取得できます

var dataString = $('#form-id-here').serialize();

次に、ajaxを介して送信します

$.ajax({
    type: "POST",
    url: "event_submit.php",
    data: dataString,
    success: function() {
      $('#event_form').html("<div id='message'></div>");
      $('#message').html("<h2>Event Submitted!</h2>");
    }
   });

最後に、mysql 挿入クエリを次のように変更します。

   mysql_query("INSERT INTO `events` (`school_id`, `what`, `where`, `when`, `details`) VALUES ('".$_POST['school_id']."', '$what', '$where', '$when', '$details')") or die(mysql_error());

これで、必要なものはすべて揃ったと思います。楽しみ ：）

于 2012-11-27T05:28:56.220 に答える