如何使用mvc5继续添加文本框 [英] How to keep on add text boxes using mvc5

问题描述

我有一个创建视图。在该视图标题字段中。即，。

SLNO名称DOB关系。 4个标题的四个文本框，如果单击添加，则只重复4个文本框。所以对我来说，4个带有标题字段的文本框正在重复。如果单击添加选项，我只想重复文本框。以下是我的代码。



请帮帮我。



先谢谢



我尝试了什么：

< td> @ Html.EditorFor（model => model.fRelationship，new {htmlAttributes = new {@class =form-control}}）

@ Html.DisplayNameFor（model => model.fSLNO）	@ Html.DisplayNameFor（model => model.fName）	@Html。 DisplayNameFor（model => model.familyDOB）	@ Html.DisplayNameFor（model => model。 f关系）	添加
@ Html .EditorFor（model => model.fSLNO，new {htmlAttributes = new {@class =form-control}}）	@ Html.EditorFor（model => model.fName，new {htmlAttributes = new {@class = form-control}}}	@ Html.EditorFor（model => model.familyDOB，new {htmlAttributes = new {@class =form-control}}）

< input type =submitid =btnSubmit />



<！ - 以下脚本 - >



< script type =text / javascript>



$（function（）{



$（ #addRow）。click（function（e）{

e.preventDefault（）;

var template = $（＃ite ms）。find（。itemRow）。first（）;

var newRow = template.clone（）;

newRow.find（input.formfield ）.val（）;

$（＃items）。append（newRow）;



}）;



$（＃btnSubmit）。点击（功能（e）{

e.preventDefault（）;

var _this = $（this）;

var url = _this.closest（form）。attr（action）;



var rows = [];

var items = $（。itemRow）;



$ .each（items，function （i，item）{

var fSLNO = $（item）.find（input [name ='SLNo']）。val（）;

var fName = $（item）.find（input [name ='Name']）。val（）;

var familyDOB = $（item）.find（input [name ='DOB' ]）。val（）;

var fRelationship = $（item）.find（input [name ='Relationship']）。val（）;



var row = {fSLNO：SLNo，fName：Name，familyDOB：DOB，fRelationship：Relationship};

rows.push（row）;

}）;



//让我们发布到服务器

$ .ajax（{

类型： POST，

url：url，

data：JSON.stringify（rows），

contentType：application / json

}）

.done（函数（结果）{

//对结果做一些事情

}）



}）;

}）;

< / script>

解决方案

（function（）{

（＃addRow）。click（function（e）{

e.preventDefault（）;

var template =

（＃items）。find（。itemRow） 。第一（） ;

var newRow = template.clone（）;

newRow.find（input.formfield）。val（）;

Hi,
I have a create view. in that view header fields are there. i.e,.
SLNO Name DOB Relationship. and four text boxes for 4 headers, if I clicked on "Add" only 4 text boxes should repeat. So for me 4 text boxes with header fields are repeating. I want to repeat only text boxes if I click on Add option. below is my code.

Please help me.

Thanks in Advance

What I have tried:

@Html.DisplayNameFor(model => model.fSLNO)	@Html.DisplayNameFor(model => model.fName)	@Html.DisplayNameFor(model => model.familyDOB)	@Html.DisplayNameFor(model => model.fRelationship)	Add
@Html.EditorFor(model => model.fSLNO, new { htmlAttributes = new { @class = "form-control" } })	@Html.EditorFor(model => model.fName, new { htmlAttributes = new { @class = "form-control" } })	@Html.EditorFor(model => model.familyDOB, new { htmlAttributes = new { @class = "form-control" } })	@Html.EditorFor(model => model.fRelationship, new { htmlAttributes = new { @class = "form-control" } })

<input type="submit" id="btnSubmit" />

<!--below Script-->

<script type="text/javascript">

$(function () {

$("#addRow").click(function (e) {
e.preventDefault();
var template = $("#items").find(".itemRow").first();
var newRow = template.clone();
newRow.find("input.formfield").val("");
$("#items").append(newRow);

});

$("#btnSubmit").click(function (e) {
e.preventDefault();
var _this = $(this);
var url =_this.closest("form").attr("action");

var rows = [];
var items = $(".itemRow");

$.each(items, function (i, item) {
var fSLNO = $(item).find("input[name='SLNo']").val();
var fName = $(item).find("input[name='Name']").val();
var familyDOB = $(item).find("input[name='DOB']").val();
var fRelationship = $(item).find("input[name='Relationship']").val();

var row = { fSLNO: SLNo, fName: Name, familyDOB: DOB, fRelationship: Relationship };
rows.push(row);
});

//Let's post to server
$.ajax({
type:"POST",
url: url,
data: JSON.stringify(rows),
contentType: "application/json"
})
.done(function (result) {
//do something with the result
})

});
});
</script>

解决方案

(function () {

("#addRow").click(function (e) {
e.preventDefault();
var template =

("#items").find(".itemRow").first();
var newRow = template.clone();
newRow.find("input.formfield").val("");

这篇关于如何使用mvc5继续添加文本框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！