AJAX запрос mysql

127
25 апреля 2019, 04:00

Подскажите пожалуйста, есть ajax запрос данных из таблицы mysql:

<script>
       $(document).ready( function() {
            $('#client').keyup(function(){ /* client - id в инпуте куда мы вносим значение*/
                if($(this).val().length > 0){
                    $.ajax({
                        type: "POST",
                        url:"/autocomplete/auto_cl_task.php",
                        dataType: 'json',
                        data: {'choose' : $(this).val()},
                        success: function(res){
                            console.log(res);
                            var content = '';
                            $.each(res, function(i, item){
                                content += "<div class='ott_cl_task' data-id='"+res[i].id+"'>"+res[i].name+" "+res[i].lastname+"</div>";
                                $("#cl_task").css({"margin-top": "29px", "background": "#fff", "position": "absolute", "margin-left": "-20px", "width": "170px", "border": "2px dashed #e0e0e0", "text-align": "left", "padding": "5px", "font-size": "15px"});/*cl_task - id спана куда будут выводится результаты*/
                            });
                            $('.auto_cl_task').html(''); /* auto_cl_task - класс спана куда будут выводится результаты*/
                            $('.auto_cl_task').append(content); /* auto_cl_task - класс спана куда будут выводится результаты*/
                        }
                    });
                }else{
                    $('.auto_cl_task').html(''); /* auto_cl_task - класс спана куда будут выводится результаты*/
                }
            });
            $('body').on( 'click', '.ott_cl_task', function(){
                var id = $(this).attr('data-id');
                $('.user_id').val(id);
                var txt = $(this).text();
                $('#client').val(txt); /* client - id в инпуте куда мы вносим значение*/
                $('.auto_cl_task').html(''); /* auto_cl_task - класс спана куда будут выводится результаты*/
$("#cl_task").css({"display": "none"}); /*cl_task - id спана куда будут выводится результаты*/
            });
        } );
 </script>

Сейчас сделано так что когда происходит поиск span (куда выводится информация) изменяет свой стиль на данный:

$("#cl_task").css({"margin-top": "29px", "background": "#fff", "position": "absolute", "margin-left": "-20px", "width": "170px", "border": "2px dashed #e0e0e0", "text-align": "left", "padding": "5px", "font-size": "15px"});

Но когда мы выбрали результат из поиска, стиль данного span (который приведен выше) остается. Как его убрать после нажатия на данные из поиска? Сам span:

<span class='auto_cl_task' id='cl_task'></span>
Answer 1
<style>
.cl_task_temp_class {
  margin-top: 29px;
  background: #fff;
  position: absolute;
  ...
</style>
success: function(res){
  ...
  $("#cl_task").addClass("cl_task_temp_class"); // вместо $("#cl_task").css(...
$('body').on( 'click', '.ott_cl_task', function(){
  ...
  $("#cl_task").removeClass("cl_task_temp_class"); // вместо $("#cl_task").css(...

удалить класс если нажали вне этого span

$(document).on('click', function(e) {
  if (e.target.id != "cl_task" && !$(e.target).closest("#cl_task").length) {
    $("#cl_task").removeClass("cl_task_temp_class");
  }
});
READ ALSO
Получение wav звука из созданной dll библиотеки

Получение wav звука из созданной dll библиотеки

Необходимо получить звук из созданной библиотеки

174
Не работает стандартная тригонометрия

Не работает стандартная тригонометрия

Задаю двумя точками направлениеОт первой точки влево и вправо на 90 градусов от направления нужно прорисовать ещё по одной точке (на заданном...

152
Реализация стандартных кнопок и поведения

Реализация стандартных кнопок и поведения

Так как Window имеет WindowStyle="None" необходимо воссоздать стандартные кнопки:

142