Geek Answers Handbook

JQuery and AJAX do not work after deployment on server

I have a project that works fine on my local machine, but it doesn’t work after deploying it to the server. If I set breakpoints in javascript, it hit them and went through the code, but does not do what it should (jquery autocomplete). I even made sure that the script files that I need are stored on the server. Is there anything I'm looking at?

Code to run:

<script type="text/javascript"> $(document).ready(function () { $("input.autocomplete").autocomplete({ appendTo: '.container', source: function (request, response) { $.ajax({ url: '/Home/GetUsers', type: "POST", dataType: "json", data: { query: request.term }, success: function (data) { response($.map(data, function (item) { return { label: item, value: item }; })); } }); } }); }) </script>

_Layout.cshtml where jquery is included:

 @Styles.Render("~/Content/css") @Styles.Render("~/Content/themes/base/jquery-ui.css") @Styles.Render("~/Content/themes/base/jquery-ui.autocomplete.css") @Scripts.Render("~/bundles/modernizr") <script type="text/javascript" src="@Url.Content("~/Scripts/jquery.min.js")"></script> <script type="text/javascript" src="@Url.Content("~/Scripts/jquery-ui-1.8.20.js")"></script>
+4
source share
5 answers

I needed to change the url to the one that was running on the server. My last code is as follows:

 <script type="text/javascript"> $(document).ready(function () { $("input.autocomplete").autocomplete({ appendTo: '.container', source: function (request, response) { $.ajax({ url: '/Lookup/Home/GetUsers', type: "POST", dataType: "json", data: { query: request.term }, success: function (data) { response($.map(data, function (item) { return { label: item, value: item }; })); } }); } }); }) </script>
+4
source

I am also facing this problem in my mvc project ....

I solved this problem by following these steps.

1) Put this on the Layout page in the script section

 <script type="text/javascript"> var RootUrl = '@Url.Content("~/")'; </script>

2) add the variable "RootUrl" in ajax url. (it also works with your Js file, which you add "RootUrl" in front of your ajax url)

  url: RootUrl +'Home/GetUsers';

He works as a prefect for me, but whoever has a different solution, then plz post me

+4
source

Although this is a very old question, but it may help someone in the future.

If his .asmx page was designed, we must specify the HTTP verbs in web.config to access it.

It will work locally, but not after deployment to IIS.

EX:

  <webServices> <protocols> <add name="HttpGet"/> <add name="HttpPost"/> </protocols> </webServices>

Thanks Pooja G

+1
source

Having the same problem, the ajax call does not work after deployment on the server. The Amol method is good for deployment, but it does not work on the local development computer. You must remove the "~" when debugging in local development.

After some research, you can find the best solution in any environment. In your ajax method, change the URL parameter as follows:

  url: "@Url.Action("GetUsers", "Home")"
0
source

In your case, the server is not supported for Url,

Remove '/Home/GetUsers'

and use url: "@Url.Action("Action", "Controller")"

0
source

More articles:


All Articles