Q:

Laravel - How can I autofill a text input in a form with the address tied to the selected customer's id?

This is in my ordered.blade.php file. I essentially want to make it to where when I select a customer from the drop down it autofills the address tied to the customer's id. But since it's very hard to find any documentation on this, I've become stuck. Would appreciate any amount of help. Thanks!
    <div class="form-group">
      <label for="customerId">Customer Name:</label>
      <select onchange="customerId(this.value)" name="customerId" class="form-control">
        <option>Choose A Customer</option>
        @foreach ($customers as $customer)
          <option name="customerId" id="customerId" value="{{$customer->id}}{{$customer->address}}">{{$customer->name}}</option>
        @endforeach
      </select>
    </div>

    <div class="form-group">
      <label for="shiptoAddress">Ship-To Address (Full Address):</label>
      <input name="shiptoAddress" class="form-control" id="shiptoAddress" placeholder="Ship-To Address">
    </div>

This is my function in my OrderController for creating a new order:
    /*Create Order*/
    public function create( Request $data){
        $order = new Order;
        $order->customerId = $data->customerId;
        $order->save();
        return redirect('orders');
    }

A:

It looks like you're using a JavaScript function but it wasn't included in this code snippet, so I changed the function to do what you're asking. If it was doing something, you can add it to the new function.
So basically the first thing I did was rearrange some ids. You have an id set on your option tag which is inside a loop which will create elements with the same id for each customer.
The next thing I did was alter the value you had set for your options as it looked like multiple values were trying to be stored, so instead I used the entire customer object (which will be stored as a string).
<div class="form-group">
    <label for="customer-select">Customer Name:</label>
    <select id="customer-select" onchange="selectCustomer()" name="customer-select" class="form-control">
        <option value="default">Choose A Customer</option>
        @foreach ($customers as $customer)
            <option value="{{ $customer }}">{{$customer->name}}</option>
        @endforeach
    </select>
</div>

<div class="form-group">
    <label for="shiptoAddress">Ship-To Address (Full Address):</label>
    <input name="shiptoAddress" class="form-control" id="shiptoAddress" placeholder="Ship-To Address">
</div>

By setting the entire customer object as the value of the option, you will have access to any other parts of the customer should you need to do something with them in the future (ie. use the id of the customer to do something else).
Now for the JavaScript, I used raw JavaScript (you can change it to jQuery if you have it) to get the value of your Customer Select and apply it to your Address Input
Then I used JavaScript to get the value of your select statement and made it the value of your input field. The JSON.parse(...) call is parsing the customer string (as previously mentioned) into a usable JavaScript object.
<script>
    function selectCustomer() {
        let select = document.getElementById('customer-select');
        let ship_to_address = document.getElementById('shiptoAddress');

        if(select.value === 'default') {
            ship_to_address.value = '';
        } else {
            ship_to_address.value = JSON.parse(select.value).address;
        }
    }
</script>

In the future, if you have multiple keys within your $customer->address, you could use the same approach to setting different values of separated inputs for each piece of your address. For example:
...
    let address = JSON.parse(select.value).address;
    street_1.value = address.street_1;
    city.value = address.city;
...

