用户按Enter / Return键时调用服务器端操作

时间:2012-12-11 18:00:48

标签: c# javascript jquery asp.net-mvc asp.net-mvc-4

更新

由于我很快得到了这个问题非常有用的答案,我已经重新考虑了这个问题。我想我需要将其分解为两个小要求,所以我正在更新问题。

在我的ASP.NET MVC 4应用程序中,当用户在焦点位于特定文本框中时按下键盘上的回车键时,我需要这样做:

场景1:必须调用适当的服务器端操作。如果用户在光标位于不同的文本框中时按下回车键,则必须调用另一个操作。

场景2:如果用户在当前页面的某个表单中的焦点位于任意文本框中时按下了键盘上的Enter键,则表单必须返回所有表单数据(HttpPost)到控制器上的操作,如<form>的操作属性中所指定。

如何完成这两种情况?

4 个答案:

答案 0 :(得分:3)

$('#idOfTextbox').keypress(function(e) {
    if(e.which == 13) {
        $.ajax({
        //.. Your values go here...
        });
    }
});

如果要拦截提交的表单,可以使用ajaxForm plugin。这样,您可以在页面上有多个表单,并且在提交表单时,它将对表单的action属性中指定的action方法进行AJAX调用。然后,您将能够在ajax调用的“成功”回调中处理响应。

答案 1 :(得分:1)

你可以使用javascript或简单地将每个输入放在不同的<form>中,里面有一个按钮类型=“提交”。

答案 2 :(得分:1)

element.onkeydown = function(event) {
    //do something on keydown (enter is keyCode === 13)
};

答案 3 :(得分:1)

您可以按照以下方式执行此操作:

$('#idOfTextbox').keypress(function(e) {
    if(e.which == 13) {
       $.ajax({

       url: './savedata',//Your method name, that is to be called
       type: 'POST',
       contentType: 'application/json',//Type of data you want to post
       data: JSON.stringify({ obj: sampleobject }),//object of post-object i.e. data being posted
       success: function(result) {
       //Logic to handle success
        }  
       error: function(){}//Handle error here  
     }
}); 

我给出了一个示例来调用一个方法,该方法位于您当前正在使用其视图的同一个控制器上。