MVC5从视图中检索数据 [英] MVC5 Retreive data from view

问题描述

我刚开始使用MVC，做了很多WebForms，所以不是菜鸟。

到目前为止，MVC相当直观，而且我很快就会抓住，但我很快卡在一个关键区域;



我已经设置了 bootstrap-tagsinput [ ^ ]控制在我的视图页面上，我可以在JQuery函数中收集数据。



我已经设置了一个ViewModel类，可以将值传递给它们并显示它们在控件上，我仍然坚持如何将这些值返回给控制器??



这是我的查看代码;

 @ model JaxCoderV20.Models.PostViewModel 
 
 @ {
 ViewBag.Title =Home Page; 
} 
 
 @using（Ajax.BeginForm（计算，主页，
新AjaxOptions {UpdateTargetId =divInterestDeatils}））
 {
 <   div     class   =  page-body >  
 <   div     class   = 行 >  
 <   div     class   =   col-lg-6 col-sm-6 col-xs-12  >  
 <   div     class   =  with with-header >  
  <   div     class   =  header bordered-darkorange > 引导标签输入<   / div  >  
 <   div  >  
 <   input    类型  =  text    value   =  @ Html.Encode（Model.TestStringData ）    data-role   =  tagsinput   占位符  = 添加标签    /  >  
 <   / div  >  
 <   div     class   =  form-group >  
 <   div     class   =  col-md-offset-2 col-md-10 >  
 <  输入   类型  = 提交   值  = < span class =code-keyword>创建    class   =  btn btn-default    /  >  
 <   / div  >  
 <   / div  >  
 <   / div  >  
 <   / div  >  
 <   / div  >  
 <   / div  >  
} 
 @section PageScripts {
 <！ -   < span class =code-keyword> 引导标签输入   - >   
 <   script     src   =  / assets / js / tagsinput / bootstrap-tagsinput.js  >  <   /   script  >  
 <   script  >  
 $（ document ）.ready（ function （）{
 $（'  form'）。on（'  submit'， function （）
 {
 @ Model.TestStringData = $（'  input'）。tagsinput（'  items'）
}）; 
}）; 
 <   /   script  >  
} 

然后在控制器中我有;

 [HttpPost] 
  public  ActionResult Calculate（ PostViewModel模型）
 {
  return 内容（ 这是一个测试）; 
} 
} 

这里只是为了衡量我的PostViewModel代码;

命名空间JaxCoderV20.Models 
 {
  public 类PostViewModel 
 {
  public  Post PostData {get;  set ; } 
  public 消息MsgData {get;  set ; } 
  public  List< string> TestData {get;  set ; } 
  public  string TestStringData {get;  set ; } 
} 
} 

我在帖子上有休息时间它发生了但是PostViewControl中的所有字段都是空的。

我也在脚本上休息一下，那里有有效的数据。



谢谢

解决方案

（ document ）.ready（ function （）{

（' form'） .on（' submit'， function （）
{
@ Model.TestStringData =

（' input'）。tagsinput（' items'）
} ）;
}）;
< / script >
}

然后在控制器中我有;

 [HttpPost] 
  public  ActionResult Calculate（ PostViewModel模型）
 {
  return 内容（ 这是一个测试）; 
} 
} 

这里只是为了衡量我的PostViewModel代码;

命名空间JaxCoderV20.Models 
 {
  public 类PostViewModel 
 {
  public  Post PostData {get;  set ; } 
  public 消息MsgData {get;  set ; } 
  public  List< string> TestData {get;  set ; } 
  public  string TestStringData {get;  set ; } 
} 
} 

我在帖子上有休息时间它发生了但是PostViewControl中的所有字段都是空的。

我也在脚本上休息一下，那里有有效的数据。



感谢

I'm just starting out with MVC, done a quite a bit of WebForms so not a noob.
So far MVC is fairly intuitive and I'm catching on pretty quick but I'm stuck on one critical area;

I've set up a bootstrap-tagsinput[^] control on my view page and I'm able to collect the data in a JQuery function.

I've set up a ViewModel class and can pass values into and show them on the control but I'm stuck as to how to return these values to the controller??

Here's my view code;

@model JaxCoderV20.Models.PostViewModel

@{
    ViewBag.Title = "Home Page";
}

@using (Ajax.BeginForm("Calculate", "Home",
                            new AjaxOptions { UpdateTargetId = "divInterestDeatils" }))
{
    <div class="page-body">
        <div class="row">
            <div class="col-lg-6 col-sm-6 col-xs-12">
                <div class="well with-header">
                    <div class="header bordered-darkorange">Bootstrap Tags Input</div>
                    <div>
                        <input type="text" value="@Html.Encode(Model.TestStringData) " data-role="tagsinput" placeholder="Add tags" />
                    </div>
                    <div class="form-group">
                        <div class="col-md-offset-2 col-md-10">
                            <input type="submit" value="Create" class="btn btn-default" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
}
@section PageScripts{
    <!--Bootstrap Tags Input-->
    <script src="/assets/js/tagsinput/bootstrap-tagsinput.js"></script>
    <script>
        $( document ).ready(function() {
            $('form').on('submit',function()
            {   
                @Model.TestStringData = $('input').tagsinput('items')
            });
        });
    </script>
}

Then in the controller I have;

[HttpPost]
public ActionResult Calculate(PostViewModel model)
    {
       return Content("This is a test");
     }
}

and just for good measure here's my PostViewModel code;

namespace JaxCoderV20.Models
{
    public class PostViewModel
    {
        public Post PostData { get; set; }
        public Message MsgData { get; set; }
        public List<string> TestData { get; set; }
        public string TestStringData { get; set; }
    }
}

I have a break on the post and it happens but all fields in the PostViewControl are null.
I also put a break at the script and there is valid data there.

Thanks

解决方案

( document ).ready(function() {

('form').on('submit',function() { @Model.TestStringData =

('input').tagsinput('items') }); }); </script> }

Then in the controller I have;

[HttpPost]
public ActionResult Calculate(PostViewModel model)
    {
       return Content("This is a test");
     }
}

and just for good measure here's my PostViewModel code;

namespace JaxCoderV20.Models
{
    public class PostViewModel
    {
        public Post PostData { get; set; }
        public Message MsgData { get; set; }
        public List<string> TestData { get; set; }
        public string TestStringData { get; set; }
    }
}

I have a break on the post and it happens but all fields in the PostViewControl are null.
I also put a break at the script and there is valid data there.

Thanks

这篇关于MVC5从视图中检索数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！