Как показать значения массива $ reference в форме с идентификатором "# step3form"?

Question

У меня есть эта форма для пользователя, чтобы выбрать способ оплаты:

<form method="post" id="step2form" action="">
        {{ csrf_field() }}
        <h6>Select payment method</h6>
        <div class="form-group">
            <div class="form-check">
                <input class="form-check-input" type="radio" name="payment_method" value="references">
                 <span class="mr-auto">References</span>
            </div>
             <div class="form-check">
                <input class="form-check-input" type="radio" name="payment_method" value="credit_card">
                 <span class="mr-auto">Credit Card</span>
            </div>
        </div>
        <button type="button" href="#step3" data-toggle="tab" role="tab"
                class="btn btn-outline-primary prev-step mr-2">
            Voltar ao passo 1
        </button>
            <input type="submit" href="#step3" id="goToStep3" class="btn btn-primary float-right next-step" value="Go to step 3"/>
        </div>
    </form>

Когда пользователь выбирает способ оплаты и нажимает «перейти к шагу 3», код переходит к handlePaymentMethods() череззапрос ajax.В этом методе, если выбран способ оплаты «ссылки», генерируются некоторые ссылки.Этот код "$reference = $payment->generateRerences();" возвращает массив с некоторыми ссылками, которые пользователь может использовать для оплаты.

Я сомневаюсь, как отобразить информацию в этом массиве $ reference в форме с идентификатором "# step3form".Знаете ли вы, как этого можно достичь?

public function handlePaymentMethods(Request $request){
       $request->validate([
            'payment_method' => 'required',
        ]);

        if($request->payment_method == "references"){
            $payment_info = [
                't_value' => '10',
                'o_obs' => ''
            ];

            $payment = new Payment($payment_info);
            $reference = $payment->generateReferences();
        }
        else{
        }
        return response()->json([
            'success' => true,
            'message' => 'success',
            'payment_method' => $request->payment_method,
        ], 200);
    }

jQuery и ajax-код, который отправляет ajax-запрос к handlePaymentMehods () и показывает следующую вкладку (шаг 3), если возвращается код 200:

$("#credit_card_section").hide();
$("#references_section").hide();

var page_form_id_step2 = "step2form";

    $('#goToStep3').on('click', function (event) {
        event.preventDefault();
        var custom_form = $("#" + page_form_id_step2);
        $.ajax({
            method: "POST",
            url: '{{ route('conferences.storePaymentMethods', compact('id','slug') ) }}',
            data: custom_form.serialize(),
            datatype: 'json',
            success: function (data, textStatus, jqXHR) {
                var result = data;
                if(result['payment_method'] == 'credit_card'){
                    $("#credit_card_section").show();
                    $("#references_section").hide();
                }else{
                    $("#references_section").show();
                    $("#credit_card_section").hide();
                }
                var $active = $('.nav-pills li a.active');
                nextTab($active);
            },
            error: function (data) {
               // show errors
            }
        });
    });

Форма step3 имеет div "#references_section", который виден, когда выбран способ оплаты - reference, а значения массива $ reference должны быть представлены здесь:

<div>
    <form method="post" id="step3form" action="">
            {{csrf_field()}}
            <div id="credit_card_section">

            </div>
              <div id="references_section">
        <!-- how to show the values of the $reference array here?-->
            </div>
    </form>
</div>

Answer 1

Я не думаю, что здесь оптимально использовать переменную сеанса.Я рекомендую просто отправить данные обратно через AJAX.

Сначала вам нужно создать элемент формы внутри скрытого элемента div.У него просто не будет никаких опций, пока вы не отправите массив $ reference на страницу.Что-то вроде:

<div id="references_section">
    <select class="form-control" name="references" id='references'></select>
</div>

Получив это, вы можете использовать jquery для добавления нового массива в этот оператор выбора.Что-то вроде:

success: function (newArray) {
    $("#references").empty();

    var list = '<option value="">Please Select</option>';

    $.each(newArray, function(value,key) {
        list += "<option value='" +value + "'>" + key + "</option>";
    });

    $("#references").html(list);
    $("#references").trigger('change');
}

Вам нужно настроить для соответствия ... но что-то похожее на это позволит получить массив в оператор выбора формы через jquery.