如何在MVC中将数据从视图传递到控制器

时间:2014-03-20 12:01:02

标签: jquery asp.net-mvc json onclick onblur

我正在MVC中开发一个应用程序,我希望将数据从视图发送到控制器,然后再从控制器发送回另一个视图。我在视图中使用代码,

<input type="text" id="ProductCode_0" name="ProductCode" style="width:10%; margin-left:0px;" onblur="AddEle()" />                
<input type="text" id='ProductName_0' name="ProductName" style="width:10%; margin-left:20px;"/>
<input class="btn btn-primary" type="submit" value="Create" id="create"/>

我使用jQuery来获取ProductCode-

<script type="text/javascript">
function AddEle()
{
    var firstProductId=$('#ProductCode_0').val();
    getProductFirstDetails(firstProductId)
}

function getProductFirstDetails(firstProductId)
{
    $.ajax({
    url: "/Purchase/getProductDetails/",
    data: { Id: firstProductId },

    dataType: "json",
    success: function (result)
    {                    
    $('#ProductName_0').val(result.Name);
    }
    });            
    }
</script>

并在控制器中 -

[HttpPost]
public ActionResult Create(string ProductCode, string ProductName)
{
    if (ProductCode != "")
    {               
        Purchase oPurchase = new Purchase();

        if (ProductName != "")
        {
            oPurchase.ProductName = ProductName;
        }
        else
        {
            oPurchase.ProductName = "";
        }
    }
    return RedirectToAction("SaveData",oPurchase);
}               
 public ActionResult SaveData(Purchase oPurchase)
{   
    ViewBag.ProductCode = oPurchase.ProductName;        
    ViewBag.ProductName = oPurchase.ProductName;        
    return View();
}
public JsonResult getProductDetails(int Id)
{
    var FinalProduct = getProductEdit(Id);
    return Json(FinalProduct, JsonRequestBehavior.AllowGet);
}
public Purchase getProductEdit(int Id)
{
    Product oProduct = new Product();
    if (Id == 1)
    {
        oProduct.ProductCode = "234443";
        oProduct.Id = 1;
        oProduct.Name = "Product1";
         else
        {
            return oProduct;
        }
    }    
}

并在视图中保存SaveData -

<div class="span6" >
    <div class="span4" style="margin-left:25px;">
        <label >ProductName</label>
    </div>
    <div class="span6" >        
        @ViewBag.ProductName
    </div>
</div>    
<div class="span6" >
    <div class="span4" style="margin-left:25px;">
        <label >ProductCode</label>
    </div>
    <div class="span6" >        
        @ViewBag.ProductCode
    </div>
</div>  

在这里,我使用onblur函数通过id="ProductCode_0"从控制器获取记录。 现在我的问题是,我想将获取的数据发送到控制器n将其恢复到SaveData视图中。我想将结果发送到[HttpPost],因此我在视图中使用name。 但我想阻止用户在文本框中输入数据 -

 <input type="text" id='ProductName_0' name="ProductName" style="width:10%; margin-left:20px;"/>

怎么做? 我只想从控制器获取数据并将其发送回下一个视图,即SaveData,而不使用ProductName的文本框。是否有任何方法可以使用<div>或{{1 }} 请帮帮我。

1 个答案:

答案 0 :(得分:0)

你可以用两种方式做到这一点;

<强> 1.way

隐藏第二个文本框;

<input type="text" id="ProductCode_0" name="ProductCode" style="width:10%; margin-left:0px;" onblur="AddEle()" />                
<input type="hidden" id='ProductName_0' name="ProductName" style="width:10%; margin-left:20px;"/>
<input class="btn btn-primary" type="submit" value="Create" id="create"/>

<强> 2.way

禁用第二个框;

<input type="text" id="ProductCode_0" name="ProductCode" style="width:10%; margin-left:0px;" onblur="AddEle()" />                
<input type="text" id='ProductName_0' name="ProductName" style="width:10%; margin-left:20px;" disabled="disabled"/>
<input class="btn btn-primary" type="submit" value="Create" id="create"/>

但请注意,用户还可以从firebug控制台更改此文本框。如果表单值有效,则需要在servier端进行一些验证