Array is saved to database as string, now need to post string into separate input fields from database - Laravel

Question

So this is quite a complicated question. Following on from my last question which shows how I am saving an array to the database. "Array to string conversion" errorr Laravel - Trying to save array to database - I might have to change how it saves to the database to get it to show correctly.

I am using the google maps api in laravel where a user can create a route, save it (to the database) and when they are logged in can view it again and edit or delete.

The waypoints function works, so on click of the + button more input fields appear - This is how the user adds them in.

waypoints function in showing.blade

            var counter = 1;
            var limit = 10;
            var i = 0;
            function addInput(divName) {
              if (counter == limit) {
                alert("You have reached the limit of adding " + counter + " additional destinations");
              } else {
                var newbr = document.createElement('br');
                var newinput = document.createElement("input");
                newinput.setAttribute("name","waypoints");
                newinput.setAttribute("autocompute","on");
                newinput.setAttribute("type", "text");
                newinput.setAttribute("class", "form-control");

                // newin = (counter + 1) + "<input type=text name=waypoints autocomplete=on>";
                document.getElementById(divName).appendChild(newbr);
                document.getElementById(divName).appendChild(newinput);
                counter++;
                i++;
                console.log("cntr=" + counter + " i=" + i + " waypoints.length=" +document.getElementsByName("waypoints"));
                // var inputw = waypoints[i];
                var autocompletew = new google.maps.places.Autocomplete(newinput);
                autocompletew.setComponentRestrictions({'country':['uk','irl']});

              }
            }

It saves to the database as shown in myroutescontroller.php

public function store(Request $request)
{   
    if (Auth::check()) {

        Myroutes::create([ //posting to acc table
            'user_id' => Auth::user()->id,
            'start' => $request->start,
            'end' => $request->end,
            'waypoints' => $request->waypoints
        ]);
        return redirect('/');
    } else {
        return redirect('/login');
    }   

}

And is showing from database in show.blade

                <div id="dynamicInput" class="form-group">
                    <label>Additional Destinations</label>
                    <input type="text" name="waypoints" class="form-control" autocomplete="on" value="{{ $myroute->waypoints }}">
                </div>

                <input type="button" class="btn btn-secondary" value="+" onClick="addInput('dynamicInput');" style="padding:0 10px;">

Since the waypoints are saved as a string in the database, if the route has multiple waypoints its listing in one input field as shown in the image below. showing from database

When it should look as follows (this is when the user creates and adds the route to database). adding to database

Any ideas and help on this will be greatly appreciated as I know its pretty complicated, thanks!

Answer 1

Save your array as a string with json_encode($array) and then retrieve it json_decode($array).