I've been attempting to utilize a plugin for select functionality, but I'm running into issues with the CSS not applying when I insert the class within JavaScript:
The plugin I want to use via JavaScript:
$('.search-test').SumoSelect({
search: true,
searchText: 'Please enter the appropriate keywords...',
noMatch: 'Sorry, the data you are looking for is not found, please enter the appropriate keywords, the data you are looking for: "{0}"',
// up: false
});
JavaScript code snippet:
$(document).ready(function() {
var count = 0;
$(document).on('click', '.add', function() {
count++;
var html = '';
html += '<tr>';
html += "<td>"+"<select class='search-test' id='search-test'><option>a</option></select>" + "</td>";
html += '</tr>';
$('tbody').append(html);
});
$(document).on('click', '.remove', function() {
$(this).closest('tr').remove();
});
$('#insert_form').on('submit', function(event) {
var form_data = $(this).serialize();
if (error == '') {
$.ajax({
url: "request/create",
method: "POST",
data: form_data,
success: function(data) {
if (data == 'ok') {
$('#item_table').find('tr:gt(0)').remove();
$('#error').html('<div class="alert alert-success background-success">Success insert the data!</div>');
}
}
});
} else {
$('#error').html('<div class="alert alert-danger background-danger">' + error + '</div>');
}
});
});