i am working on alpha.dubaiexporters.com. I have two inputs containing Keyword and categories.
i wrote the javascript client validation for the Keyword input so when user enter less than 3 character and clicked on search button,the clientside message will appear saying the character should be more than 3 character.
The issue is that when user select categories and clicked on search button,that javascript message is displaying.It should not be displayed.
how to achieve it?
i have used causesvalidation=false for button click.
<div class="header-search-form">
<div class="header-form-container">
<div class="header-input-container">
<span class="header-input-title">Keyword:</span>
<%--<input type="text" id="header-keyword" name="s"><div class="clearfix"></div>--%>
<input type="text" id="txtkeyword" name="s" runat="server" autocomplete="off">
<%-- <asp:RegularExpressionValidator Display="Dynamic" ControlToValidate = "txtkeyword" ID="RegularExpressionValidator2" ValidationExpression = "^[\s\S]{3,}$" runat="server" ErrorMessage="Minimum 8 characters required."></asp:RegularExpressionValidator>--%>
<div class="clearfix">
</div>
</div>
<div class="header-input-container">
<span class="header-input-title">Category:</span>
<input type="text" id="txtserach" list="browsers" name="myBrowser" runat="server"
autocomplete="off" causesvalidation="false">
<datalist id="browsers">
<option value="Automotive"/>
<option value="Building and Interiors"/>
<option value="Food, Kitchen and Hotel Supplies"/>
<option value="Industrial and Machinery"/>
<option value="Consumer and Household"/>
<option value="Medical and Healthcare"/>
<option value="Printing , Packaging and Plastic"/>
<option value="IT / Telecom / Electronics"/>
<option value="Oil and Gas"/>
<option value="Power and Energy"/>
</datalist>
<div class="clearfix">
</div>
</div>
<%-- <input class="dt-header-search-submit dt-button dt-button-danger" type="button" value="Search" style="top:1px;width:225px;" runat="server" onserverclick="doit">--%>
<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();" UseSubmitBehaviour="false" CausesValidation="false" />
</div>
</div>
javascript:
<script type="text/javascript">
function checkLength() {
var textbox = document.getElementById('<%=txtkeyword.ClientID%>');
if (textbox.value.length < 3) {
alert("The entered input should be 3 or more than 3 characters");
return false;
}
}
</script>