2012-05-08 3 views
0

На моей странице есть комбинированная коробка с кнопкой добавления. Как создать новое поле со списком под исходным полем со списком, когда я нажал кнопку добавления? Если щелкнуть снова, это приведет к созданию другого поля со списком. Значение внутри каждого поля со списком вызывается из базы данных.Динамически добавьте новую поле со списком (выберите)

+0

что вы наделали? – candyleung

+0

Читайте о 'clone'. Я просто не знаю, как дать полный ответ. –

+0

@MiaDiLorenzo У вас есть какая-либо ссылка? –

ответ

4

Вот пример, хотя вам придется самостоятельно выработать среднюю и конечную части.

Пример: http://jsfiddle.net/9hvbt/3/

JavaScript

$('#btnAdd').click(function(){ 
    //Use Ajax to talk to your server (middle tier) 
    $.ajax({ 
     url: '/echo/json/', //Replace with your URL to return Database data (JSON format) 
     dataType: 'json', 
     type: 'get', 
     success: function(data){ 
      //Use the returned data to pass into CreateDropDown (Hard coded for an example) 
      CreateDropDown(["Item 1", "Item 2", "Item 3"]); 
     } 
    }); 
}); 

function CreateDropDown(data){ 
    var $newSelect = $('<select />'); 
    $.each(data, function(i, val){ 
     $newSelect.append($('<option />', { 
      'text':val 
     }));    
    }); 
    $newSelect.appendTo('#dropDowns'); 
} 

HTML

<div id='dropDowns'> 
    <select> 
    <option>Item 1</option> 
    <option>Item 2</option> 
    <option>Item 3</option> 
    </select> 
</div> 
<input type='button' id='btnAdd' value="Add" />​ 

EDIT

Вы должны также прочитал (а) jQuery's AJAX method

1

любые идеи с jquery? JQuery клон() поможет вам решить эту проблему

JQuery .clone()

живой пример: http://jsfiddle.net/laupkram/6LBNs/

в случае вашей проблемы попытаться изучить это один

Dynamic Loading of ComboBox using jQuery and Ajax

+0

Ссылка u дала мне слишком много нагрузок. Не могу открыть его –

+0

Подождите, пожалуйста, создайте живой пример для вас –

+0

ok Я уже создал живой пример для вас –

Смежные вопросы