C# Tabelle neue Zeilen mit Textfeld hinzufügen

Question

Ich habe eine Frage. Ich mache eine Tabelle, aber ich brauche eine Seite hinzufügen, wo der Benutzer ein Textfeld ausfüllen kann, (oder etwas anderes) Dann drücken Sie Hinzufügen. In diesem Fall muss die Tabelle mit den vom Benutzer hinzugefügten Informationen aktualisiert werden.

Könnte mir jemand helfen? Weil ich nicht weiß, wie ich anfangen soll.

Der Code aus der Tabelle Seite:

@model IEnumerable<DNDB.Models.Domeinnaam> 

@Styles.Render("~/Content/StyleSheet.css") 
@{ 
ViewBag.Title = "Index"; 
} 
<h2>Domeinnaam Overzicht</h2> 

@Html.ActionLink("add", "CreateDomeinnaam.cshtml") 


<table id="tabledomeinnamen"> 
<tr> 
    <th>  
     @Html.DisplayNameFor(model => model.IsActief) 
    </th> 
    <th> 
     @Html.DisplayNameFor(model => model.Naam) 
    </th> 
    <th> 
     @Html.DisplayNameFor(model => model.TLD) 
    </th> 
    <th>  
     @Html.DisplayNameFor(model => model.DatumRegistratie) 
    </th> 
    <th> 
     @Html.DisplayNameFor(model => model.Omschrijving) 
    </th> 
    <th> 
     @Html.DisplayNameFor(model => model.DatumOpzeg) 
    </th> 
    <th> 
     @Html.DisplayNameFor(model => model.EigenaarID) 
    </th> 
    <th> 
     @Html.DisplayNameFor(model => model.Opmerking) 
    </th> 
    <th> 
     @Html.DisplayNameFor(model => model.BeheerAccountID) 
    </th> 
    <th> 
     @Html.DisplayNameFor(model => model.KlantID) 
    </th> 
    <th> 
     @Html.DisplayNameFor(model => model.RegistrarID) 
    </th> 
    <th> 
     @Html.DisplayNameFor(model => model.BetaaldVan) 
    </th> 
    <th> 
     @Html.DisplayNameFor(model => model.BetaaldTot) 
    </th> 
    <th> 
     @Html.DisplayNameFor(model => model.AfspraakPrijs) 
    </th> 
    <th></th> 
</tr> 

@foreach (var item in Model) { 
<tr> 
    <td> 
     @Html.DisplayFor(modelItem => item.IsActief) 
    </td> 
    <td> 
     @Html.DisplayFor(modelItem => item.Naam) 
    </td> 
    <td> 
     @Html.DisplayFor(modelItem => item.TLD) 
    </td> 
    <td> 
     @Html.DisplayFor(modelItem => item.DatumRegistratie) 
    </td> 
    <td> 
     @Html.DisplayFor(modelItem => item.Omschrijving) 
    </td> 
    <td> 
     @Html.DisplayFor(modelItem => item.DatumOpzeg) 
    </td> 
    <td> 
     @Html.DisplayFor(modelItem => item.EigenaarID) 
    </td> 
    <td> 
     @Html.DisplayFor(modelItem => item.Opmerking) 
    </td> 
    <td> 
     @Html.DisplayFor(modelItem => item.BeheerAccountID) 
    </td> 
    <td> 
     @Html.DisplayFor(modelItem => item.KlantID) 
    </td> 
    <td> 
     @Html.DisplayFor(modelItem => item.RegistrarID) 
    </td> 
    <td> 
     @Html.DisplayFor(modelItem => item.BetaaldVan) 
    </td> 
    <td> 
     @Html.DisplayFor(modelItem => item.BetaaldTot) 
    </td> 
    <td> 
     @Html.DisplayFor(modelItem => item.AfspraakPrijs) 
    </td> 
    <td> 
     @Html.ActionLink("Edit", "Edit", new { id=item.ID }) 
     @Html.ActionLink("Details", "Details", new { id=item.ID }) 
     @Html.ActionLink("Delete", "Delete", new { id=item.ID }) 
    </td> 
</tr> 
} 

</table> 

Answer 1

Der Code aus der Tabelle Seite:

@Html.ActionLink("add", "CreateDomainName", "Domain") //Second parameter is the action name, Third parameter is the controller name. If your 'list'(table) page action and 'add' action are in the same controller then this field is optional. 

CreateDomainName Aktion in Ihrem Controller.

Um die Ansicht der CreateDomainName Aktion zu generieren, klicken Sie mit der rechten Maustaste auf Aktion und klicken Sie auf 'Ansicht hinzufügen'.

Ansicht der CreateDomainName-Aktion.

@using(Html.BeginForm()) 
{ 
    <!-- Your html code --> 
    <input type="submit">Add</input> 
} 

Answer 2

Sie diese Aufgabe auf zwei Arten durchführen kann:

1. Ajax
2. von Formular-Server Einreichung und die Seite aktualisieren

Hier ist, wie Sie es über Ajax tun können .

1. oben oder unten von Tabelle mit den erforderlichen Feldern
2. Auf der Form Ereignisprozess Formular mit den erforderlichen Zellen über Ajax

3. In Erfolg Rückruf append tr Tabelle einreichen In Form.

   $(document).ready(function() { $("#newForm").submit(function(){ //TODO: Perform ajax call to add reccord in database // Append row to table return false; });

Hier ist ein Code Demo Sie es mit Ajax zu tun folgen kann. Add new row to table on form submit