2015-11-04 287 views
0

我有問題,我的動態生成的div自動完成動態生成的div

文件1自動完成 - 的JavaScript文件,該文件上點擊鏈接生成輸入字段

var inputHTML = '<div id="addProducts" class="col-md-2 form-group"><input type="text" class="form-control" placeholder="Identyfikator opony" name="tyreID[]" id="tyreID"><input type="text" class="tyreSize form-control" placeholder="Rozmiar" name="tyreSize[]" id="tyreSize" required><input type="text" class="tyreManufacturer form-control" placeholder="Producent" name="tyreManufacturer[]" id="tyreManufacturer" required><input type="text" class="tyreTread form-control" placeholder="Bieżnik" name="tyreTread[]" id="tyreTread" required><input type="text" class="form-control" placeholder="DOT" name="tyreDOT[]" id="tyreDOT"><input type="number" step="0.01" min="0" class="form-control price" placeholder="Cena za sztukę" name="tyrePricePiece[]" id="tyrePricePiece" required><button href="#" class="btn btn-danger btn-block remove_field"><span class="glyphicon glyphicon-remove"></span> Usuń</button><button type="button" class="btn btn-warning btn-block" id="clone"><span class="glyphicon glyphicon-duplicate"></span> Kopiuj</button></div>'; 
var inputHTML2 = '<div id="addProducts2" class="col-md-2 form-group"><input type="text" class="form-control" placeholder="Identyfikator felg" name="alloyID[]" id="alloyID"><input type="text" class="alloySize form-control" placeholder="Rozmiar" name="alloySize[]" id="alloySize" required><input type="text" class="alloyManufacturer form-control" placeholder="Producent" name="alloyManufacturer[]" id="alloyManufacturer" required><input type="text" class="alloyPCD form-control" placeholder="Rozstaw" name="alloyPCD[]" id="alloyPCD" required><input type="text" class="form-control" placeholder="Otwór centrujący" name="alloyHub[]" id="alloyHub"><input type="number" step="0.01" min="0" class="form-control price" placeholder="Cena za komplet" name="alloyPricePiece[]" id="alloyPricePiece" required><button href="#" class="btn btn-danger btn-block remove_field"><i class="fa fa-times"></i> Usuń</button><button type="button" class="btn btn-warning btn-block" id="clone"><span class="glyphicon glyphicon-duplicate"></span> Kopiuj</button></div>'; 

var addInput = function() { 
    $(inputHTML).appendTo('div#products'); 
}; 

var addInput2 = function() { 
    $(inputHTML2).appendTo('div#products'); 
}; 

var cloneInput = function() { 
    $(this).appendTo('div#products'); 
} 

$('button#btnAddProduct').click(addInput); 
$('button#btnAddProduct2').click(addInput2); 


$(document).on('click', '.remove_field', function(e) { //Once remove button is clicked 
    e.preventDefault(); 
    $(this).parent('div').remove(0); 
    sumPrice(); 
}); 

$(cloneInput).on('click', '#clone', function(e) { 
    e.preventDefault(); 
    $(this).parent('#addProducts').each(function() { 
     $(this).clone().appendTo('div#products').val($(this).val()); 
    }); 
    sumPrice(); 
}); 

$(cloneInput).on('click', '#clone', function(e) { 
    e.preventDefault(); 
    $(this).parent('#addProducts2').each(function() { 
     $(this).clone().appendTo('div#products').val($(this).val()); 
    }); 
    sumPrice(); 
}); 

文件2格 - JavaScript文件,這使得自動完成工作

var ac_config2 = { 
source: "../../libs/orders/autocomplete_products.php", 
select: function(event, ui){ 
    $("#tyreID").val(ui.item.id_product); 
    $("#tyreSize").val(ui.item.Szerokosc+"/"+ui.item.Profil+"R"+ui.item.Srednica); 
    $("#tyreManufacturer").val(ui.item.Producent); 
    $("#tyreTread").val(ui.item.Model); 
    $("#tyreDOT").val(ui.item.DOT); 
    //$("#tyrePricePiece").val(ui.item.client_name); 
    }, 
minLength: 1 
}; 
$("#tyreID").autocomplete(ac_config2); 

如果我添加productbox到HTML文件中自動完成的偉大工程,但在動態生成的div它不是在所有工作。

如何在每個div上重新加載此自動完成文件?或者有另一種方式呢?

+0

嘗試在添加div後運行'.autocomplete()',因爲它正在用'$(「#tyreID」)完成自動完成(ac_config2);' – Justas

+0

@Justas究竟應該在哪裏放這個.autocomplete()? – Jarzebowsky

+0

例如,http://pastebin.com/JdDwe9zG – Justas

回答

0

還有問題1件事。如果我將它設置爲#div id,它會將值始終複製到第一個div,如果是.div類,它會將值複製到所有div。

@Justas?