如何在不提交的情况下获得输入表单值?

时间:2016-07-31 22:52:51

标签: html asp.net ajax asp.net-mvc razor

我想要用户的输入值而不提交任何东西然后我想通过ajax方法作为参数传递给action方法。我尝试了很多方法,但我找不到解决方案。

这是代码

<input type="text" id="task" name="task" value="" />


              @Ajax.ActionLink("ADD TASK", "show_task",new {task=Request["task"]}, new AjaxOptions
{
    HttpMethod = "POST",
    UpdateTargetId = "print",
    InsertionMode = InsertionMode.Replace

})

这是控制器动作方法

  public ActionResult show_task(string task)
        {
            var add_task = new tasks_table();
            add_task.task = task;
            add_task.id = 24;
           add_task.f_id=10;
            add_task.date_oftask=DateTime.Now;

            db.tasks_table.Add(add_task);
            db.SaveChanges();
            var tasks = db.tasks_table.Include(t => t.user_detail);
            return PartialView("render_tasks",tasks);                  

        }

2 个答案:

答案 0 :(得分:0)

由于您需要文本框的当前值,您最好使用自己的javascript代码自行完成ajax调用,而不是依赖Ajax.ActionLink辅助方法。

因此,请将Ajax.ActionLink调用更改为普通操作链接。

<input type="text" id="task" name="task" value="" />
@Html.ActionLink("Add Task","show_task", null, new {id="addTask"})
<div id="print"></div>

现在收听此链接上的click事件,阅读文本框的值并将其发送到您的服务器。您可以使用jQuery $.post方法来执行此操作。在回复回调中,您可以使用从服务器返回的响应更新打印div的内容。

$(function(){

   $("a#addTask").click(function(e){

     e.preventDefault();
     $.post($(this).attr("href"), { task:$("#task").val()},function(res){
        $("#print").html(res);
     });

   });

});

答案 1 :(得分:0)

您可以使用JavaScript focusOut函数将值发送到控制器。 通过focusOut方法,当我们移动到下一个字段时,我们立即获得输入字段中的值。

  $('#task').focusOut(function(){
    Your ajax call method....
 });

希望有所帮助。