2011-04-20 7 views
0

내 JQuery와JQuery와 부하 후 .... 어떤 생각이

$(document).ready(function(){ 
    $('.categories').live('change', function() { 
     var my_location = window.location.pathname.replace('admin/', ''); 
     $(this).parents("tr").next("tr.subcategories").load(my_location + '?route=module/cart/ajax_sub&category_id=' + $(this).val()); 
    }); 

    $('.subcategories_select').live('change', function() { 
     var my_location = window.location.pathname.replace('admin/', ''); 
     $(this).parents("tr").next("tr.products").load(my_location + '?route=module/cart/ajax_products&category_id=' + $(this).val()); 
    }); 
}); 
을 수행하는 방법에

내 HTML

<tr><td>Categories</td> 
<td><select class="categories" name="category_id"> 
    <option value="0" selected="selected">Select a Category</option> 
    <?php foreach ($categories as $category) { ?> 
    <option value="<?php echo $category['category_id']; ?>"><?php echo $category['name']; ?></option> 
    <?php } ?> 
    </select></td> 
</tr> 
<tr class="subcategories"></tr> 
<tr class="products"></tr> 

내가 뭘 생각해야 할 세 가지 (TR)의 최종 제품이 같아야하므로입니다 이

<tr class="subcategories"></tr> 
<tr class="products">stuff from ajax</tr> 
<tr class="business_products">stuff from ajax</tr> 
<tr class="premium_products">stuff from ajax</tr> 

여기 내 PHP입니다

public function ajax_products(){ 
    $this->load->model('catalog/product'); 
    $products = $this->model_catalog_product->getProductsByCategoryId($_GET['category_id']); 
    $class = 'odd'; 
    $data = '<td><div class="scrollbox smallscroll">'; 
    foreach ($products as $product) { 
     $class = ($class == 'even' ? 'odd' : 'even'); 
     $data .= '<div class="' . $class . '">'; 
     $data .= '<input type="checkbox" name="standard[]" value="' . $product['product_id'] . '" />'; 
     $data .= $product['name']; 
     $data .= '</div>'; 
    } 
    $data .=  '</div></td></tr>'; 
    $data .= '<tr class="business_products">'; 
    $class = 'odd'; 
    $data .= "<td>Business</td>"; 
    $data .= '<td><div class="scrollbox smallscroll">'; 
    foreach ($products as $product) { 
     $class = ($class == 'even' ? 'odd' : 'even'); 
     $data .= '<div class="' . $class . '">'; 
     $data .= '<input type="checkbox" name="business[]" value="' . $product['product_id'] . '" />'; 
     $data .= $product['name']; 
     $data .= '</div>'; 
    } 
    $data .=  '</div></td></tr>'; 
    $data .= '<tr class="premium_products">'; 
    $class = 'odd'; 
    $data .= "<td>Premium</td>"; 
    $data .= '<td><div class="scrollbox smallscroll">'; 
    foreach ($products as $product) { 
     $class = ($class == 'even' ? 'odd' : 'even'); 
     $data .= '<div class="' . $class . '">'; 
     $data .= '<input type="checkbox" name="premium[]" value="' . $product['product_id'] . '" />'; 
     $data .= $product['name']; 
     $data .= '</div>'; 
    } 
    $data .=  '</div></td>'; 
    print $data; 
} 

문제는이 모든 데이터가 하나의 TR에서하고 있습니다 ... 다른 두 개의 TRS를 추가하지 않습니다 ... 결국 난 형태를 .subcategories 후 아약스 호출을 오는 모든 데이터 후에로드해야

답변

1

뭔가를해야합니다. 제 말은 그렇습니다. 유효한 HTML이지만, </tr> 태그를 이미 가지고있는 <tr> 태그를 닫음으로써 "트릭 킹"하고 있기 때문에 PHP에서 얻은 스 니펫은 합법적이지 않은 것처럼 보입니다. .load() docs에서는이 말한다 :

jQuery를가 검색 문서를 구문 분석하고 현재 문서에 삽입 브라우저의 .innerHTML 속성을 사용합니다. 이 과정에서 브라우저는 또는 요소와 같은 문서를 에서 필터링합니다. 결과적으로 .load()로 검색 한 요소가 브라우저에서 직접 문서 을 검색 한 경우와 완전히 동일하지 않을 수 있습니다.

조작 된 요소 (예 : 닫는/시작 태그 없음)도 무시할 수 있습니다. 콘텐츠가로드 된 후 DOM을보고 HTML 구조가 무엇인지 확인하십시오.

내 추천은이 문제와 상관없이 데이터를 JSON 개체를 통해 전달한 다음 JavaScript를 통해 HTML 형식을 지정하는 것입니다. 이렇게하면 서버에서 보낸 데이터 양이 줄어들므로 HTML 구조 만로드하면됩니다. 원하는 경우 예제를 만들 수 있습니다.


좋습니다. 먼저 경고 메시지가 표시됩니다. 나는 어떤 것도 테스트하지 않았으므로 버그가있을 수 있습니다. 그냥 의견을 게시하고 내가 당신을 도울 것입니다.

여기 간다 :

HTML

<tr><td>Categories</td> 
<td><select class="categories" name="category_id"> 
    <option value="0" selected="selected">Select a Category</option> 
    <?php foreach ($categories as $category) { ?> 
    <option value="<?php echo $category['category_id']; ?>"><?php echo $category['name']; ?></option> 
    <?php } ?> 
    </select></td> 
</tr> 
<tr class="subcategories"></tr> 
<tr class="products"></tr> 
<tr class="business_products"></tr> 
<tr class="premium_products"></tr> 

PHP

public function ajax_products(){ 
    $this->load->model('catalog/product'); 
    $products = $this->model_catalog_product->getProductsByCategoryId($_GET['category_id']); 
    //Since all your products are just duplicated for each input, we 
    // really only need 1 array 
    $products = array(); 
    foreach ($products as $product) { 
     //Add the product info to the array 
     $data[] = array("id" => $product['product_id'], "name" => $product['name']); 
    } 
    //This outputs the data in the JSON format 
    echo json_encode($data); 
    //A LOT shorter right? :) 
} 

자바 스크립트

,466,187,
+0

예 doo .... do again .... thanks again – Trace

+0

@ 맛사지 : 업데이트되었습니다. –

+0

다시 한번 감사드립니다 ... 최고입니다 .... 꼭 꼭 대답 해주세요 – Trace

0

나는 생각 문제는 :

tr.products 후 다음 형제를 선택하지만 tr.products 후 형제가 존재
$(this).parents("tr").next("tr.products") 

? 그것은 귀하의 HTML에 표시되지 않습니다.

현재 한 후 새 행을 삽입 할 경우

는, 아마도 당신은 내가 당신이 PHP에서 전달하는 잘못된 HTML과 관련이있는 몰래 의혹이 .after()

+0

PHP에서 반환 된 HTML에 여분의 태그를 출력합니다. –

+0

당신은 ajax를 통해 html을 삽입하고 after()를 사용할 수 있습니다. – Trace

+0

@Drackir 처음에는 제 생각에 그것은 존재하지 않는 요소를 선택하고 그 뒤에 새로운 내용을로드하려고 시도하는 것 같습니다. load ("ajax_products")'. – jeroen