JavaScript not firing in C# MVC4

Question

I have the following code in my view :

    <script type="text/javascript">
    function OnCancelClick(e)
    {
        var jobId = e;
        var flag = confirm('You are about to cancel job : ' + jobId + '. Are you sure you want to cancel this job?');
        if (flag) {
            $.ajax({
                url: '/job/CancelJob',
                type: 'POST',
                data: { jobId: jobId },
                dataType: 'html',
                success: function (result) { alert('Job ' + jobId + ' was cancelled.'); document.location = "@Url.Action("Index", "Job")"; },
                error: function () { alert('Something went wrong. Check the log for more information.'); }
        });
    }
    return false;
    }
</script>

In my view I also have :

<input type="submit" id="cancelButton" value="Cancel" onclick="javascript: return OnCancelClick(@Model.Id);" />

In my controller I have :

[HttpPost]
        public ActionResult CancelJob(int jobId)
        {
            try
            {
                logger.LogInfo(string.Format("<start> Cancel-button clicked for job : {0}", jobId), jobId);

                JobCommandService.ChangeStatus(jobId, 6);

                logger.LogInfo(string.Format("<end> Cancel-button clicked for job : {0}", jobId), jobId);

                return RedirectToAction("Index", "Job");
            }
            catch (Exception ex)
            {
                logger.LogError(ex.Message, ex, jobId);
                Response.StatusCode = (int)HttpStatusCode.InternalServerError;
                return Json(new { Success = false, Message = ex.Message });
            }
        }

When I run this in my VS2012 it works just fine. When I deploy it to the server, I'm getting the message that something went wrong. In my logging there is no trace of the button being clicked.

Make sure that all your scripts get included properly on the production server. Besides that, what error message do you get? — Rob
– Rob, Commented Feb 6, 2014 at 7:44
I'm not getting any message. The only message I get, is "'Something went wrong. Check the log for more information." But there is nothing in my log. Not even a trace of the button being clicked. — Bart Schelkens
– Bart Schelkens, Commented Feb 6, 2014 at 7:46
When I look at the source of my page, the script is in there. So that should be fine. — Bart Schelkens
– Bart Schelkens, Commented Feb 6, 2014 at 7:49
What do you see in the network tab of Firefox/Chrome?. Could it be the site deployed with a root url like //myserver/myapp/ and the ajax post being sent to //myserver/job/CancelJob? — Daniel J.G.
– Daniel J.G., Commented Feb 6, 2014 at 8:05
Change error: function() to error: function(x,t,e) and inspect x.responseText — Alex
– Alex, Commented Feb 6, 2014 at 8:22

Community · Accepted Answer · 2017-05-23 10:27:58Z

1

As per your comment, when deployed your app is installed in accindigoapps.blabla.lok/jobmonitor.

However your script has the url hardcoded as url: '/job/CancelJob'. That will mean:

when you are debugging from VS your script will work because the request is being sent to a url like http://localhost:XXX/job/CancelJob
however in production, the request will be sent to http://accindigoapps.blabla.lok/job/CancelJob, missing the jobmonitor part.

You need a way to inform your JS code about the base url of your application:

You could generate the Url in a Razor view using Url.Action("CancelJob","job") and pass that Url into your javascript code.
Another option would be to use Url.Content("~/") in some javascript of your base layout. That helper Url.Content("~/") will return only your application folder, / in your dev environment and /jobmonitor/ when deployed. That way you will have your app root-relative url available to any script, so you can use it to build root-relative urls as you were doing in your script:
```
<script>
    var myApp = {};
    myApp.BaseUrl = '@Url.Content("~/")';
</script>

//Some other script like yours would be able to keep using root-relative urls as: 
$.ajax({
    url: myApp.BaseUrl + 'job/CancelJob',
    ...
```

If you prefer to generate full urls, you could follow a similar approach. Have a look at this question

Hope it helps!

edited May 23, 2017 at 10:27

CommunityBot

11 silver badge

answered Feb 6, 2014 at 9:48

Daniel J.G.

35.2k9 gold badges117 silver badges115 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Sergey Over a year ago

I use something like this - url: "@Url.Action("YourView", "YourController")"

Daniel J.G. Over a year ago

@Sergey That's one of the options I mentioned :). It requires you to generate in razor the url needed by the JS code, and pass that url to your JS code. The other option allows to generate the base url in a global JS object and use it on the scripts when building urls. You can use whatever suits you best! (For example, if you don't have script tags in your views, you will prefer the second one)

Collectives™ on Stack Overflow

JavaScript not firing in C# MVC4

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related