Not getting the clientside message after clicking on Search button

Question

I am working on alpha.dubaiexporters.com. There is a search Panel containing two inputs Keyword and Categories. I wanted to validate Keyword part.

If the user entered less than three characters and clicked on Search button then the clientside message should be displayed saying the entered input should be more than 3 characters. I am not getting the clientside message.

The following is my code:

<input type="text" id="txtkeyword" name="s" runat="server" autocomplete="off">
<asp:Button ID="Search" class="dt-header-search-submit dt-button dt-button-danger" style="top:0px;width:226px;height:70px;" Text="Search" runat="server" onclick="doit" OnClientClick="return checkLength();" />

Below is my Javascript:

<script type="text/javascript">
        function checkLength() {
            var textbox = document.getElementById("txtkeyword");
            if (textbox.value.length < 3) {
                alert("The entered input should be 3 or more than 3 characters");
                return false;
            }
        }
    </script>

Code behind:

protected void doit(object sender, EventArgs e)
    {
        if (!string.IsNullOrEmpty(txtkeyword.Value))
        {
            try
            {

                String mainsearch1 = null;            
                mainsearch1 = txtkeyword.Value.Trim();
                if (mainsearch1.Length > 2)
                {
                    Response.Redirect("searchmain.aspx?mainsearch=" + mainsearch1 + "&querylevel=1");
                }


            }
            catch (Exception ex)
            {
            }
        }

        else if (!string.IsNullOrEmpty(txtserach.Value))
        {
            try
            {

                String cat = null;               
                cat = txtserach.Value.Trim();
                if (cat.Length > 2)
                {                 
                    Response.Redirect("searchcat1.aspx?cat=" + cat);
                }


            }
            catch (Exception ex)
            {
            }



        }


    }
}

I don't know why its not calling javascript function.

Expected output: I want this alert message when user enter less than three letters in txtkeyword textbox.

Answer 1

It works fine, have a try please :)

function checkLength() {
debugger;
var textbox =$get("<%=txtkeyword.ClientID%>"); //document.getElementById("<%=txtkeyword.ClientID%>")
if (textbox.value.length < 3) {
alert("The entered input should be 3 or more than 3 characters");
return false;
}
}

Note: you cant access a control directly when runat="server" is there