CODEWITHSUNDEEP
phpjqueryhtml
PHP Ferrari
PHP Ferrari

Reputation: 15616

Post array of fields to php using jquery

I have array of text box

<input type="text" name="txt[]" id"txt[]" value="test 1" />
<input type="text" name="txt[]" id"txt[]" value="test 2" />
<input type="text" name="txt[]" id"txt[]" value="test 3" />

and wants to post this array to php file using jquery:

$('#submit').click(function() {

        $.ajax({
            type : 'POST',
            url : '<?php echo site_url('projects/create'); ?>',
            data: {
               txt: $('#txt').val()
            },
            success:function (data) {
                $("#log_msg").html(data);
            }          
        });
    });

but it returns undefined

Upvotes: 0

Views: 2289

Answers (4)

Romain Bruckert
Romain Bruckert

Reputation: 2610

jQuery $(form).serialize() function will help you here !

$('#submit').click(function() {

        $.ajax({
            type : 'POST',
            url : '<?php echo site_url('projects/create'); ?>',
            data: $('#testForm').serialize(),
            success:function (data) {
                $("#log_msg").html(data);
            },
            error: function(x,t,e){
                $("#log_msg").html('An error occured: '+e);
            }
        });
    });

You will get a $_POST nice and clean array in your file (wherever site_url('projects/create') points to). Warning thought, if you add an input submit to that form, serialize() will also post the submit value so you'll have to remove it from the POST array if you plan to insert the array directly in a database. Anyway. ;)

Have fun ! PS: id"txt[]" does not seem to be a correct markup to me... ! id="txt_1". You can only have ONE reference ID in your document and i don't think you can use brackets on markup iding. (someone correct me if I'm wrong..)

Upvotes: 0

PHP Ferrari
PHP Ferrari

Reputation: 15616

Just write

 <input type="text" name="pro_video[]" id="pro_video" />

$('#submit').click(function() {

var videos = $('input[name^=pro_video]');
        var postData = {
            vdo: [], // the videos is an array
        };
        $.each(videos, function(index, el) {
            // push the value in the vdo array
            postData.vdo.push($(el).val());
        });

        $.ajax({
            type : 'POST',
            url : '<?php echo site_url('projects/create'); ?>',
            data: {
               pro_video : postData
            },
            success:function (data) {
                $("#log_msg").html(data);
            }          
        });
    });

Upvotes: 2

hannahd
hannahd

Reputation: 81

To pass the array from JavaScript to PHP you can use the serialize function from JQuery. You can pass this for the entire form or some selected form elements. For the example you gave it would look like this:

The HTML:

<input type="text" name="txt[]" class="txt" value="test 1" />
<input type="text" name="txt[]" class="txt" value="test 2" />
<input type="text" name="txt[]" class="txt" value="test 3" />

And the Javascript:

$('#submit').click(function() {

    $.ajax({
        type : 'POST',
        url : '<?php echo site_url('projects/create'); ?>',
        data: {
           txt: $('.txt').serialize()
        },
        success:function (data) {
            $("#log_msg").html(data);
        }          
    });
});

This will give your php the string "txt%5B%5D=test+1&txt%5B%5D=test+2&txt%5B%5D=test+3", which it can interpret as an array of those values.

Note that I used class instead of id, since ids are supposed to be unique for each element.

Upvotes: 0

Ibrahim Azhar Armar
Ibrahim Azhar Armar

Reputation: 25755

you can use jQuery serialzie() to fetch the form values from html form.

for example :

<form id="testForm" method="post">
    <input type="text" name="txt[]" id"txt[]" value="test 1" />
    <input type="text" name="txt[]" id"txt[]" value="test 2" />
    <input type="text" name="txt[]" id"txt[]" value="test 3" />
</form

and to fetch the value from form using jQuery.

$('#testForm').serialize();

Upvotes: 0

Related Questions