Geek Answers Handbook

Jquery Chosen Outline Select a field that has been dynamically added.

Problem:

I am adding Chosen Select dynamically to the page. After clicking the button, I would like to highlight the highlighted box in red. I can do this already for input fields and so by adding a class with CSS below to the corresponding identifier, but the "Selected frame" field never changes.

.redOutlineTextBox {
    border:2px solid #FF0000;
}

I know that you can change the outline color in the Chosen element, because if I add the following CSS when the page loads, all the selected fields will be displayed as expected.

.chosen-container .chosen-single {
    border:2px solid #FF0000;
    box-shadow: 0 0 3px #FFF inset, 0 1px 1px rgba(0, 0, 0, 0.1);
}

The following script sets an example of two dynamically added selection flags and one input window.

What I would like:

, .redOutlineTextBox , .

JSFiddle

, :

"" .

$(".chosen-select").chosen({
    width: "30%",
    search_contains: true,
    no_results_text: "No Results Found",
    max_selected_options: 5,
    inherit_select_classes: true
});

Chosen . .redOutlineTextBox - .

$('.chosen-select').trigger('chosen:updated');
+4
2

, :

$(".chosen-container input").addClass('redOutlineTextBox')

, :

$("input[type='text']").addClass('redOutlineTextBox')
+1

#chosenTest, . - . Chosen , , , :

$("#chosenTest_chosen input").addClass('redOutlineTextBox');
+1

More articles:


All Articles