2011-12-17 4 views
0

Я занимаюсь исследованиями в течение последних двух дней и ничего не нашел.Как загрузить содержимое sql/session в div из загруженного div

Структура:

index.php:

<head> 
    <script type="text/javascript" src="JS/jquery-1.6.2.js"></script> 
    <script type="text/javascript" src="function.js"></script> 
    </head> 

    <body> 

    <div> 
    <div><a href="" class="testcat" id="1">Show</a></div> *-->if I click this link data loads into DIV below by function.js without reloading* 
    <div id="producten"></div> *-->testpage.php loads here perfect, 
the code of testpage.php makes by while loop other links. 
Here I want to click on a link to load next data in div id=information 
without reloading the index.php so the data in the first DIV stay visible 
and I dont know how to do that* 
    <div id="information"></div> *-->testpage2.php have to load data from sql in this DIV* 
    </div> 

    </body> 

function.js:

$(document).ready(function() { 
    $(".testcat").click(function() { 
     var testid = $(this).attr("id"); 
     var datastring = 'id='+ testid ; 
     $.ajax({ 
      type: "POST", 
      url: "testpage.php", 
      data: datastring, 
      cache: false, 
      success: function(res) { 
      $('#producten').html("<div class='loading'><img src='IMG/loading.gif' /></div>") 
       .hide() 
       .fadeIn(2000, function() { 
       $('#producten').html(res); 
      }) 
      } 
     }); 
     return false; 
    }); 

}); 

testpage.php и testpage2.php являются ПДО код данных SQL.

+0

Это немного трудно понять, что вы хотите. Не могли бы вы показать полный код 'testpage.php' и' testpage2.php' и указать, в каком втором div вы хотите, чтобы информация загружалась? –

+0

Если я правильно вас понимаю, вы относитесь к решению AJAX. –

ответ

0

Вы хотите прикрепить обработчик кликов с on так, чтобы динамически добавлять контент по-прежнему имеет те же АЯКС обработчиков, доступные им:

Добавить любую информацию, необходимо, чтобы отличить один щелчок от следующего, т.е.

<a href='...' data-resultdiv='production' 

Затем очистки обработчик немного: Я предполагаю, что вы хотите запрос Ajax, чтобы перейти на HREF в ссылку, и что вы хотите, чтобы показать «загрузку» сразу (вместо того, чтобы ждать запроса на полный).

И наконец, чтобы отменить поведение браузера по умолчанию для привязки к странице, на которую ссылается href, вы можете вернуть false;

$(document).on("click", "a", function() { 
    var href = $(this).attr("href"); 
    var successDiv = $(this).data("resultdiv"); 
    $('#' + successDiv).html("<div class='loading'><img src='IMG/loading.gif' /></div>"); 
    $.ajax({ 
     type: "POST", 
     url: href, 
     data: datastring, 
     cache: false, 
     success: function(res) { 
      $('#' + successDiv).hide().html(res).fadeIn(2000); 
     }  
    } 
    return false; 
}); 

И, конечно, если вы только хотите, чтобы это выполнить определенные якоря, вы можете поставить селектор на ваш призыв на

$(document).on("click", "a.someClass", function() { 
Смежные вопросы