简体   繁体   English

如何将变量从第1页中的字段发布到第2页

[英]How to post variable from field in page 1 to page 2

My code is trying to allow user to add new text field by clicking the add button. 我的代码试图通过单击添加按钮允许用户添加新的文本字段。 I want to post all the text fields the user had added (be it 2, 3, 4 or more) to the next page so I can retrieve the data that the user had entered. 我想将用户添加的所有文本字段(2、3、4或更多)发布到下一页,以便检索用户输入的数据。

P/S: Added new requirement: Retrieve data and print the data that the user had entered. P / S:添加了新要求:检索数据并打印用户输入的数据

Here is my code: 这是我的代码:

    <html> 
    <head>
        <script type="text/javascript" src="jquery.js"></script>

    </head>
<body>
    <script>
    $(document).ready(function(){
        var counter = 2;
        $("#addMenuTab").click(function () {
            if(counter>10){
                alert("Only 10 textboxes allow");
                return false;
            }   

            var newTextBoxDiv = $(document.createElement('div')).attr("id", 'TextBoxDiv' + counter);
            newTextBoxDiv.after().html('<label>Menu Tab #'+ counter + ' : </label>' +
                '<input type="text" name="textbox' + counter + 
                '" id="textbox' + counter + '" value="" >');

            newTextBoxDiv.appendTo("#TextBoxesGroup");
            counter++;
        });

        $("#removeMenuTab").click(function () {
            if(counter==1){
                alert("No more textbox to remove");
                return false;
            }   
            counter--;
            $("#TextBoxDiv" + counter).remove();
        });

    });
    </script>
    <form name="basicInfo" action="contents.php" method="post"> 
    <div id='TextBoxesGroup'>
                            <div id="TextBoxDiv1">
                                <label>Menu Tab #1 : </label>
                                <input type='text' id='textbox1' >
                            </div>
                        </div>
                        <br/>
                            <input type='button' value='  Add Menu Tab  ' id='addMenuTab' />
                            <input type='button' value='  Remove Menu Tab  ' id='removeMenuTab' />
    </form>
</body>
    </html>

You can get all these fields and their values on contents.php under $_POST global array. 您可以在$ _POST全局数组下的contents.php上获取所有这些字段及其值。 For example: 例如:

<?php 
    echo "<pre>"; 
    print_R($_POST); 
    echo "</pre>";
?>

I have a simple solution for your problem. 对于您的问题,我有一个简单的解决方案。 Use one counter to count the number of textfields. 使用一个计数器来计算文本字段的数量。 We can later pass this variable to html. 我们稍后可以将此变量传递给html。 Modify your javascript:- 修改您的JavaScript:-

  <script>
$(document).ready(function(){
    var counter = 2;
    $("#count").val(counter-1); 
    $("#addMenuTab").click(function () {
        if(counter>10){
            alert("Only 10 textboxes allow");
            return false;
        }   

        var newTextBoxDiv = $(document.createElement('div')).attr("id", 'TextBoxDiv' + counter);
        newTextBoxDiv.after().html('<label>Menu Tab #'+ counter + ' : </label>' +
            '<input type="text" name="textbox' + counter + 
            '" id="textbox' + counter + '" value="" >');

        newTextBoxDiv.appendTo("#TextBoxesGroup");
        $("#count").val(counter); 
        counter++;                    
    });

    $("#removeMenuTab").click(function () {
        if(counter==1){
            alert("No more textbox to remove");
            return false;
        }   
        counter--;
        $("#TextBoxDiv" + counter).remove();
        $("#count").val(counter-1); 
    });
});
</script>

Now add one hidden field in your html form. 现在,在您的html表单中添加一个隐藏字段。 The value of this hidden field will be the total number of texfields. 该隐藏字段的值将是texfields的总数。

<input type='hidden' id='count' name='counter' value=''/>

In your contents.php add the below given code. 在您的contents.php中添加以下给定的代码。

$count=$_POST['counter'];
for($i=1;$i<=$count;$i++)
{
 echo "value from textbox$i is".$_POST["textbox$i"]."<br/>";
}

Here you will get the total number of textfields in the variable $count Since the name of your texfields are like textbox1,textbox2..etc You can use a loop for getting all the data from your previous page using the POST method. 在这里,您将获得$ count变量中文本字段的总数。由于texfields的名称类似于textbox1,textbox2..etc。您可以使用循环使用POST方法从上一页获取所有数据。

Also add name attribute to your initial textbox to get this work. 另外,将name属性添加到您的初始文本框中以完成这项工作。

<input type='text' id='textbox1' name="textbox1" >

I don' understand what is your question. 我不明白你的问题是什么。 If you add some inputs like textbox10, you will be able to read textbox10 without problems on your server. 如果添加了诸如textbox10之类的输入,则可以读取textbox10而不会在服务器上出现问题。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM