"If at first you don't succeed; call it version 1.0" :-Unknown

Pages

Thursday, July 22, 2010

Auto complete in asp.net c# using jquery with sample

 hi friends,
previously i show how to do auto complete in .net using ajax.2day I'm using j query instead of Ajax.Just sample idea :)
demo

documentation

For this u need 2 js file( jquery-1.3.2.js, jquery.autocomplete.js ) 'n 1 css(jquery.autocomplete.css and an image( throbber.gif ) all are important.Create a normal textbox and paste this code just after closing the div
     <script type="text/javascript">
        $(document).ready(function() {
            $("#txtAutoComplete").autocomplete("AutoCompleteHandler.ashx", {
                width: 200,
                scroll: false
            });
        });
</script>

Note:
txtAutoComplete:- is my textbox name
AutoCompleteHandler.ashx:- is my generic handler file name

actually the code is sending the value to jquery.
on the generic handler we get the value by query string and their i use like query to my database and store all my relevant data in string array.and taking the count of data if their is no data i show a flag. code of that

public string[] items;
    public void ProcessRequest(HttpContext context)
    {
        string strData = string.Empty;
         string s=string.Empty;
        if (context.Request.QueryString["q"] != null)
        {
            string q = context.Request.QueryString["q"].Trim();
            string limit = context.Request.QueryString["limit"];

            string sql = "Select * from mst_tble Where strcountry like '"+q+"%'";
            SqlDataAdapter da = new SqlDataAdapter(sql, "Password=****;User ID=sa;Initial Catalog=country;Data Source=localhost");
            DataTable dt = new DataTable();
            da.Fill(dt);
            // items = new string[dt.Rows.Count];
            items=new string[dt.Rows.Count ==0?1:dt.Rows.Count];
            int i = 0;
            if(dt.Rows.Count==0)
            {
                    items.SetValue("No Match Found", i);
                    context.Response.ContentType = "text/plain";
                    context.Response.Write(Environment.NewLine);
                    context.Response.Write(items[i].ToString()); 
            }
            else
            {  
                foreach (DataRow dr in dt.Rows)
                {
                    items.SetValue(dr["strcountry"].ToString(), i);
                    context.Response.ContentType = "text/plain";
                    context.Response.Write(Environment.NewLine);
                    context.Response.Write(items[i].ToString());
                    i++;
                }
            }
        }

sample 
 

Hope it help u some times.Have a nice day... 'N happy Coding :)

jQuery Cookbook: Solutions & Examples for jQuery Developers (Animal Guide)jQuery in Action, Second EditionjQuery UI 1.7: The User Interface Library for jQuery 

Friday, July 16, 2010

word filtering or restrict spam words input through javascript

Hi friendz,
 2day i'm showing u a simple JavaScript magic.Some times in our website user filled are filling by some abuse words.we can overcome this by filtering the words by javascript.


Demo



Functioning

i'm saving all the spam word in an array and  on onkey() sending the word to function and their i split the word from the array and match with word.

code

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript">

function spamcheck(what,spamstr)
{
    var a=document.getElementById(what).value;
    a = a.toUpperCase();
    var temp = new Array();
    temp = spamstr.split(':');
    document.getElementById("spamkey").innerHTML="";
    var index=0;
    while(index<temp.length)
    {
        if(a.search(temp[index]) > -1)
        {
            document.getElementById("spamkey").innerHTML="Remove the spam keyword "+temp[index]+" from your content";
            return false;
        }
        index++;   
    }
    return true;
}

</script>
</head>
<body>
<textarea name="message" id="message" style="width:250px; height:100px;" onkeyup="spamcheck('message','TO CLAIM YOUR PRIZE:FUCK:LUCKY DRAW:MOBILE DRAW:YOUR MOBILE WON:GAY:LOTTERY:ONGOING COCA COLA:DRAW :MOBILAZATION:BT9003@HOTMAIL.COM:DOLLARS:USD:WORLD AID:AND CLAIM:CLAIM YOUR WINNING AMOUNT:POUNDS:YOU HAVE WON:GBP:SEND YOUR NAME AND YOUR ADDRESS:ONGOING SHELL:CEL   L DRAW:CASH OF :CELL DRAW:HAS BEEN AWARDED:CO.UK: UK : EURO:PUOND:FOR CLARIFICATION AND CLAIM: INTL DRAW :WINNING AMOUNT:WINNING:.CO.UK:BRITISH: POUN:UK CHEVRON:UKCHEVRON:DRAW,:YOUR WINNING:DRAW.:£:WRDPRMTN148:FROM SHELL:FRM SHELL:EIM_DRAW:COCACOLA:VIA E-MAIL:HAVE WON: PRIZE :CONTACT DR: WON :URGENTLY FOR DECLARATION: SPA :MARCOPOLO:UR GOODS: GOODS : SHIP :BINGO:LIVETMOBILE:T-MOBILE:LOTE:INTL:LUCKY LOTE:CONSIGNMENT:MOBILE LOTO:G.B P:CLAIM:(ORANGE):INT’L:Dr. PAUL:GB:ORANGE TELECOM:OIL&GAS COMPANY UK:T-MOBELI:ORANGE: LUCKY :YOU HAVE GOT:WORLD BANK:HENIKEN:FOR MORE INFORMATION:HEINEK:HOTMAIL:YOU HAVE BEEN APPROVED:LYNDA:JACKPORT:YOU HAVE BEEN AWARDED:WWW.ATCR.BIZ:SPDCUK');" ></textarea>

<div id="spamkey" style="font-size:13xp; font-weight:bold; color:#FF0000;"></div>
</body>
</html>




Have a nice day... 'N happy Coding :)

Wednesday, July 14, 2010

Prevent Users from Selecting Weekends using jQuery UI DatePicker

 Hi friends,
Not known to many, jQuery UI DatePicker has a built-in function called 'noWeekends', that prevents users from selecting weekends, by disabling them.

Here’s how to use it

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <link rel="Stylesheet" type="text/css" href="http://ajax.googleapis.
com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" />
    <script  type="text/javascript" src="http://ajax.microsoft.com/ajax/
jquery/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jqueryui/1.8.2/jquery-ui.min.js"></script>


    <script type="text/javascript">
        $(function() {
            $("#datepic").datepicker(
            { beforeShowDay: $.datepicker.noWeekends }
            );
        });
    </script>
</head>
<body>
  <input id="datepic"/>
</body>
</html>
 
it's very use full 'n simple ,i hope it helps u some way 
 
Have a nice day... 'N happy Coding :)

 jQuery in Action, Second EditionjQuery Cookbook: Solutions & Examples for jQuery Developers (Animal Guide)Learning jQuery 1.3