Ajax를 만드는 방법 laravel 11에서 Ajax 종속 드롭다운을 만드는 방법

이 튜토리얼에서는 laravel 11 애플리케이션에서 ajax 종속 드롭다운을 만드는 방법을 가르쳐 드리겠습니다. laravel 11에서 국가, 주, 도시 선택을 위한 동적 종속 드롭다운을 생성하겠습니다.

종속 드롭다운이란 무엇인가요?
종속 드롭다운은 한 드롭다운 메뉴에서 사용할 수 있는 옵션이 다른 드롭다운 메뉴에서 선택한 항목에 따라 달라지는 메뉴 유형입니다. 예를 들어 첫 번째 드롭다운에서 '과일'을 선택하면 두 번째 드롭다운의 옵션은 '사과', '바나나', '오렌지'가 될 수 있습니다. 하지만 첫 번째 드롭다운에서 '야채'를 선택하면 두 번째 드롭다운의 옵션이 '당근', '브로콜리', '토마토'로 변경될 수 있습니다. Laravel 11 사이트맵 XML 파일 생성 및 읽기 튜토리얼을 배울 수 있습니다

이 예에서는 국가, 주, 도시에 대한 테이블을 만듭니다. 그런 다음 데이터베이스 시더를 사용하여 해당 테이블에 일부 더미 데이터를 추가합니다. 그런 다음 국가, 주, 도시에 대한 세 개의 선택 상자가 있는 양식을 만듭니다. 사용자가 국가를 선택하면 선택한 국가에 따라 주 선택 상자가 채워집니다. 그런 다음 사용자가 주를 선택하면 선택한 주에 따라 도시 선택 상자가 채워집니다. 그럼 동적 종속 드롭다운에 대한 간단한 단계별 코드를 살펴보겠습니다.

laravel 11에서 Ajax 종속 드롭다운을 만드는 방법은 무엇입니까?

1단계: 라라벨 11 설치

우선 처음부터 시작하기 때문에 아래 명령을 사용하여 새로운 Laravel 11 버전 애플리케이션을 받아야 합니다. 따라서 터미널이나 명령 프롬프트를 열고 아래 명령을 실행하세요.

composer create-project laravel/laravel ajax-dependent-dropdown
cd ajax-dependent-dropdown

Laravel 11 튜토리얼에서 Summernote를 사용하여 이미지를 업로드하는 방법을 읽을 수 있습니다

2단계: 마이그레이션 생성

이 단계에서는 국가, 주, 도시 테이블에 대한 마이그레이션을 생성합니다. 그럼 아래 명령어를 실행하여 테이블을 생성해 보겠습니다.

php artisan make:migration create_countries_states_cities_tables

다음으로 마이그레이션 파일에서 아래 코드를 업데이트하면 됩니다.

데이터베이스/이주/create_countries_states_cities_tables.php

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

return new class extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up(): void
    {
        Schema::create('countries', function (Blueprint $table) {
            $table->id();
            $table->string('name');
            $table->timestamps();
        });

        Schema::create('states', function (Blueprint $table) {
            $table->id();
            $table->string('name');
            $table->integer('country_id');
            $table->timestamps();
        });

        Schema::create('cities', function (Blueprint $table) {
            $table->id();
            $table->string('name');
            $table->integer('state_id'); 
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down(): void
    {
        Schema::dropIfExists('countries');
        Schema::dropIfExists('states');
        Schema::dropIfExists('cities');
    }
};

자세히 보기

위 내용은 Ajax를 만드는 방법 laravel 11에서 Ajax 종속 드롭다운을 만드는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!