Добавить код PHP с AJAX

Question

Я хочу вставить новое поле в div, когда пользователь нажимает кнопку (+).

Код TextField является то, что:

<?php 
$sql = "SELECT nome, codigo FROM ref_bibliograficas"; 
$result = mysql_query($sql) or die (mysql_error()); 
echo ("<select class='autocomplete big' name='ref_bib_0' style='width:690px;' required>"); 
echo ("<option select='selected' value=''/>"); 
while($row = mysql_fetch_assoc($result)){ 
echo ("<option value=" . $row["codigo"] . ">" . $row["nome"] . "</option>"); 
echo ("</select>"); 
mysql_free_result($result); 
?> 

Таким образом, я не знаю, как я вставить поле с помощью AJAX.

Я задал функцию onclick с помощью jQuery! Кто-нибудь может мне помочь?

Спасибо!

Answer 1

Что вы ищете, это функция jQuery .load(). http://api.jquery.com/load/

У РНР страницы вывода нужный HTML, который вы хотите добавить в свой DIV, то ваш код JavaScript должен выглядеть следующим образом:

$('#addButton').click(function(){   // Click event handler for the + button. Replace #addButton wit the actual id of your + button 
    $('#myDiv').load('yourphppage.php'); // This loads the output of your php page into your div. Replace #myDiv with the actual id of your div 
}); 

Если вы хотите Append новое поле ваш DIV, то вы должны сделать следующее:

$('#addButton').click(function(){ 
    $.post('yourphppage.php', function(data) { 
     $('#myDiv').append(data); 
    }); 
}); 

Answer 2

Ajax подход

$(document).ready(function(e) 
{ 
    $('#plus-button').click(function(e) 
    { 
    $.ajax(
    { 
    url: "PHP-PAGE-PATH.php", // path to your PHP file 
    dataType:"html", 
    success: function(data) 
    { 
     // If you want to add the data at the bottom of the <div> use .append() 

     $('#load-into-div').append(data); // load-into-div is the ID of the DIV where you load the <select> 

     // Or if you want to add the data at the top of the div 

     $('#load-into-div').prepend(data); // Prepend will add the new data at the top of the selector 
    } // success 
    }); // ajax 
    } 

});