CodeIgniter+Ajax联动下拉列表异常：第二个字段无法控制

Let's walk through the most likely issues causing your model dropdown to not respond when selecting a brand — I've dealt with exactly this kind of problem before, so here's what to check step by step:

1. Fix the Ajax URL Mismatch #

This is probably the biggest issue right now. Your Controller has a method named myformAjax($id) in the Front class, but your Ajax call is pointing to front/onlinecheck/ajax/'+brandID — that path doesn't match your Controller method at all.

Update your Ajax URL to point to the correct method:

url: '<?php echo base_url();?>front/myformAjax/'+brandID,

Also, double-check your CodeIgniter routes in application/config/routes.php if you're using custom routing. If you haven't modified routes, the default controller/method/parameter structure should work as long as the URL matches exactly.

2. Ensure Your Controller is Set Up Correctly #

There are a few tweaks needed here to make sure your Controller outputs valid JSON and has access to the database:

• Load the Database Library: Either autoload it in autoload.php (add 'database' to $autoload['libraries']) or load it in your Controller's constructor:

  public function __construct() {
      parent::__construct();
      $this->load->database();
  }
  

• Add Proper JSON Headers: This ensures jQuery interprets the response correctly:

  public function myformAjax($id) {
      header('Content-Type: application/json');
      $result = $this->db->where("brand_id", $id)->get("model")->result();
      echo json_encode($result);
      exit; // Prevent any extra output from breaking the JSON
  }
  

• Verify the ID is Being Passed: Temporarily add var_dump($id); inside the method to confirm the brand ID is coming through (remove it once you've checked).

3. Add Ajax Error Handling for Debugging #

Right now, you have no way to know if your Ajax request is failing. Add an error callback to see exactly what's going wrong:

$.ajax({
    url: '<?php echo base_url();?>front/myformAjax/'+brandID,
    type: "GET",
    dataType: "json",
    success:function(data) {
        $('select[name="sel_model"]').empty();
        // Add a default empty option first
        $('select[name="sel_model"]').append('<option value="">Select Model</option>');
        $.each(data, function(key, value) {
            $('select[name="sel_model"]').append('<option value="'+ value.model_id +'">'+ value.car_model +'</option>');
        });
    },
    error: function(xhr, status, error) {
        console.log("AJAX Error:", status, error);
        console.log("Server Response:", xhr.responseText);
    }
});

Open your browser's developer tools (F12) and check the Console tab when you change the brand — this will show you if there's a 404 (wrong URL), 500 (server error), or invalid JSON response.

4. Double-Check Your Database Data & Query #

• Make sure your model table actually has entries with brand_id values that match the ones in your car table.
• Test the query directly in your database to confirm it returns results:

  SELECT * FROM model WHERE brand_id = [your_test_brand_id];
  

If this query returns no rows, your dropdown will stay empty because there's no model data to load for that brand.

5. Confirm jQuery is Loaded #

If jQuery isn't loaded before your script runs, none of the JavaScript will work. Add this before your script (use a CDN or local file):

<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>

Start with fixing the Ajax URL first — that's the most probable fix. Use the error callback to debug any remaining issues, and you should have your dependent dropdown working in no time.

内容的提问来源于stack exchange，提问作者IamOnt