[2 days left] What’s wrong with your cloud strategy? Learn why multicloud solutions matter with Nimble Storage.Register Now

x
?
Solved

MVC JQuery URL.Action question

Posted on 2013-01-28
7
Medium Priority
?
382 Views
Last Modified: 2013-02-04
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

0
Comment
Question by:sbornstein2
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 3
7 Comments
 
LVL 82

Accepted Solution

by:
leakim971 earned 800 total points
ID: 38832747
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
 

Author Comment

by:sbornstein2
ID: 38832927
I have a break point just to see if I am even getting into the GetProducts but nothing is getting to it.
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 82

Expert Comment

by:leakim971
ID: 38832939
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
 

Author Comment

by:sbornstein2
ID: 38835927
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
 
LVL 82

Expert Comment

by:leakim971
ID: 38836135
could you provide a link to see your page?
0
 

Author Closing Comment

by:sbornstein2
ID: 38851683
thanks
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer…
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

649 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question