MVC JQuery URL.Action question

Any idea why this would not be working.   I have the following view file below.   This does not work and get into the GetProducts action in my HomeController and auto complete is not working.  This is the Index view in the Home Controller.   If I hit localhost then "Home/GetProducts?term=k" for example this works fine.   If I place in the 2nd code snippet the auto complete also works fine.

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <link href="../../Content/jquery-ui-1.10.0.custom.css" rel="stylesheet" type="text/css" />
    <script src="../../Scripts/jquery-1.9.0.js" type="text/javascript"></script>
    <script src="../../Scripts/jquery-ui-1.10.0.custom.js" type="text/javascript"></script>
    <script type="text/javascript">
            $(function () {
                $("#products").autocomplete({
                    source: '<%=Url.Action("GetProducts") %>',
                    minLength: 2
                });
            });
    </script>

</head>
<body>
    <label for="products">Find:</label>
    <input type="text" id="products" />
</body>
</html>

Open in new window


@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <link href="../../Content/jquery-ui-1.10.0.custom.css" rel="stylesheet" type="text/css" />
    <script src="../../Scripts/jquery-1.9.0.js" type="text/javascript"></script>
    <script src="../../Scripts/jquery-ui-1.10.0.custom.js" type="text/javascript"></script>
    <script>
        $(function () {
            var availableTags = [
			"ActionScript",
			"AppleScript",
			"Asp",
			"BASIC",
			"C",
			"C++",
			"Clojure",
			"COBOL",
			"ColdFusion",
			"Erlang",
			"Fortran",
			"Groovy",
			"Haskell",
			"Java",
			"JavaScript",
			"Lisp",
			"Perl",
			"PHP",
			"Python",
			"Ruby",
			"Scala",
			"Scheme"
		];
            $("#products").autocomplete({
                source: availableTags
            });
        });
	</script>
</head>
<body>
    <label for="products">Find:</label>
    <input type="text" id="products" />
</body>
</html>

Open in new window

sbornstein2Asked:
Who is Participating?
 
leakim971Connect With a Mentor PluritechnicianCommented:
work fine for me :
<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Index</title>
<link href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/themes/overcast/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js" type="text/javascript"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {
        $('#customers').autocomplete({
            source: '<%= Url.Action("GetCustomers") %>',
            minLength: 2
        });
    });
</script>
</head>
<body>
    <div>
        <label for="customers">Find:</label>
        <input type="text" id="customers" />        
    </div>
</body>
</html>

Open in new window


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MvcApplication3.Models;

namespace MvcApplication3.Controllers
{
    public class HomeController : Controller
    {
        //
        // GET: /Home/

        public ActionResult Index()
        {
            return View();
        }

        public JsonResult GetCustomers(string term)
        {
            AdventureWorksLT2012_DataEntities db = new AdventureWorksLT2012_DataEntities();
            var customers = from cust in db.Customer.Where(c => c.LastName.StartsWith(term))
                            select cust.LastName;
            customers = customers.Distinct();
            return Json(customers, JsonRequestBehavior.AllowGet);
        }
    }
}

Open in new window

0
 
sbornstein2Author Commented:
I have a break point just to see if I am even getting into the GetProducts but nothing is getting to it.
0
Cloud Class® Course: Amazon Web Services - Basic

Are you thinking about creating an Amazon Web Services account for your business? Not sure where to start? In this course you’ll get an overview of the history of AWS and take a tour of their user interface.

 
leakim971PluritechnicianCommented:
could you provide a link to see your page?
Try the two jQuery plugins I provided with the CSS link (don't download them), just use the direct links to googleapis
<link href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/themes/overcast/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js" type="text/javascript"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.js" type="text/javascript"></script>

Open in new window

0
 
sbornstein2Author Commented:
Still does not work, I also tried the http links instead.  It seems like I am not even getting into the GetProducts.  Here is exactly what I have.  I created a table called Products using Entity Framework.

View:
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <link href="../../Content/jquery-ui-1.10.0.custom.css" rel="stylesheet" type="text/css" />
    <script src="../../Scripts/jquery-1.9.0.js" type="text/javascript"></script>
    <script src="../../Scripts/jquery-ui-1.10.0.custom.js" type="text/javascript"></script>

    <script type="text/javascript">
            $(function () {
                $('#products').autocomplete({
                    source: '<%= Url.Action("GetProducts") %>',
                    minLength: 2
                });
            });
    </script>

</head>
<body>
    <label for="products">Find:</label>
    <input type="text" id="products" />
</body>
</html>

Open in new window


HomeController:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using TestProj.Models;

namespace TestProj.Controllers
{
    public class HomeController : Controller
    {
        //
        // GET: /Home/
        public ActionResult Index()
        {
            return View();
        }

        public JsonResult GetProducts(string term)
        {
            SportsStoreEntities db = new SportsStoreEntities();
            var products = from prod in db.Products.Where(p => p.Name.StartsWith(term))
                            select prod.Name;
            products = products.Distinct();
            return Json(products, JsonRequestBehavior.AllowGet);
        }

    }
}

Open in new window


I even tried just passing an array or single string value to the return Json but the problem does not seem there.
0
 
leakim971PluritechnicianCommented:
could you provide a link to see your page?
0
 
sbornstein2Author Commented:
thanks
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.