I want to call a controller method from Javascript. I used the following code:
<input type="submit" name="button" value="Run" onclick="RunEXE"/>
I want to write the javascript to call the below function in controller.
public void Run(UserProgram userProgram)
{
SaveAndCompile(userProgram);
}
Can anyone provide me the javascript to call the function.
You can't just call a function like that. What you need to understand is that javascript runs on the client, and your function is on the server. What you need to do is make a request to the server, just like you would when loading a page, so for this you need an Action (make sure it is a POST action as we will be "posting" the request). This action can be as short as just calling the function you need:
[HttpPost]
public ActionResult RunAction(string option1)
{
//if needed, you can use the "option1" value to determine the UserProgram to pass
UserProgram userProgram = new UserProgram();
Run(userProgram);
//you can return a JSON reuslt that you can evaluate back at the client
return Json(new { @Success = true, @MyString = "a string" });
}
Then you want to use ajax to call the function from the client (javascript), for this I would recommend JQuery as it makes things much easier using post:
$.post('@Url.Action("RunAction", "MyController")',
{
option1: "some optional value"
},
function (data) {
alert("success!");
//here you have access to your JSON result via data, for example:
//data.Success = true
//data.MyString = "a string"
}
);
UserProgram should be, if you don't need it then remove itYou can use Ajax here. jQuery ajax is very flexible and easy
Then
prepare your data to post
var myData={};// this is similar to your C# class UserProgram structure
myData.property1=value1; //etc
jQuery.ajax{(
url: '/controllerName/Run/', // or '@Url.Action("Run", "ControllerName")'
type: 'post',
data:{userProgram:myData},
success: function (data) { jQuery('#container').html(data); }
)};
or shorthand
$.post('/controllerName/Run/',{userProgram:myData}, function(result){});
Html.TextboxFor(m => m.FileName,{@id='txtFileName'}) and in jQuery $('#txtFileName').val() to get file nameTry this using JQuery:
function RunEXE() {
$.post('@Url.Action("Run", "ControllerName")',
{
userProgram: "WhatEver" //The parameter you want to pass to your action
},
function (data) {
//Code for what to do with the result.
})
};
.js file? @Url.Action will not work :)Use the Normal AJAX method as::
On the Server side(i.e. In Controller) you are using some class/Model like 'UserProgram'
I don't know what are the Properties in that class but I have assumed it as::
public class UserProgram
{
public long ID{get;set}
public string Name{get;set}
}
this Model fields should be based on your Model that you have to pass into your AJAX code as::
var myData={ID:1,Name:"RJ"};
$.ajax{(
type: 'post',
url: '/controllerName/Run'
data:{UserProgram:myData},
success: function (data) {
$('#container').empty();
$('#container').html(data);
}
)};
To get the full description on using ajax calls in ASP.net MVC using jQuery please refer to:
http://bobcravens.com/2009/11/ajax-calls-to-asp-net-mvc-action-methods-using-jquery/
