Store data into MySQL table from dynamically added text boxes

Question

I am currently working on a guides system for a website I'm creating which allows a registered user to create a guide with "steps". Each "step" is generated by simple JQuery and the text box is replaced by the summernote WYSIWYG editor.

I am looking for how to best store each "step" in one column of my database table.

DATABASE TABLE

id | category | title | description | guide | author | stamp

The guide column will be where the content from each text box is added.

FORM SECTION

<div class="form-group">
  <p class="text-center">
    <label for="article">Article Content:</label>
    <div class="field_wrapper">
      <div>
        <textarea name="field_name[]" class="form-control summer"></textarea>
        <a href="javascript:void(0);" class="add_button" title="Add field">+ Add Step</a>
      </div>
    </div>
    <script>
      $(document).ready(function() {
        var maxField = 20;
        var x = 1;
        var addButton = $('.add_button');
        var wrapper = $('.field_wrapper');
        var fieldHTML = '<div><textarea name="field_name[]" class="form-control summer"></textarea><a href="javascript:void(0);" class="remove_button" title="Remove field">- Remove Step</a></div>';
        $(addButton).click(function(){
          $(document).ready(function() {
            $('.summer').summernote({
              placeholder: 'Step ' + x
            });
          });
          if(x < maxField){
            x++;
            $(wrapper).append(fieldHTML);
          }
        });
        $(wrapper).on('click', '.remove_button', function(e){
          e.preventDefault();
          $(this).parent('div').remove();
          x--;
        });
      });
      $(document).ready(function() {
        $('.summer').summernote({
          placeholder: 'Step 1'
        });
      });
    </script>
  </p>
</div>

I know I can grab all the submitted data by:

$fieldvals = $_REQUEST['field_name'];
foreach($fieldvals as $value){
    // DO STUFF HERE
}

What would I use to actually place each step in "guide"?

Would I do something similar to:

$input[] = $value
$data = implode(',', $input)
INSERT INTO .....

I wouldn't be able to use a comma for the implode though, correct, as if one of the steps includes a comma, it would mess it up?

UPDATE

I received the following JSON output from a suggestion below. Not sure how to get this into the "guide" column?

["TEST STEP 1<\/p>",
"TEST STEP 2<\/p>",
"TEST STEP 3<\/p>"]

Answer 1

Ello mate.

I think you should use json_encode($array) and json_decode($json, $true_or_false) instead implode($glue, $arr) and explode($delimiter, $str), the commas wouldn't mess the things up, as well as unicode characters, arrays or booleans.

//Example
$values = 
  [
    'something' => 'something, something, something else', 
    'something_else' => 'something else',
    'double_quotes' => 'something with double quotes "¿que pasa wey?"',
    'chingadera' => "something with ' as apostrophe",
    'coisa' => 'acentuação em ação na missão',
    'taiwan' => '台灣',
    'capital' => 
      [
          'brazil' =>
              [
                  'pt_BR' => 'Brasília',
                  'zh_TW' => 'You dont know, neither do I'
              ],
          'taiwan' => 
              [
                  'zh_TW' => '台北',
                  'en_GB' => 'Taipei',
                  'pt_BR' => 'Taipé'
              ]
      ],
    'bool' => true
  ];
$json = json_encode($values);
echo $json;

And now you got:

/*I've pretty printed the JSON for better readability, it will be an one line string*/
{
  "something": "something, something, something else",
  "something_else": "something else",
  "double_quotes": "something with double quotes \"\u00bfque pasa wey?\"",
  "chingadera": "something with ' as apostrophe",
  "coisa": "acentua\u00e7\u00e3o em a\u00e7\u00e3o na miss\u00e3o",
  "taiwan": "\u53f0\u7063",
  "capital": {
    "brazil": {
      "pt_BR": "Bras\u00edlia",
      "zh_TW": "You dont know, neither do I"
    },
    "taiwan": {
      "zh_TW": "\u53f0\u5317",
      "en_GB": "Taipei",
      "pt_BR": "Taip\u00e9"
    }
  },
  "bool": true
}

You can insert this string into your DB column. Now its time to decode it

/*JSON to array
Pass true as the second arg on json_decode($json, $bool)*/
$array = json_decode($json, true); //you must pass true as the second arg
echo $array['chingadera']; //'something with \' as apostrophe'
echo $array['taiwan']; //'台灣'
echo $array['capital']['brazil']['pt_BR']; //'Brasília'

/*JSON to STDClass Object
Don't pass anything as the second arg*/
$object = json_decode($json);
echo $object->double_quotes; //'something with double quotes "¿que pasa wey?"'
echo $object->capital->taiwan->zh_TW; //'台北'
echo $object->bool; //1

You can pretty print your JSONS here

Make sure that your 'guide' column will support a good amount of characters