在提交整个表单之前,我可以将单个表单值提交到数据库中吗?

时间:2014-09-14 15:05:53

标签: javascript php jquery html forms

我想要实现的目标,使用jQuery,PHP,JS或任何可以处理表单和PUT到数据库的东西,是能够使用fieldsets样式化一个非常长的表单并将每个值传递到数据库中在最后提交整个表格之前存储。

我希望这能实现的是,如果用户想要回来并稍后填写更多内容,请跳过问题等等。他们可以这样做,并以任何方式存储他们的信息。

这是代码块的样子(这是3组128):

<form id="myForm">
<fieldset>
<label>First Name:</label>
<input data-progression type="text" data-helper="This one is easy!" name="fname" value="" placeholder="$fname"><br>
<div class="note"><p>NOTE: Cras mattis consectetur purus sit amet fermentum. Vestibulum id ligula porta felis euismod semper.Cras mattis consectetur purus sit amet fermentum. Vestibulum id ligula porta felis euismod semper.</p></div>
<div class="bottomFormNav"><span class="left">Next</span></div>
</fieldset>

<fieldset>
<label>Last Name:</label>
<input data-progression type="text" data-helper="Help users through forms by providing helpful hinters" name="lname" value="" placeholder="$lname"><br>
<div class="note">Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Nullam quis risus eget urna mollis ornare vel eu leo. Donec ullamcorper nulla non metus auctor fringilla.</div>
<div class="bottomFormNav"><span class="right">Back</span><span class="left">Next</span></div>
</fieldset>

<fieldset>
<label>Address:</label>
<input data-progression type="text" data-helper="Help users through forms by providing helpful hinters" name="address" value="" placeholder="$address"><br>
<div class="bottomFormNav"><span class="right">Back</span><span class="left">Next</span></div>
</fieldset>
</form>

每个字段都单独填写,用户点击“下一个”,将该字段设置在视图之外并引入下一个字段。我可以做一些我可以在用户点击下一个按钮时发布到数据库的东西,然后每个表单的占位符''将是$ fname或$ ssn或者变量在数据库中的任何一个。这样,如果未填写,则该值将返回空白,并且似乎需要填写。

感谢您的任何建议和帮助;我愿意接受重组或任何事情来使这项功能发挥作用。

1 个答案:

答案 0 :(得分:0)

你可以使用jquery的$.post函数。

这样的事情:

$('#nextButton').on('click', function() {
    $('#load').show() //a div overlay with an ajax loading image...
    $.post('link-top-php-script.php', {
        firstName: $('#fname').val(), //give the fname field also the id fname
        lastName: $('#lname').val() //give the lname field also the id lname
        //more fields here
    }, function(data) {
        //after post is successfull
        $('#load').hide(); //hide loading overlay
        //your code for next page here
    }
});