Member Avatar for Jiby_1

//How dinamically adding textbox and textarea of the given code can take after submit button is clicked in php?

<!DOCTYPE html>
<html>
<head>
<title>Add or Remove text boxes with jQuery</title>
<script type="text/javascript" src="//code.jquery.com/jquery-latest.js"></script>
<style type="text/css">
<!--
#main {
    max-width: 800px;
    margin: 0 auto;
}
-->
</style>
</head>
<body>
<div id="main">
    <h1>Add or Remove text boxes with jQuery</h1>
    <div class="my-form">
        <form role="form" method="post">
            <p class="text-box">
                <label for="box1">Box <span class="box-number">1</span></label>
                <textarea name="boxes[]" value="" id="box1" ></textarea>
                <input type="text" name="boxes1[]" value="" id="box2" ></textarea>
                <a class="add-box" href="#">Add More</a>
            </p>
            <p><input type="submit" value="Submit" name="submit" /></p>
        </form>
    </div>
</div>
<script type="text/javascript">
jQuery(document).ready(function($){
    $('.my-form .add-box').click(function(){
        var n = $('.text-box').length + 1;
//        if( 5 < n ) {
//            alert('Stop it!');
//            return false;
//        }
        var box_html = $('<p class="text-box"><label for="box' + n + '">Box <span class="box-number">' + n + '</span></label> <textarea name="boxes[]" value="" id="box1' + n + '" ></textarea> <input type="text" name="boxes[]" value="" id="box2' + n + '" /><a href="#" class="remove-box">Remove</a></p>');

    box_html.hide();
        $('.my-form p.text-box:last').after(box_html);
        box_html.fadeIn('slow');
        return false;
    });
    $('.my-form').on('click', '.remove-box', function(){
        $(this).parent().css( 'background-color', '#FF6C6C' );
        $(this).parent().fadeOut("slow", function() {
            $(this).remove();
            $('.box-number').each(function(index){
                $(this).text( index + 1 );
            });
        });
        return false;
    });
});
</script>
</body>
</html>
  • 2 Contributors
  • 2 Replies
  • 237 Views
  • 4 Days Discussion Span
  • Latest Post Latest Post by Jiby_1

Dani AI

Generated

A few practical fixes and a safe server-side pattern will make this work reliably.

The problems in ’s snippet are mostly HTML/naming errors (mismatched/duplicate tags and ids) and inconsistent names on submit. is right to loop the submitted arrays, but you must ensure the arrays align and you validate each index before inserting. The undefined $secondbox in your follow-up comes from inconsistent variable names — keep front-end names and back-end variables in sync.

Use consistent array names for each dynamic row (for example texts[] and values[]), generate unique ids if you need them, and ensure removed rows are actually removed from the form DOM so they don’t leave gaps in posted arrays. Example minimal row template:

<p class="row">
  <label>Item <span class="idx">1</span></label>
  <textarea name="texts[]"></textarea>
  <input name="values[]" type="text">
  <a class="remove" href="#">Remove</a>
</p>

On the PHP side, check the arrays, normalize counts, skip empty rows, and always use prepared statements when inserting. Example pattern using PDO:

$texts  = $_POST['texts']  ?? [];
$values = $_POST['values'] ?? [];

$pdo = new PDO(...);
$stmt = $pdo->prepare('INSERT INTO table_name (col_text, col_val) VALUES (:t, :v)');

foreach ($texts as $i => $t) {
    $v = $values[$i] ?? '';
    $t = trim($t); $v = trim($v);
    if ($t === '' && $v === '') continue;
    $stmt->execute([':t' => $t, ':v' => $v]);
}

Troubleshooting tips: print_r($_POST) to inspect posted structure, confirm your JS sets name attributes before appending, and verify counts with count($_POST['texts']). Always validate and sanitize user input, and use prepared statements to avoid SQL injection.

Recommended Answers

All 2 Replies

Member Avatar for rpv_sen 
if(isset($_POST['submit']))
{
    $chkbox = $_POST['boxes'];
    $txtbox = $_POST['boxes1'];

    foreach($txtbox as $a => $b)

        echo "$chkbox[$a]  -  $txtbox[$a] <br />";
        //insert query

        insert into table name(field1,field2)values($chkbox[$a],$txtbox[$a]);

}
Member Avatar for Jiby_1 
if dynamically more textbox means how to do the loop for above code

this is the code i did

 $firstkbox = $_POST['boxes'];

        foreach($secondbox as $a => $b){

             echo "$firstkbox[$a]  -  $secondbox[$a] <br />" ;

        }

}
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.