Tuesday, 12 August 2014

json, jquery, JavaScript search as per first character and string autocomplete.


<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <script type="text/javascript" src="../js1/jquery-1.7.1.min.js"></script>
<script  type="text/javascript" src="../js1/jquery.ui.core.min.js"></script>
<script  type="text/javascript" src="../js1/jquery.ui.widget.min.js"></script>
<script  type="text/javascript" src="../js1/jquery.ui.position.min.js"></script>
<script  type="text/javascript" src="../js1/jquery.ui.autocomplete.min.js"></script>
    <script type="text/javascript">
        var availableTags;
        var re = "";
          var res ="";
          var res1 = "";
          var r = 0;
     
         function setval1( kk)
         {
             $("#txtHour").val(kk);
         }
           $(function () {
               var cValue = document.getElementById("hdnList").value
               var list = cValue.split(",");
               availableTags = list;
               $("#txtHour").autocomplete({
                   autoFocus: true,
                   source: availableTags,
                   multiple: true,
                   matchContains: true,
                   open: function (event, ui) {
                       //alert("hej" + availableTags);
                   }
               })
               .data("autocomplete")._renderItem = function (ul, item) {
                   res1 = item.value;
                   res = $("#txtHour").val();
                   r1 = res.length;
                   res1 = res1.substring(0, parseInt(r1));
                   res = res.substring(0, parseInt(r1));
                   if (res1 == res) {
                       return $("<li></li>").data("item.autocomplete", item)
                    .append("<a>" + item.value +  "</a>")
                    .appendTo(ul);
                       
                   }
                   return false;
               };
           });
    </script>

     <script language="javascript" type="text/javascript">
         function validateCheckBoxes(source, args) {
             var cValue = document.getElementById("hdnList").value
             var list = cValue.split(",");
             availableTags = list;
             var flag = false;
             for (var i = 0; i < list.length; i++) {
                 if (list[i].toString() == document.getElementById("txtHour").value.toString()) {
                     flag = true;
                 }
             }
             if (flag)
                 args.IsValid = true;
             else
                 args.IsValid = false;
               
         }
    </script>
</head>
<body>
    <form id="form1" runat="server">
 
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
     <asp:HiddenField ID="hdnList" Value="21:AM,2:AM,3:AM,4:AM,5:AM,6:AM,7:AM,8:AM,9:AM,10:AM,11:AM,12:AM,32:AM,22:AM,mumbai,abmumbai,ccmumbai"
        runat="server" />
                  <asp:TextBox ID="txtHour" runat="server" onblur="if (this.value == '') {this.value='Type Hour'}"
                                                            onfocus="if (this.value =='Type Hour') {this.value = ''}" MaxLength="15" Text="Type Hour" ClientIDMode="Static"></asp:TextBox>
<asp:CustomValidator id="CustomValidator1" runat="server" ErrorMessage="Not match City Name"  EnableClientScript="true"
                 ClientValidationFunction="validateCheckBoxes">
                </asp:CustomValidator>
        <asp:Button ID="Button1" runat="server" Text="Button" />
    </div>  <div id="search" ></div>
    </form>
</body>
</html>

No comments:

Post a Comment