按钮单击事件未将输入字符串传递给MVC控制器方法

Question

I have the following view HTML

<input id="txt" type="text">
<button class="btn btn-primary" id="button">Upload</button>

and the script

<script type="text/javascript">
    $("#button").click(function () {
        var txtVal = $("#txt").val();
        window.location = "@Url.Action("Upload", "Tools")" + "/" + txtVal;
    });
</script>

My controller method is

[AllowAnonymous]
public async Task<ActionResult> Upload(string fileName)
{
    string path = @"C:\GambitTests\blue-g-logo.jpg";
    // Do stuff.
    return RedirectToAction("Index", "Tools");
}

this method fires but I am not getting the text from the input box and fileName is null .

What am I doing wrong here how can I pass the text from the input control to this method?

Thanks for your time.

Answer 1

The default syntax for passing parameters in the query string is ?paramName=value, so in your case you'd need to change your JavaScript to:

window.location = "@Url.Action("Upload", "Tools")" + "?fileName=" + txtVal;

Alternatively, change the parameter name to id and it'll work as you expect (courtesy of the default RouteConfig).