-1

フォーム データを MySQL データベースに送信することを最終目標として、最初の Ajax を利用したフォーム (ここ) を作成しました。私は PHP と Javascript の経験がほとんどないため、JQuery Formwizard を私の選択の道として採用しました。このフォームはうまく機能しますが、'process.php' スクリプトを作成するのに役立つリソースを見つけることができませんでした。

デフォルトでは、フォームは現在、送信時に表示される item1=foo&item2=bar... のような文字列を返します。以下の JS と process.php ファイルの要旨を添付しましたが、この 2 つがどのように結びついているのかわかりません。送信ボタンは、スクリプトにまったく向けられていないようです。フォームはちょっと長いですが、シンプルなので、一部だけ含めました。どうもありがとう、

マイク

HTML (スニペット)

<form action="path/to/process-form.php" method="POST" id="demoForm" class="bbq">

                <div id="fieldWrapper">

                    <span class="step" id="first">

                        <span class="font_normal_07em_black">Manufacturer Information</span><br />

                        <p class="section-desc">
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. In non est est. Quisque sit amet tellus nulla, 
                        eget molestie velit. Morbi dapibus ornare purus eget ultrices. In et massa ac diam vulputate auctor. 
                        Curabitur ut velit nisi, vel suscipit ligula. Donec non tellus id mauris ornare laoreet sed quis massa. 
                        </p>

                        <br />

                        <div class="clear-line"></div>

                        <br />

                        <label for="manu_name">Manufacturer</label><br />
                        <input class="input_field_12em" name="manu_name" id="manu_name" /><br />

                        <label for="manu_web">Website</label><br />
                        <input class="input_field_12em" name="manu_web" id="manu_web" value="http://" /><br />

                        <label for="manu_email">Email</label><br />
                        <input class="input_field_12em" name="manu_email" id="manu_email" /><br />

                        <label for="manu_phone">Phone</label><br />
                        <input class="input_field_12em" name="manu_phone" id="manu_phone" />
                        <label for="manu_phone_ext">ext</label>
                        <input class="input_field_12em" name="manu_phone_ext" id="manu_phone_ext" /><br />

                        <label for="manu_info">Additional Info</label><br />
                        <textarea class="input_field_12em" name="manu_info" id="manu_info"></textarea><br />

                    </span>

...続き 

                <div id="demoNavigation">                           
                    <input class="navigation_button" id="back" value="Back" type="reset" />
                    <input class="navigation_button" id="next" value="Next" type="submit" />
                </div>

</form>

JS

$(function(){
                        $("#demoForm").formwizard({ 
                            formPluginEnabled: true,
                            validationEnabled: true,
                            focusFirstInput : true,
                            formOptions :{
                                        type:'POST',
                                success: function(data){$("#status").fadeTo(5000,1,function(){ $(this).html("Product successfully submitted!").fadeTo(5000, 0); })},
                                beforeSubmit: function(data){$("#data").html("data sent to the server: " + $.param(data));},
                                dataType: 'json',
                                resetForm: true
                            },
                            validationOptions : {
                                rules: {

                                <!-- Manufacturer validation -->

                                    manu_name: "required",
                                    manu_email: {
                                        email: true
                                    },

                                },
                                messages: {
                                    required: "This field is required.",
                                    email: "Please enter a valid email address."
                                }
                                }
                            });
                        });

PHP (プロセスフォーム.php)

<?php

include('dbconnect.php');

/* manufacturer */

$manu_name  = $_POST['manu_name'];
$manu_web   = $_POST['manu_web'];
$manu_email     = $_POST['manu_email'];
$manu_phone     = $_POST['manu_phone'];
$manu_phone_ext = $_POST['manu_phone_ext'];
$manu_info  = $_POST['manu_info'];

$manu_name  = mysqli_real_escape_string($manu_name);
$manu_web   = mysqli_real_escape_string($manu_web);
$manu_email     = mysqli_real_escape_string($manu_email);
$manu_phone     = mysqli_real_escape_string($manu_phone);
$manu_phone_ext = mysqli_real_escape_string($manu_phone_ext);
$manu_info  = mysqli_real_escape_string($manu_info);

$query = "INSERT INTO pd_products
        (manu_name,manu_web,manu_email,manu_phone,manu_phone_ext,manu_info) 
         VALUES ('$manu_name','$manu_web','$manu_email','$manu_phone','$manu_phone_ext','$manu_info')";

if (!mysqli_query($query,$con))
  {
  die('Error: ' . mysqli_error());
  }
mysqli_close($con)

?>
4

1 に答える 1

1

HTML の "form action="path/to/process-form.php"" を、フォームが配置されている実際のパスに変更してください。

mysqli_query($query,$con) はリンク付きの mysqli_query($con,$query) である必要があり、クエリを実行します。また、なぜ mysql_query($query,$con) を使用しないのでしょうか?

簡単なことをするのに不要なコードをたくさん使っているようです。

HTML と PHP を .php ファイルに配置し (PHP が中かっこで囲まれていることを確認してください)、フォーム アクションを独自の名前に変更し (それ自体に送信するため)、javascript を削除します。

PHP フォームの検証については、こちらをご覧ください: http://php.net/manual/en/filter.filters.validate.php

于 2012-04-11T22:59:02.873 に答える