Buongiorno programmatori,
Ho un problema con una barra di ricerca, al click su un icona con jquery io voglio che mi appaia la mia barra di ricerca (standard della jquery datatable), tutto bene su desktop ma quando la provo su smartphone al click sull' icona mi apre la barra di ricerca, ma quando clicco sulla barra per scriverci dentro la barra sparisce (probabilmente sotto la datatable).

Qui sotto il codice con quello che ho fatto per far apparire la barra di ricerca e la creazione del tasto per uscire dalla ricerca quando scrivi dentro.
codice:
  var div = document.createElement("div");
            div.id = "div_esc";
            div.textContent = "CHIUDI";
            var exit = document.createElement("button");
            exit.id = "esc";
            var div2 = document.createElement("div");
            div2.id = "div_cerca";
            div2.textContent = "CERCA";


            $("#idCerca").click(function(e) {


                $("#table_length").css("display", "none");
                var search = document.getElementsByClassName("form-control");


                $(search).css("display", "block");
                $("#table_filter").css("display", "block");
                $(search).css("width", "100%");


                var form = document.getElementsByClassName("form-control");


                if (!document.getElementById("div_esc")) {


                    $("#table_filter").append($(div));
                    $(div).append(exit);
                }
                $("#table_filter").click(function(e) {


                    $("#table_filter").css("position", "relative");
                    $("#table_filter").css("left", "-43%");
                    $("#table_filter").css("width", "100%");
                    $("#table_filter").css("top", "-5px"); * /


                    $(div).css("width", "30%");
                    $(div).css("top", "30px");
                    $(div).css("left", "103%");
                    $(exit).css("left", "90%");
                    $("#idBtCredRes").css("width", "25%");
                    $("#idBtCredRes").css("left", "61%");
                    $("#idCredRes").css("top", "3px");
                    // $("#table_length").css("top", "13px");
                    $(form).css("width", "150%");


                });




                $(div).click(function(event) {
                    $(search).val("");
                    $dataTable.search("").draw();
                    location.reload();
                    $("#table_length").css("display", "block");
                    $(search).css("display", "none");
                    $(div).remove();
                });




            });
Fatemi sapere dove sbaglio!