Php 如何使用ajax将动态创建的表单输入存储到数据库_Php_Jquery_Mysql

Php 如何使用ajax将动态创建的表单输入存储到数据库

php jquery mysql

Php 如何使用ajax将动态创建的表单输入存储到数据库,php,jquery,mysql,Php,Jquery,Mysql,我问了一个类似的问题，但答案并没有真正帮助我解决问题或想出解决办法我让我的JS脚本上传一个文件（使用PHP作为其回调），然后从upload.PHP获取数据，并使用下面的JS代码片段重新格式化，以向用户显示输入当数据呈现给用户时，例如： input type="text" class="r" name="scene" value="1" /> <input type="text" class="r" name="int_ext" value="INT" /> <inpu

我问了一个类似的问题，但答案并没有真正帮助我解决问题或想出解决办法

我让我的JS脚本上传一个文件（使用PHP作为其回调），然后从upload.PHP获取数据，并使用下面的JS代码片段重新格式化，以向用户显示输入

当数据呈现给用户时，例如：

input type="text" class="r" name="scene" value="1" />
<input type="text" class="r" name="int_ext" value="INT" />
<input type="text" class="r" name="scene_desc" value="Bedroom" />
<input type="text" class="r" name="day_night" value="DAY" />

<input type="text" class="r" name="scene" value="2" />
<input type="text" class="r" name="int_ext" value="EXT" />
<input type="text" class="r" name="scene_desc" value="Outside" />
<input type="text" class="r" name="day_night" value="DAY" />

<input type="text" class="r" name="scene" value="3" />
<input type="text" class="r" name="int_ext" value="INT" />
<input type="text" class="r" name="scene_desc" value="Bedroom" />
<input type="text" class="r" name="day_night" value="DAY" />

<input type="text" class="r" name="scene" value="4" />
<input type="text" class="r" name="int_ext" value="EXT" />
<input type="text" class="r" name="scene_desc" value="Bedroom" />
<input type="text" class="r" name="day_night" value="NIGHT" />

...

在任何人指出之前，在我的代码中，我在将输入插入数据库之前过滤和清理输入

我的问题是我没有足够的创造力将每个场景的信息像我想象的那样插入数据库

在我的PHP代码中，我呼应出以下行：

if(!$word)
    return NULL;

if(preg_match_all($pattern, $contents, $matches))
{
    foreach($matches as $match) {
        $list = "<li><div class='int'>".implode("</div></li><li><div class='int'>", $match)."</div></li>\n";
    }
}else{
    $list = "No matches found";
}

if（！$word）
返回NULL；
if（preg_match_all（$pattern、$contents、$matches））
{
foreach（$matches作为$match进行匹配）{
$list=“”。内爆（
，$match）。“\n”；
}
}否则{
$list=“未找到匹配项”；
}

在我的JS代码中，我将行拆分为4个输入：

$int.html(function(i, html) {
    return html.replace(/(\d+)(.+)/,function(str,s1,s2){
        var text = s2.split('.');
        var text2 = text[1].split('-');
        var text3 = text2[1].split(' ');
        return '<input class="r" name="scene" value="'+ s1.replace(/^\s*/, '').replace(/\s*$/, '') +'" />' +
            '<input class="r" name="int_ext" value="'+ text[0].replace(/^\s*/, '').replace(/\s*$/, '') +'" />' +
            '<input class="r" name="scene_desc" value="'+ text2[0].replace(/^\s*/, '').replace(/\s*$/, '') +'" />' +
            '<input class="r" name="day_night" value="'+ text3[1].replace(/^\s*/, '').replace(/\s*$/, '') +'" />';
    });
});

$int.html（函数（i，html）{
返回html.replace（/（\d+）（.+）/，函数（str，s1，s2）{
var text=s2.split（'.'）；
var text2=text[1]。拆分（'-'）；
var text3=text2[1]。拆分（“”）；
返回“”+
'' +
'' +
'';
});
});

我试图形成一个AJAX请求，将值发送到PHP页面进行处理，我不确定如何获取所需数据并通过AJAX发送（我知道如何执行AJAX请求，但在这种情况下，我不知道如何获取要处理的动态输入数）

有什么提示吗？

jQuery是一种客户端工具，与服务器端数据库功能无关

你基本上是在张贴表格。PHP在服务器中处理表单，而不是jQuery。这是一个PHP问题，不是jQuery问题。

jQuery是一个客户端工具，与服务器端数据库功能无关

你基本上是在张贴表格。PHP在服务器中处理表单，而不是jQuery。这是一个PHP问题，不是jQuery问题。

选项a:

使用标准PHP

HTML代码应为：

<input type="text" class="r" name="scene[]" value="1" />
<input type="text" class="r" name="int_ext[]" value="INT" />
<input type="text" class="r" name="scene_desc[]" value="Bedroom" />
<input type="text" class="r" name="day_night[]" value="DAY" />

<input type="text" class="r" name="scene[]" value="2" />
<input type="text" class="r" name="int_ext[]" value="EXT" />
<input type="text" class="r" name="scene_desc[]" value="Outside" />
<input type="text" class="r" name="day_night[]" value="DAY" />

<input type="text" class="r" name="scene[]" value="3" />
<input type="text" class="r" name="int_ext[]" value="INT" />
<input type="text" class="r" name="scene_desc[]" value="Bedroom" />
<input type="text" class="r" name="day_night[]" value="DAY" />

<input type="text" class="r" name="scene[]" value="4" />
<input type="text" class="r" name="int_ext[]" value="EXT" />
<input type="text" class="r" name="scene_desc[]" value="Bedroom" />
<input type="text" class="r" name="day_night[]" value="NIGHT" />

Javascript:

$("#submitbutton").click(function() {
    var data = {};
    $("input[name=scene]").each(function() {
        data[$(this).val()] = {
            intext: $(this).next("input[name=int_ext]").val(),
            desc: $(this).next("input[name=scene_desc]").val(),
            daynight: $(this).next("input[name=day_night]").val()
        };
    });
    $.post("/submit.php", {data: JSON.stringify(data)}, function(resp) {
        //success
    });
});

PHP:

选项A:

使用标准PHP

HTML代码应为：

<input type="text" class="r" name="scene[]" value="1" />
<input type="text" class="r" name="int_ext[]" value="INT" />
<input type="text" class="r" name="scene_desc[]" value="Bedroom" />
<input type="text" class="r" name="day_night[]" value="DAY" />

<input type="text" class="r" name="scene[]" value="2" />
<input type="text" class="r" name="int_ext[]" value="EXT" />
<input type="text" class="r" name="scene_desc[]" value="Outside" />
<input type="text" class="r" name="day_night[]" value="DAY" />

<input type="text" class="r" name="scene[]" value="3" />
<input type="text" class="r" name="int_ext[]" value="INT" />
<input type="text" class="r" name="scene_desc[]" value="Bedroom" />
<input type="text" class="r" name="day_night[]" value="DAY" />

<input type="text" class="r" name="scene[]" value="4" />
<input type="text" class="r" name="int_ext[]" value="EXT" />
<input type="text" class="r" name="scene_desc[]" value="Bedroom" />
<input type="text" class="r" name="day_night[]" value="NIGHT" />

Javascript:

$("#submitbutton").click(function() {
    var data = {};
    $("input[name=scene]").each(function() {
        data[$(this).val()] = {
            intext: $(this).next("input[name=int_ext]").val(),
            desc: $(this).next("input[name=scene_desc]").val(),
            daynight: $(this).next("input[name=day_night]").val()
        };
    });
    $.post("/submit.php", {data: JSON.stringify(data)}, function(resp) {
        //success
    });
});

PHP:

Diodeus是对的，但您似乎希望jQuery尽可能地帮助您的php

<form>
    <fieldset>
        <legend>group 1</legend>
<input type="text" class="r" name="scene" value="1" />
<input type="text" class="r" name="int_ext" value="INT" />
<input type="text" class="r" name="scene_desc" value="Bedroom" />
<input type="text" class="r" name="day_night" value="DAY" />
        </fieldset>
<fieldset>
        <legend>group 2</legend>
<input type="text" class="r" name="scene" value="2" />
<input type="text" class="r" name="int_ext" value="EXT" />
<input type="text" class="r" name="scene_desc" value="Outside" />
<input type="text" class="r" name="day_night" value="DAY" />
  </fieldset>
<fieldset>
        <legend>group 3</legend>
<input type="text" class="r" name="scene" value="3" />
<input type="text" class="r" name="int_ext" value="INT" />
<input type="text" class="r" name="scene_desc" value="Bedroom" />
<input type="text" class="r" name="day_night" value="DAY" />
  </fieldset>
<fieldset>
        <legend>group 4</legend>
<input type="text" class="r" name="scene" value="4" />
<input type="text" class="r" name="int_ext" value="EXT" />
<input type="text" class="r" name="scene_desc" value="Bedroom" />
<input type="text" class="r" name="day_night" value="NIGHT" />
  </fieldset>
    <input type="button" name="mybutton" value="submit me">
  </form>

Diodeus是对的，但似乎您希望jQuery尽可能地帮助您的php

<form>
    <fieldset>
        <legend>group 1</legend>
<input type="text" class="r" name="scene" value="1" />
<input type="text" class="r" name="int_ext" value="INT" />
<input type="text" class="r" name="scene_desc" value="Bedroom" />
<input type="text" class="r" name="day_night" value="DAY" />
        </fieldset>
<fieldset>
        <legend>group 2</legend>
<input type="text" class="r" name="scene" value="2" />
<input type="text" class="r" name="int_ext" value="EXT" />
<input type="text" class="r" name="scene_desc" value="Outside" />
<input type="text" class="r" name="day_night" value="DAY" />
  </fieldset>
<fieldset>
        <legend>group 3</legend>
<input type="text" class="r" name="scene" value="3" />
<input type="text" class="r" name="int_ext" value="INT" />
<input type="text" class="r" name="scene_desc" value="Bedroom" />
<input type="text" class="r" name="day_night" value="DAY" />
  </fieldset>
<fieldset>
        <legend>group 4</legend>
<input type="text" class="r" name="scene" value="4" />
<input type="text" class="r" name="int_ext" value="EXT" />
<input type="text" class="r" name="scene_desc" value="Bedroom" />
<input type="text" class="r" name="day_night" value="NIGHT" />
  </fieldset>
    <input type="button" name="mybutton" value="submit me">
  </form>

使用scene_desc[]等作为输入名称来传递数组，而不是单个值只是一个想法：我觉得用户将把数据放入100到400个输入框似乎有点奇怪。这可能不是最好的选择。正在发生的事情是，一旦从上传的文件中收集数据，PHP/JS就会一起进行输入，这样，如果PHP在提取文件中的元素时不准确，用户就可以编辑结果。如果一切正常，那么他们可以继续保存导入。使用scene_desc[]等作为输入名称来传递数组，而不是单个值。我只是想：您的用户要将数据放入100到400个输入框中，这似乎有点奇怪。这可能不是最好的选择。正在发生的事情是，一旦从上传的文件中收集数据，PHP/JS就会一起进行输入，这样，如果PHP在提取文件中的元素时不准确，用户就可以编辑结果。如果一切都正确，那么他们可以继续并保存导入。我知道，我需要知道如何在我的案例中使用ajax请求将数据发送到处理块oh PHP代码。我知道，我需要知道如何在我的案例中使用ajax请求将数据发送到处理块oh PHP代码。嗯，是的，这是一条路径，但是，因为我在提交时通过AJAX加载数据，所以“从页面”将刷新到“回发”页面，在提交之前丢失所有当前页面数据。@s2xi可能会在原始问题中提供更多关于数据最初如何加载以及提交后您的要求的详细信息？我认为这是最好的方法，根据你给我们提供的到目前为止的工作…但如果你给我们更多的信息，可能会有更好的方法。在我的提交中，我补充说，我正在使用我提供的js代码从ajax请求加载内容。PHP进行上传和输出工作，JS从PHP获取行并将其拆分为4个输入字段。现在我需要第三步，使用另一个AJAX请求提交表单。嗯，我理解您在这里向我展示的内容；）我可以在这个场景中使用JSON响应。我只需要用PHP进行服务器端处理，然后使用JS将数据发送到PHP，并发送一条成功的感谢消息。@s2xi听起来像你已经得到了它。基本上，JS只是将一个大的JSON包和所有数据发送到PHP进行处理。嗯，是的，这是一条路线，但是，因为我在提交时通过AJAX加载数据，所以“从页面”将刷新到“回发”页面，在提交之前丢失所有当前页面数据。@s2xi可能会在原始问题中提供更多关于数据最初如何加载以及提交后您的要求的详细信息？我认为这是最好的方法，根据你给我们提供的到目前为止的工作…但如果你给我们更多的信息，可能会有更好的方法。在我的提交中，我补充说，我正在使用我提供的js代码从ajax请求加载内容。PHP进行上传和输出工作，JS从PHP获取行并将其拆分为4个输入字段。现在我需要第三步，使用另一个AJAX请求提交表单。嗯，我理解您在这里向我展示的内容；）我可以在这个场景中使用JSON响应。我只需要使用PHP进行服务器端处理

<form>
    <fieldset>
        <legend>group 1</legend>
<input type="text" class="r" name="scene" value="1" />
<input type="text" class="r" name="int_ext" value="INT" />
<input type="text" class="r" name="scene_desc" value="Bedroom" />
<input type="text" class="r" name="day_night" value="DAY" />
        </fieldset>
<fieldset>
        <legend>group 2</legend>
<input type="text" class="r" name="scene" value="2" />
<input type="text" class="r" name="int_ext" value="EXT" />
<input type="text" class="r" name="scene_desc" value="Outside" />
<input type="text" class="r" name="day_night" value="DAY" />
  </fieldset>
<fieldset>
        <legend>group 3</legend>
<input type="text" class="r" name="scene" value="3" />
<input type="text" class="r" name="int_ext" value="INT" />
<input type="text" class="r" name="scene_desc" value="Bedroom" />
<input type="text" class="r" name="day_night" value="DAY" />
  </fieldset>
<fieldset>
        <legend>group 4</legend>
<input type="text" class="r" name="scene" value="4" />
<input type="text" class="r" name="int_ext" value="EXT" />
<input type="text" class="r" name="scene_desc" value="Bedroom" />
<input type="text" class="r" name="day_night" value="NIGHT" />
  </fieldset>
    <input type="button" name="mybutton" value="submit me">
  </form>

$(document).ready(
    function(event){
        $("input :button").click(
            $("fieldset").each(
                function(index, elem){
                    $.post("your Url", $(this).find("input").serializeArray(), function(text,data,xhr){
                    alert("post completed!");
//recommend a 'message' section to your page to append any errors for each 4 pack inserted.  maybe removing all successful fieldset blocks and only leaving errored sections?
                    });
                }
            );

        );
    }
);