Applying jquery-chosen to select input in dialog modal looks badly

Hello,
In laravel 5.8 / Bootstrap v4.1.2 (/ jquery jQuery v3.3.1 application I use Chosen, Version 1.8.7 and I need to open dialog modal
with several rows and text / select inputs. Last select a of items and I want to make chosen, as it search search functionality.
I do like:

    var href = '/admin/show-todo-page';
    $.ajax(
        {
            type: "GET",
            dataType: "json",
            url: href,
            success: function (response) {
                $("#div_show_todo_page_modal").modal({
                    "backdrop": "static",
                    "keyboard": true,
                    "show": true
                });
                $('#div_show_todo_page_content').html(response.html)

                $(".chosen_select_box").chosen({
                    disable_search_threshold: 10,
                    no_results_text: "Nothing found!",
                    allow_single_deselect: true,
                });

response.html has code like:

<form role="form" autocomplete="off">

	<div class="row entry input-group-append m-0 p-0" style="width: 100%;">

		<div class=" col-12 p-1">
			<input type="hidden" id="todo_id_0" name="todo_id_0" value="1" class="todo_editable_field todo_editable_field_id">
			<input type="hidden" id="todo_modified_0" name="todo_modified_0" value="" class="todo_editable_field
							todo_editable_field_modified">
			<input class="form-control todo_editable_field todo_editable_field_text editable_field"
			       value="Write user's on using frontend application part lorem  ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod  tempor incididunt ut."
			       id="todo_text_0" name="todo_text_0" type="text" maxlength="255" autocomplete="off" placeholder="Enter new todo task"
			       onchange="javascript:backendFooter.todoOnChange(this); ">
		</div>

		<div class=" col-3 p-1 m-0 mb-4">
			<select class="form-control todo_editable_field editable_field" id="todo_priority_0" name="todo_priority_0" data-placeholder=" -Select Is Featured- "
			        onchange="javascript:backendFooter.todoOnChange(this); ">
				<option value="" label=" -Select Priority- "></option>
				<option value="1">No</option>
				<option value="2">Low</option>
				<option value="3">Normal</option>
				<option value="4" selected="">High</option>
				<option value="5">Urgent</option>
				<option value="6">Immediate</option>
			</select>
		</div>
		<div class=" col-3 p-1">
			<select class="form-control todo_editable_field todo_editable_field_completed editable_field" id="todo_completed_0" name="todo_completed_0"
			        data-placeholder=" -Select Is Featured- " onchange="javascript:backendFooter.todoOnChange(this); ">
				<option value="" label=" -Select Completed- "></option>
				<option value="1">Completed</option>
				<option value="0" selected="">Opened</option>
			</select>
		</div>
		<div class=" col-5 p-1">
			<select class="form-control chosen_select_box todo_editable_field todo_editable_field_foruserid editable_field" id="todo_foruserid_0" name="todo_foruserid_0"
			        data-placeholder=" -Select User- " onchange="javascript:backendFooter.todoOnChange(this); " style="display: none;">
				<option value="" label=" -Select User- "></option>
						... long list ...
				<option value="5" selected="">Admin ( Soang Soang, admin@mail.com )</option>
			</select>
			<div class="chosen-container chosen-container-single" title="" id="todo_foruserid_0_chosen" style="width: 0px;"><a class="chosen-single chosen-single-with-deselect">
				<span>Admin ( Soang Soang, admin@mail.com )</span><abbr class="search-choice-close"></abbr>
				<div><b></b></div>
			</a>
				<div class="chosen-drop">
					<div class="chosen-search">
						<input class="chosen-search-input" type="text" autocomplete="off">
					</div>
					<ul class="chosen-results"></ul>
				</div>
			</div>
		</div>

		<div class=" col-1 p-1">
															<span class="input-group-append-btn">
								<button class="btn btn-danger todo-btn-add" type="button">
                                    <span class="fa fa-minus"></span>
                                </button>
							</span>
		</div>

	</div>
	<div class="row entry input-group-append m-0 p-0" style="width: 100%;">

		<div class=" col-12 p-1">
			<input type="hidden" id="todo_id_1" name="todo_id_1" value="3" class="todo_editable_field todo_editable_field_id">
			<input type="hidden" id="todo_modified_1" name="todo_modified_1" value="" class="todo_editable_field
							todo_editable_field_modified">
			<input class="form-control todo_editable_field todo_editable_field_text editable_field"
			       value="Prepare list of user's having access to backend part lorem  ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod  tempor incididunt ut..."
			       id="todo_text_1" name="todo_text_1" type="text" maxlength="255" autocomplete="off" placeholder="Enter new todo task"
			       onchange="javascript:backendFooter.todoOnChange(this); ">
		</div>

		<div class=" col-3 p-1 m-0 mb-4">
			<select class="form-control todo_editable_field editable_field" id="todo_priority_1" name="todo_priority_1" data-placeholder=" -Select Is Featured- "
			        onchange="javascript:backendFooter.todoOnChange(this); ">
				<option value="" label=" -Select Priority- "></option>
				<option value="1">No</option>
				<option value="2" selected="">Low</option>
				<option value="3">Normal</option>
				<option value="4">High</option>
				<option value="5">Urgent</option>
				<option value="6">Immediate</option>
			</select>
		</div>
		<div class=" col-3 p-1">
			<select class="form-control todo_editable_field todo_editable_field_completed editable_field" id="todo_completed_1" name="todo_completed_1"
			        data-placeholder=" -Select Is Featured- " onchange="javascript:backendFooter.todoOnChange(this); ">
				<option value="" label=" -Select Completed- "></option>
				<option value="1">Completed</option>
				<option value="0" selected="">Opened</option>
			</select>
		</div>
		<div class=" col-5 p-1">
			<select class="form-control chosen_select_box todo_editable_field todo_editable_field_foruserid editable_field" id="todo_foruserid_1" name="todo_foruserid_1"
			        data-placeholder=" -Select User- " onchange="javascript:backendFooter.todoOnChange(this); " style="display: none;">
				<option value="" label=" -Select User- "></option>
						... long list ...
				<option value="5">Admin ( Soang Soang, admin@mail.com )</option>
			</select>
			<div class="chosen-container chosen-container-single" title="" id="todo_foruserid_1_chosen" style="width: 0px;"><a class="chosen-single chosen-single-with-deselect">
				<span>Martha Lang ( Lang Lang, nilovsergey@ukr.net )</span><abbr class="search-choice-close"></abbr>
				<div><b></b></div>
			</a>
				<div class="chosen-drop">
					<div class="chosen-search">
						<input class="chosen-search-input" type="text" autocomplete="off">
					</div>
					<ul class="chosen-results"></ul>
				</div>
			</div>
		</div>

		<div class=" col-1 p-1">
															<span class="input-group-append-btn">
								<button class="btn btn-danger todo-btn-add" type="button">
                                    <span class="fa fa-minus"></span>
                                </button>
							</span>
		</div>

	</div>
	<div class="row entry input-group-append m-0 p-0" style="width: 100%;">

		<div class=" col-12 p-1">
			<input type="hidden" id="todo_id_2" name="todo_id_2" value="2" class="todo_editable_field todo_editable_field_id">
			<input type="hidden" id="todo_modified_2" name="todo_modified_2" value="" class="todo_editable_field
							todo_editable_field_modified">
			<input class="form-control todo_editable_field todo_editable_field_text editable_field" value="To do line 2..." id="todo_text_2" name="todo_text_2" type="text"
			       maxlength="255" autocomplete="off" placeholder="Enter new todo task" onchange="javascript:backendFooter.todoOnChange(this); ">
		</div>

		<div class=" col-3 p-1 m-0 mb-4">
			<select class="form-control todo_editable_field editable_field" id="todo_priority_2" name="todo_priority_2" data-placeholder=" -Select Is Featured- "
			        onchange="javascript:backendFooter.todoOnChange(this); ">
				<option value="" label=" -Select Priority- "></option>
				<option value="1">No</option>
				<option value="2">Low</option>
				<option value="3" selected="">Normal</option>
				<option value="4">High</option>
				<option value="5">Urgent</option>
				<option value="6">Immediate</option>
			</select>
		</div>
		<div class=" col-3 p-1">
			<select class="form-control todo_editable_field todo_editable_field_completed editable_field" id="todo_completed_2" name="todo_completed_2"
			        data-placeholder=" -Select Is Featured- " onchange="javascript:backendFooter.todoOnChange(this); ">
				<option value="" label=" -Select Completed- "></option>
				<option value="1" selected="">Completed</option>
				<option value="0">Opened</option>
			</select>
		</div>
		<div class=" col-5 p-1">
			<select class="form-control chosen_select_box todo_editable_field todo_editable_field_foruserid editable_field" id="todo_foruserid_2" name="todo_foruserid_2"
			        data-placeholder=" -Select User- " onchange="javascript:backendFooter.todoOnChange(this); " style="display: none;">
				<option value="" label=" -Select User- "></option>
						... long list ...
				<option value="5" selected="">Admin ( Soang Soang, admin@mail.com )</option>
			</select>
			<div class="chosen-container chosen-container-single" title="" id="todo_foruserid_2_chosen" style="width: 0px;"><a class="chosen-single chosen-single-with-deselect">
				<span>Admin ( Soang Soang, admin@mail.com )</span><abbr class="search-choice-close"></abbr>
				<div><b></b></div>
			</a>
				<div class="chosen-drop">
					<div class="chosen-search">
						<input class="chosen-search-input" type="text" autocomplete="off">
					</div>
					<ul class="chosen-results">
						<li class="active-result" data-option-array-index="1">yolanda_konopelski ( Konopelski Konopelski, yolanda.konopelski@homenick.org )</li>
						... long list ...
						<li class="active-result result-selected" data-option-array-index="41">Admin ( Soang Soang, admin@mail.com )</li>
					</ul>
				</div>
			</div>
		</div>

		<div class=" col-1 p-1">
															<span class="input-group-append-btn">
								<button class="btn btn-success todo-btn-add" type="button">
                                    <span class="fa fa-plus"></span>
                                </button>
							</span>
		</div>

	</div>

</form>

where select with id=“todo_foruserid_N” has “chosen_select_box” class and chosen functionality is attached to it.
But on the dialog form a I see very poor select input like


If do not use chosen_select_box class in selection, it is rendered as ordinary select input, but without search functionality?

How to fix it?

Please look at live.
I uploaded this part online by votes.nilov-sergey-demo-apps.tk/admin/dashboard url
You can login into the system under demo creditials : votes_demo@votes.com / 654321
Popup dialog is opened when dashboard page is opened.