Veröffentlichen Sie eine HTML-Tabelle in ADO.NET DataTable


71

Ich habe eine HTML-Tabelle wie unten in meiner Ansicht:

<table id="tblCurrentYear">
    <tr>
        <td>Leave Type</td>
        <td>Leave Taken</td>
        <td>Leave Balance</td>
        <td>Leave Total</td>
    </tr>
    @foreach (var item in Model.LeaveDetailsList)
    {
        <tr>
            <td>@Html.TextBoxFor(m => item.LeaveType, new { width = "100" })</td>
            <td>@Html.TextBoxFor(m => item.LeaveTaken, new { width = "100" })</td>
            <td>@Html.TextBoxFor(m => item.LeaveBalance, new { width = "100" })</td>
            <td>@Html.TextBoxFor(m => item.LeaveTotal, new { width = "100" })</td>
        </tr>
    }
</table>

Ich möchte alle HTML-Tabellenzeilen durchlaufen und die Werte in ADO.NET DataTable einfügen.

Einfach gesprochen, HTML-Tabelle in ADO.NET DataTable konvertieren.

Wie extrahiere ich Werte aus der HTML-Tabelle und füge sie in ADO.NET DataTable ein?

Die Ansicht basiert auf dem folgenden Modell

public class LeaveBalanceViewModel
{
    public LeaveBalanceViewModel()
    {
        this.EmployeeDetail = new EmployeeDetails();
        this.LeaveBalanceDetail = new LeaveBalanceDetails();
        this.LeaveDetailsList = new List<LeaveBalanceDetails>();
    }
    public EmployeeDetails EmployeeDetail { get; set; }
    public LeaveBalanceDetails LeaveBalanceDetail { get; set; }
    public List<LeaveBalanceDetails> LeaveDetailsList { get; set; }
}

1
Suchen Sie nach den Textfeldwerten der Tabelle und dem Einfügen in die Datenbank oder nach dem vollständigen Einfügen von HTML?
Jinesh Jain

6
War es nicht von unseren Kommentaren zu Ihrer letzten Frage klar , dass Sie nicht können eine Verwendung foreachSchleife erzeugen Kontrollen in einer Sammlung. Sie benötigen eine forSchleife oder eine benutzerdefinierte EditorTemplatefür das Modell. Ihre foreachSchleife wird an nichts gebunden.

1
@StephenMuecke Aber das foreach funktioniert und ich kann HTML-Tabelle damit füllen. Sobald diese Tabelle generiert wurde, kann der Benutzer den Wert in einer beliebigen TextBox ändern und auf die Schaltfläche Speichern klicken. Wenn Sie auf Speichern klicken, möchte ich alle TextBox-Werte (Zeile für Zeile) auswählen und in ADO.NET DataTable einfügen.
RKh

4
NEIN ist es nicht - Sie sehen die Werte in der Ansicht, können sich aber beim Zurückschreiben an nichts binden. Überprüfen Sie das HTML, das Sie generieren - Sie haben mehrere Textfelder mit name="LeaveType". Um zu binden , um Ihre Sammlung auf Post zurück, müssen die Kontrollen sein LeaveBalanceDetail[0].LeaveType, LeaveBalanceDetail[1].LeaveTypeusw.

1
Warum müssen Sie diese zur ADO.Net-Tabelle hinzufügen? Möchten Sie diese in einer Datenbank speichern?
Mairaj Ahmad

Antworten:


79

Um beim Zurückbinden an ein Modell gebunden zu werden, müssen die nameAttribute der Formularsteuerelemente mit den Modelleigenschaften übereinstimmen. Ihre Verwendung einer foreachSchleife generiert nicht die richtigen Namensattribute. Wenn Sie den HTML-Code überprüfen, werden mehrere Instanzen von angezeigt

<input type="text" name="item.LeaveType" .../>

Aber um an Ihr Modell zu binden, müssten die Steuerelemente sein

<input type="text" name="LeaveDetailsList[0].LeaveType" .../>
<input type="text" name="LeaveDetailsList[1].LeaveType" .../>

usw. Der einfachste Weg, darüber nachzudenken, besteht darin, zu überlegen, wie Sie auf den Wert einer LeaveTypeEigenschaft im C#Code zugreifen würden

var model = new LeaveBalanceViewModel();
// add some LeaveBalanceDetails instances to the LeaveDetailsList property, then access a value
var leaveType = model.LeaveDetailsList[0].LeaveType;

Da Ihre POST-Methode einen Parameternamen hat (z. B. model), lassen Sie einfach das Präfix ( model) fallen, und so muss das Namensattribut des Steuerelements sein. Dazu müssen Sie entweder eine forSchleife verwenden (die Sammlung muss implementiert werden IList<T>).

for(int i = 0; i < Model.LeaveDetailsList.Count; i++)
{
    @Html.TextBoxFor(m => m.LeaveDetailsList[i].LeaveType)
    ....
}

oder verwenden Sie eine benutzerdefinierte EditorTemplate(die Sammlung muss nur implementiert werden IEnumerable<T>)

Im /Views/Shared/EditorTemplates/LeaveBalanceDetails.cshtml

@model yourAssembly.LeaveBalanceDetails
<tr>
    <td>@Html.TextBoxFor(m => m.LeaveType)</td>
    ....
</tr>

und dann in der Hauptansicht (nicht in einer Schleife)

<table>
    .... // add headings (preferably in a thead element
    <tbody>
        @Html.EditorFor(m => m.LeaveDetailsList)
    </tbody>
</table>

und schließlich in der Steuerung

public ActionResult Edit(LeaveBalanceViewModel model)
{
    // iterate over model.LeaveDetailsList and save the items
}

1
Dies erklärt, was im Präfixnamen enthalten sein muss, damit eine Liste von der Rasiermaschine erkannt werden kann. Vielen Dank! ;)
Ian

1
Das war sehr hilfreich! Ich habe jedoch immer noch ein Problem - ich habe meinen Modelltyp in eine Liste anstelle von IEnumerable geändert und diese in der Ansicht mit einer For-Schleife anstelle von For Each durchlaufen. Wenn ich jedoch einreiche, gelangt es zum Controller, und mein Modell dort ist nichts! Warum sollte es nichts sein?
Andy

1
@Andarta, ohne deinen Code zu sehen, habe ich keine Ahnung, welche Fehler du gemacht hast. Sie müssen eine Frage stellen, die die relevanten Details zeigt und wir werden sie beantworten können :)

8

Versuchen Sie dies in Bezug auf Ihre Anforderung

jQuery(document).on("change", ".DDLChoices", function (e) {
    var comma_ChoiceIds = '';
    var comma_ChoicesText = '';
    $('input[class="DDLChoices"]').each(function (e) {
        if (this.checked) {
            comma_ChoiceIds = comma_ChoiceIds + $(this).val() + ',';
            comma_ChoicesText = comma_ChoicesText + $(this).parent('label').parent() + ',';
        }
    });
    $('#ChoiceIds').val(comma_ChoiceIds);
    $('#ChoiceText').val(comma_ChoicesText);
});
@using (Html.BeginForm("Actionname", "Controllername", FormMethod.Post, new { id = "frmChoices" }))
{

    @Html.HiddenFor(m => m.ChoiceText, new { @id = "ChoiceText" })
    @Html.HiddenFor(m => m.ChoiceIds, new { @id = "ChoiceIds" })
    <div class="form-group">
        <div>
            <table>
                <tr>
                    <th>Name</th>
                    <th>Selected</th>
                </tr>
                @foreach (var item in @Model.Choices)
                {
                    <tr>
                        <td> <label>@item.ChoicesText</label>    </td>
                        <td> <input class="DDLChoices" value="@item.ChoiceIds" type="checkbox" /></td>
                    </tr>
                }
            </table>
        </div>
     <input type="button" value="Submit" onclick="return ChoicesPoster.passChoices()"
    </div>
}
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.