IT TIP

ADO.NET DataTable에 HTML 테이블 게시

itqueen 2020. 12. 1. 20:20
반응형

ADO.NET DataTable에 HTML 테이블 게시


내보기에 아래와 같은 HTML 테이블이 있습니다.

<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>

모든 html 테이블 행을 반복하고 ADO.NET DataTable에 값을 삽입하고 싶습니다.

간단히 말해서 HTML 테이블을 ADO.NET DataTable로 변환합니다.

HTML 테이블에서 값을 추출하고 ADO.NET DataTable에 삽입하는 방법은 무엇입니까?

보기는 다음 모델을 기반으로합니다.

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; }
}

포스트 백에서 모델에 바인딩 name하려면 양식 컨트롤 속성이 모델 속성과 일치해야합니다. foreach루프를 사용 하면 올바른 이름 속성이 생성되지 않습니다. html을 검사하면 여러 인스턴스를 볼 수 있습니다.

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

그러나 모델에 바인딩하려면 컨트롤이

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

등등. 이것에 대해 생각하는 가장 쉬운 방법 LeaveTypeC#코드 에서 속성 의 값에 접근하는 방법을 고려하는 것입니다.

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

POST 메서드에는 매개 변수 이름 (예 model:)이 있으므로 접두사 ( model)를 삭제 하면 컨트롤의 이름 속성이 있어야합니다. 이를 위해서는 for루프 중 하나를 사용해야합니다 (컬렉션이 구현해야 함 IList<T>).

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

또는 사용자 정의를 사용하십시오 EditorTemplate(컬렉션은 구현 만 필요 IEnumerable<T>)

/Views/Shared/EditorTemplates/LeaveBalanceDetails.cshtml

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

그런 다음 기본보기 (루프가 아님)에서

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

마지막으로 컨트롤러에서

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

귀하의 요구 사항과 관련하여 이것을 시도하십시오.

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>
}

참고 URL : https://stackoverflow.com/questions/30094047/post-an-html-table-to-ado-net-datatable

반응형