遍历DIV元素并获取动态添加的文本输入-PHP

时间:2019-03-13 04:22:13

标签: javascript php html arrays

我在网页上有一个表格,该表格允许将带有文本输入的动态div(通过JavaScript)动态添加到称为“ actorsDivHTML”的div中。因此结构如下:

<div name="actorsDivHTML">

    <div name="actor[]">
        <input type="text" name="actorName[]">
        <div name="actorInfoDiv[]">
            <input type="text" name="actorInfo[]">
            <input type="text" name="actorInfo[]">
        </div>
    </div>

    <div name="actor[]">
        <input type="text" name="actorName[]">
        <div name="actorInfoDiv[]">
            <input type="text" name="actorInfo[]">
        </div>
    </div>

</div> 

注意:我不确定是否允许以与输入->即相同的方式使用div。 “ div []”

我的目标是允许用户根据需要为每个“角色”动态地添加尽可能多的“ actorInfo”输入和尽可能多的“ actorInfo”输入。当用户提交表单时,我有一个PHP文件,该文件将需要从“ actorsDivHTML” div中获取每个“ actor”和每个“ actorInfo”。

我的问题是; 命名每个div的最佳方法是什么,以便PHP脚本可以轻松提取信息?遍历div并提取我需要的信息(即每个actor及其相关信息)并将它们放入具有以下结构的数组中的最佳方法是什么:

Array(
    [actor] => Array([0] => "name", [1] => Array([0] => "info1", [1] => "info2", etc.))
    [actor] => Array([0] => "second name", [1] => Array([0] => "actor 2 info1", etc.))
)

很高兴澄清并分享更多代码!

干杯!

[编辑:1]

回应学生:

我已经更新了Div,使其看起来像这样:

<div class="actorTest">

   <div name="actorDivPlace">
       <input type="text" name="actorNameTest[name]">
       <div name="actorInfoDiv">
           <input type="text" name="actorNameTest[name][]">
           <input type="text" name="actorNameTest[name][]">
        </div>
   </div>

    <div name="actorDivPlace">
        <input type="text" name="actorNameTest[name]">
        <div name="actorInfoDiv">
            <input type="text" name="actorNameTest[name][]">
            <input type="text" name="actorNameTest[name][]">
        </div>
    </div>

</div>

当我运行print_r($_POST["actorNameTest"])时,我只有最后一个演员:

Array ( [name] => Array ( [0] => second info [1] => second second info) ) 

2 个答案:

答案 0 :(得分:1)

1)PHP无法从您的<div>访问任何内容。只有html可以做到这一点,PHP只会从您的<input>中选择值,这看起来非常糟糕。

2)actorInfoDiv []和actor []都是无效的HTML名称(它们都不能通过CSS或JavaScript正确解析)。

3)您不应该使用name来标识<div>。您应该使用idclass之一。

4)尝试使用以下结构:

<div name="actorsDivHTML"> <!-- I kept name here so I wouldn't mess up with your javascript code. You should really consider using an id for this. -->
<!-- OR -->
<!-- <div id="actorsDivHTML"> -->

    <div class="actor">
        <input type="text" name="actor[name][]">
        <div class="actorInfoDiv">
            <input type="text" name="actor[info1][]">
            <input type="text" name="actor[info1][]">
        </div>
    </div>

    <div class="actor">
        <input type="text" name="actor[name][]">
        <div class="actorInfoDiv">
            <input type="text" name="actor[info2][]">
        </div>
    </div>

</div>

这使HTML代码更加逻辑和准确。

Php解析数据

<?php

// We need to ensure that the data exist.
if(isset($_POST['actor'])){

    $parsed_data = [];

    // We will be using this number to get the info for 
    // the current name in the list when we iterate 
    // through the names.
    $i = 1;

    // Check the sent data by their names...
    foreach($_POST['actor']['name'] as $key => $value){

        // Add the name to an array
        // Looking at: [0] => "name"
        $array = [$value];

        // Create an array to hold the info's
        $array_infos = [];

        // Get all info posts that associates with the 
        // name in the current position
        // Looking at: [1] => Array([0] => "info1", [1] => "info2", etc.)
        foreach($_POST['actor']["info{$i}"] as $value_info){

            // Append the infos into the value_info array
            // NB: This makes sure that our data is exactly 
            // in the order the user enters it.
            array_push($array_infos, $value_info);
        }

        // Add the infos unto the end of the main array.
        array_push($array, $array_infos);

        // Add the main array to the array of parsed data results.
        // Looking at: [actor] => Array([0] => "name", [1] => Array([0] => "info1", [1] => "info2", etc.))
        array_push($parsed_data, ['actor' => $array]);
        $i++;
    }

    // Do anything you want with the result.
    // I choose to print it out here.
    print_r($parsed_data);
}

?>

这是一个随时可以运行的示例:

<?php

// We need to ensure that the data exist.
if(isset($_POST['actor'])){

    $parsed_data = [];

    // We will be using this number to get the info for 
    // the current name in the list when we iterate 
    // through the names.
    $i = 1;

    // Check the sent data by their names...
    foreach($_POST['actor']['name'] as $key => $value){

        // Add the name to an array
        // Looking at: [0] => "name"
        $array = [$value];

        // Create an array to hold the info's
        $array_infos = [];

        // Get all info posts that associates with the 
        // name in the current position
        // Looking at: [1] => Array([0] => "info1", [1] => "info2", etc.)
        foreach($_POST['actor']["info{$i}"] as $value_info){

            // Append the infos into the value_info array
            // NB: This makes sure that our data is exactly 
            // in the order the user enters it.
            array_push($array_infos, $value_info);
        }

        // Add the infos unto the end of the main array.
        array_push($array, $array_infos);

        // Add the main array to the array of parsed data results.
        // Looking at: [actor] => Array([0] => "name", [1] => Array([0] => "info1", [1] => "info2", etc.))
        array_push($parsed_data, ['actor' => $array]);
        $i++;
    }

    // Do anything you want with the result.
    // I choose to print it out here.
    print_r($parsed_data);
}

?>
<form method="post">

    <div name="actorsDivHTML"> <!-- I kept name here so I wouldn't mess up with your javascript code. You should really consider using an id for this. -->
    <!-- OR -->
    <!-- <div id="actorsDivHTML"> -->

        <div class="actor">
            <input type="text" name="actor[name][]">
            <div class="actorInfoDiv">
                <input type="text" name="actor[info1][]">
                <input type="text" name="actor[info1][]">
            </div>
        </div>

        <div class="actor">
            <input type="text" name="actor[name][]">
            <div class="actorInfoDiv">
                <input type="text" name="actor[info2][]">
            </div>
        </div>

    </div>

    <button>Submit</button>
</form>

答案 1 :(得分:0)

以下是准则:

1)仅发布HTML <form>元素。没有<div>s将被发布。

2)您需要使用多个值表单元素来获取矢量数据。

   <div name="actor">
        <input type="text" name="actorName[name]">
        <div name="actorInfoDiv[]">
            <input type="text" name="actorName[name][]">
            <input type="text" name="actorName[name][]">
        </div>
    </div>

发布表单,并打印$_POST,您将获得所需的数组。