Jquery序列化数据

时间:2012-09-13 21:31:51

标签: jquery forms validation post jquery-validate

所以我在这个表单上有几个文本框,下拉菜单和无线电选项。当用户单击提交时,我想保存所有这些信息,以便将其放入数据库中。所以这就是表单的所有输入

<div id="reg2a">
First Name: <br/><input type="text" name="fname" /> <br/>
Last Name: <br/><input type="text" name="lname" /> <br/>
Address: <br/><input type="text" name="address" /> <br/>
City: <br/><input type="text" name="city" /> <br/>
State: <br/><input type="text" name="state" /> <br/>
Zip Code: <br/><input type="text" name="zip" /> <br/>
Phone Number: <br/><input type="text" name="phone" /> <br/>
Fax: <br/><input type="text" name="fax" /> <br/>
Email: <br/><input type="text" name="email" /> <br/>
Ethnicity: <i>Used only for grant reporting purposes</i> <br/><input type="text" name="ethnicity" /> <br/><br/>

Instutional Information Type (select the best option) <br/>
<select name="iitype">
<option value="none">None</option>
<option value="uni">University</option>
<option value="commorg">Community Organization</option>
</select> <br/><br/>

    Number of sessions willing to present:
    <select id="vennum_select" name="vnum">
      <?php for($i=0;$i<=3;$i++) { ?>
        <option value="<?php echo $i ?>"><?php echo $i ?></option>
      <?php } ?><br/>
    </select><br/>
    Number of tables requested:
    <select id="tabnum_select" name="tnum">

      <?php for($i=1;$i<=3;$i++) { ?>
        <option value="<?php echo $i ?>"><?php echo $i ?></option>
      <?php } ?>
    </select><br/><br/>
    Awarding of a door prize during the conference will result in a reduction in the cost of your first table. <br/><br/>
    I am providing a door prize for delivery during the conference of $75 or more
    <select id="prize_select" name="pnum">
        <option value="0">No</option>
        <option value="1">Yes</option>  
    </select><br/>

Prize name: <input type="text" name="prize_name" /><br/>
Description: <input type="text" name="descr" /><br/>
Value: <input type="text" name="retail" /><br/><br/>

Name of Institution: <br/><input type="text" name="institution" /> <br/><br/>

Type (select the best option) <br/>
<select name="type">
<option value="none">None</option>
<option value="k5">K-5</option>
<option value="k8">K-8</option>
<option value="68">6-8</option>
<option value="912">9-12</option>
</select> <br/><br/>

Address: <br/><input type="text" name="address_sch" /> <br/>
City: <br/><input type="text" name="city_sch" /> <br/>
State: <br/><input type="text" name="state_sch" /> <br/>
Zip Code: <br/><input type="text" name="zip_sch" /> <br/>

<form name="frm2sub" id="frm2sub" action="page3.php" method="post">
<input type="submit" name="submit" value="Submit" id="submit" />
</form>
</div>

这是我的jquery函数:

$("#frm2sub").submit( function() {  
    var values = {};
values["fname"] = $("#fname").val();
});

我可以为每个输入框执行此操作,但我想将所有这些数据提供给下一页。那么如何将这个数组放入$ _POST?顺便说一下,我已经尝试过了

var data = $("#reg2a").serialize();

var data = $(document).serialize();

数据最终为空。有任何想法吗?感谢

4 个答案:

答案 0 :(得分:3)

您需要在输入周围放置一个表单,然后为表单提供一个ID并使用jQuery的serialize函数。这将为您提供所有值的URL编码字符串。

答案 1 :(得分:1)

您应该将所有输入元素包装在表单标记中。然后,所有数据都将在page3.php

中的$ _POST变量中提供

像这样:

<form name="frm2sub" id="frm2sub" action="page3.php" method="post">
    <div id="reg2a">
    First Name: <br/><input type="text" name="fname" /> <br/>
    Last Name: <br/><input type="text" name="lname" /> <br/>
    Address: <br/><input type="text" name="address" /> <br/>
    City: <br/><input type="text" name="city" /> <br/>
    State: <br/><input type="text" name="state" /> <br/>
    Zip Code: <br/><input type="text" name="zip" /> <br/>
    Phone Number: <br/><input type="text" name="phone" /> <br/>
    Fax: <br/><input type="text" name="fax" /> <br/>
    Email: <br/><input type="text" name="email" /> <br/>
    Ethnicity: <i>Used only for grant reporting purposes</i> <br/><input type="text" name="ethnicity" /> <br/><br/>

    Instutional Information Type (select the best option) <br/>
    <select name="iitype">
    <option value="none">None</option>
    <option value="uni">University</option>
    <option value="commorg">Community Organization</option>
    </select> <br/><br/>

        Number of sessions willing to present:
        <select id="vennum_select" name="vnum">
          <?php for($i=0;$i<=3;$i++) { ?>
            <option value="<?php echo $i ?>"><?php echo $i ?></option>
          <?php } ?><br/>
        </select><br/>
        Number of tables requested:
        <select id="tabnum_select" name="tnum">

          <?php for($i=1;$i<=3;$i++) { ?>
            <option value="<?php echo $i ?>"><?php echo $i ?></option>
          <?php } ?>
        </select><br/><br/>
        Awarding of a door prize during the conference will result in a reduction in the cost of your first table. <br/><br/>
        I am providing a door prize for delivery during the conference of $75 or more
        <select id="prize_select" name="pnum">
            <option value="0">No</option>
            <option value="1">Yes</option>  
        </select><br/>

    Prize name: <input type="text" name="prize_name" /><br/>
    Description: <input type="text" name="descr" /><br/>
    Value: <input type="text" name="retail" /><br/><br/>

    Name of Institution: <br/><input type="text" name="institution" /> <br/><br/>

    Type (select the best option) <br/>
    <select name="type">
    <option value="none">None</option>
    <option value="k5">K-5</option>
    <option value="k8">K-8</option>
    <option value="68">6-8</option>
    <option value="912">9-12</option>
    </select> <br/><br/>

    Address: <br/><input type="text" name="address_sch" /> <br/>
    City: <br/><input type="text" name="city_sch" /> <br/>
    State: <br/><input type="text" name="state_sch" /> <br/>
    Zip Code: <br/><input type="text" name="zip_sch" /> <br/>


    <input type="submit" name="submit" value="Submit" id="submit" />

    </div>
</form>

答案 2 :(得分:0)

您应该序列化FORM标记的ID。但实际上你并没有使用AJAX来发布表单,所以$ _POST只是通过实际发布数据来实现的。使用

<form action="process.php" method="post">

然后只需提交,$ _POST将保存您的数据......

答案 3 :(得分:0)

您的表单周围没有标签。添加表单标签并序列化。这将采用表单中的所有元素

$('#myform').serialize();