CODEWITHSUNDEEP
phparrays
Rtra
Rtra

Reputation: 522

PHP form submit into multi-dimensional array

I am writing a code from which values stored into multi-dimensional array but the problem is I am unable to do it when I submit the form it makes a single array like this.

Array (
    [0] => inputbox value
    [1] => 1
)

But I want a result like this

Array (
    [0] => Array (
        'nameField' => 'inputbox value',
        'PageField' => 1
    ),
    [1] => Array ( ... ),
    [2] => Array ( ... ) ... and so on
)

I am unable to figure out what I am doing wrong here my simple code

<?php
    if ($_POST) : 
        echo "<pre>";
            print_r($_POST['mc']);
        echo "</pre>";
    endif;
?>

Here is my HTML

<form action="#" method="post">
<table style="width:100%">
    <thead>
        <tr>
        <td style="width:70%"><strong>Display Title Name:</strong></td>
        <td style="width:30%"><strong>Select Sub Page:</strong></td>
        </tr>
    </thead>
    <tbody>
    <tr>
    <td style="width:70%"><input name="mc[]nameField" value="" style="width:100%" type="text"></td>
    <td style="width:30%">
        <select name="mc[]PageField" style="width:100%">
            <option selected="selected" disabled="disabled" value="">Select page</option>
            <option value="1">04:00 PM Result Page</option>
            <option value="2">08:00 PM Result Page</option>
            <option value="3">11 55 AM Result Page</option>
            <option value="4">About Us</option>
            <option value="5">Contact Us</option>
        </select>
    </td>
    </tr>
    </tbody>
</table>
<div style="width:100%; padding:5px;">
    <input class="add_new_media button button-primary button-large" id="publish" value="Add" type="button">
    <input class="remove button button-primary button-large" id="publish" value="Remove" type="button">
</div>
<input name="SubmitForm" type="submit" value="SubmitForm" />
</form>

Here is my Jquery Code

<script>
jQuery(document).ready(function($){
var count = $("tbody tr").length;
myFunction(count);
    $('.add_new_media').on('click', function() {
        $('tbody tr:first-child')
        .clone()
        .appendTo($('tbody'))
        .find('input')
        .val('')
        var count = $("tbody tr").length;
        myFunction(count);
    });
    $('.remove').on('click', function() {
        $('tbody tr:last').remove();
        var count = $("tbody tr").length;
        myFunction(count);
    });
    function myFunction(count) {
        if (count > 1) {
            $('.remove').removeAttr("disabled");    
        } else {
            $('.remove').attr("disabled", "disabled");
        }
    }
});
</script>

Upvotes: 0

Views: 106

Answers (1)

user3773246
user3773246

Reputation:

You want to send an array of dictionaries to the server.

First, create an array that will contain dictionaries say var arrays = [] as your global variable.

var arrays = [];

The general idea is every time when a user has finish inputting data, you need to add that data to arrays.

Add a button to let jQuery know when to add to the arrays:

<button id="abutton" type="button" >Click Me!</button>

Here is how you add the data to the arrays in jQuery:

 $("#abutton").click(function(){

       var nameFieldData = // get data from name field 
       var pageFieldData = // get data from page field

       arrays.push(
          {'nameField': nameFieldData,
           'PageField': pageFieldData});
 });

Then send arrays back to the server when you are ready.

Upvotes: 2

Related Questions