Click here to Skip to main content
15,883,749 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more: , +
hi to all,
Can anybody explain me autocomplete/textbox for searching options.For searching i search values from database table.using if condition and LINQ query in controller.

Here i finished searching functions but i want to make search in autocomplete/textbox.

i'm using visual studio 2013 can explain what kinds of jquery and css and what code to add in controller and views explain me step by step.

Can anyone help for this task.because i tried so many ways but no use can anyone help me for that.
Posted

Pls see this link for auto complete text box


Auto Complete Using jQuery and ASP.NET MVC[^]
 
Share this answer
 
 
Share this answer
 
Comments
JOTHI KUMAR Member 10918227 14-Aug-14 1:37am    
i saw all the videos but not cleared i tired but no use Thanks for reply me
In your view


C#
@model Mvcsibaramhyjiya.Models.nameemail

@{

    ViewBag.Title = "Autocomp";

}

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" temp_href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />

<script src="http://code.jquery.com/jquery-1.9.1.js" temp_src="http://code.jquery.com/jquery-1.9.1.js"></script>

<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js" temp_src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

 

<script>

       $(function () {

    function split(val) {

        return val.split(/,\s*/);

    }

    function extractLast(term) {

        return split(term).pop();

    }

    $("#email").bind("keydown", function (event) {

        if (event.keyCode === $.ui.keyCode.TAB &&$(this).data("autocomplete").menu.active) {

            event.preventDefault();

        }

    })

    $("#email").autocomplete({

        source: function (request, response) {

            //define a function to call your Action (assuming UserController)

            $.ajax({

                url: '/EntryPoint/GetEmailIds', type: "GET", dataType: "json",

                //query will be the param used by your action method

                data: { query: request.term },

                term: extractLast(request.term),

                success: function (data) {

                    response($.map(data, function (item) {

                        return { label: item, value: item };

                    }))

                }

            })

        },

        search: function () {

            // custom minLength

            var term = extractLast(this.value);

            if (term.length < 1) {

                return false;

            }

        },

        focus: function () {

            // prevent value inserted on focus

            return false;

        },

        select: function (event, ui) {

            this.value = ui.item.value;

            return false;

            //if u want to select items in comma separate then

            //                var terms = split(this.value);

            //                // remove the current input

            //                terms.pop();

            //                // add the selected item

            //                terms.push(ui.item.value);

            //                // add placeholder to get the comma-and-space at the end

            //                terms.push("");

            //                this.value = terms.join(", ");

            //                return false;

        }

    });

});

 

</script>

 

@Html.TextBoxFor(m => m.email)



In your control


C#
using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.Mvc;

using Mvcsibaramhyjiya.Models;

 

namespace Mvcsibaramhyjiya.Controllers

{

    public class EntryPointController : Controller

    {

 

        public ActionResult Autocomp()

        {

            return View();

        }

        public ActionResult GetEmailIds(string query)

        {

            query = query.Replace(" ", "");

            if (query.Length > 1)

            {

                int op = query.LastIndexOf(",");

                query = query.Substring(op + 1);

            }

            List<nameemail> obj = new List<nameemail>();

            obj.Add(new nameemail { name = "Ved", email = "Ved@Ved" });

            obj.Add(new nameemail { name = "veda", email = "veda@veda" });

            obj.Add(new nameemail { name = "vedant", email = "vedant@vedant" });

 

            var users = (from u in obj

                         where u.name.Contains(query)

                         select u.email).Distinct().ToArray();

            return Json(users, JsonRequestBehavior.AllowGet);

        }

    }

} </nameemail></nameemail>


In your model class


C#
using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

 

namespace Mvcsibaramhyjiya.Models

{

    public class nameemail

    {

        public string name { get; set; }

        public string email { get; set; }

    }

}
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900