繁体   English   中英

从HTML表ASP.net MVC获取使用jQuery添加的数据

[英]Get data added with jQuery from HTML table ASP.net MVC

我的页面上有一些表格。 数据是使用jQuery动态添加的。
这很好
现在,我需要获取所有这些数据(逐个单元,由jQuery添加),并将其作为模型发送到我的控制器以插入到我的数据库中。
这是我的看法:

@model prjArqBuild.entidade_endereco
<div class="panel-group">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h4 class="panel-title">
                <a data-toggle="collapse" href="#endereco">
                    Endereços
                </a>
            </h4>
        </div>
        <div id="endereco" class="panel-collapse collapse">
            <div class="panel-body">
                <table class="table" id="tabEndereco">
                    <thead>
                        <tr>
                            <th>
                                Endereco
                            </th>
                            <th>
                                Numero
                            </th>
                            <th>
                                Complemento
                            </th>
                            <th>
                                Bairro
                            </th>
                            <th>
                                Cidade
                            </th>
                            <th>
                                UF
                            </th>
                            <th>
                                CEP
                            </th>
                        </tr>
                    </thead>
                </table>
            </div>
            <div class="panel-footer">
                <p class="panel-title">
                    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#ModalEndereco">
                        Adicionar Endereço
                    </button>

                    <!-- Modal -->
                    <div class="modal fade" id="ModalEndereco" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                        <div class="modal-dialog" role="document">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                    <h4 class="modal-title" id="myModalLabel">Cadastro de Endereço</h4>
                                </div>
                                <div class="modal-body">
                                    <fieldset id="infoEndereco">
                                        <div class="row">
                                            <div class="col-md-8">
                                                @Html.EditorFor(model => model.een_endereco, new { htmlAttributes = new { @class = "form-control input-sm", placeholder = "Endereço" } })
                                                @Html.ValidationMessageFor(model => model.een_endereco, "", new { @class = "text-danger" })
                                            </div>
                                            <div class="col-md-4">
                                                @Html.EditorFor(model => model.een_numero, new { htmlAttributes = new { @class = "form-control input-sm", placeholder = "Numero" } })
                                                @Html.ValidationMessageFor(model => model.een_numero, "", new { @class = "text-danger" })
                                            </div>
                                        </div>
                                        <br />
                                        <div class="row">
                                            <div class="col-md-12">
                                                @Html.EditorFor(model => model.een_comple, new { htmlAttributes = new { @class = "form-control input-sm", placeholder = "Complemento" } })
                                                @Html.ValidationMessageFor(model => model.een_comple, "", new { @class = "text-danger" })
                                            </div>
                                        </div>
                                        <br />
                                        <div class="row">
                                            <div class="col-md-6">
                                                @Html.EditorFor(model => model.een_bairro, new { htmlAttributes = new { @class = "form-control input-sm", placeholder = "Bairro" } })
                                                @Html.ValidationMessageFor(model => model.een_bairro, "", new { @class = "text-danger" })
                                            </div>
                                            <div class="col-md-6">
                                                @Html.EditorFor(model => model.een_cidade, new { htmlAttributes = new { @class = "form-control input-sm", placeholder = "Cidade" } })
                                                @Html.ValidationMessageFor(model => model.een_cidade, "", new { @class = "text-danger" })
                                            </div>
                                        </div>
                                        <br />
                                        <div class="row">
                                            <div class="col-md-6">
                                                @Html.EditorFor(model => model.een_uf, new { htmlAttributes = new { @class = "form-control input-sm", placeholder = "Estado" } })
                                                @Html.ValidationMessageFor(model => model.een_uf, "", new { @class = "text-danger" })
                                            </div>
                                            <div class="col-md-6">
                                                @Html.EditorFor(model => model.een_cep, new { htmlAttributes = new { @class = "form-control input-sm", placeholder = "CEP" } })
                                                @Html.ValidationMessageFor(model => model.een_cep, "", new { @class = "text-danger" })
                                            </div>
                                        </div>
                                    </fieldset>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
                                    <button id="addEndereco" type="button" OnClick="gravarDetalheEnd();" class="btn btn-primary">Salvar</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </p>
            </div>
        </div>
    </div>
</div>

这是我的jQuery函数,将数据添加到HTML表:

  function gravarDetalheEnd() {
            $('#tabEndereco tr:last').after('<tr><td>' + $('#een_endereco').val() + '</td><td>' + $('#een_numero').val() + '</td>' +
                '<td>' + $('#een_comple').val() + '</td>' + '<td>' + $('#een_bairro').val() + '</td>'
                + '<td>' + $('#een_cidade').val() + '</td>' + '<td>' + $('#een_uf').val() + '</td>'
                + '<td>' + $('#een_cep').val() + '</td></tr>');          
        }

我需要获取所有单元格并将其作为EntEnd传递给此Controller Action:

public void AddEndereco(entidade_endereco entEnd)
        {
            db.entidade_endereco.Add(entEnd);
            db.SaveChanges();
        }

我已经尝试了很多东西,但是没有任何效果! 我没有结果!
我怎样才能做到这一点?

我建议将要存储在数据库中的数据序列化为JSON,并使用jQuery将其AJAX POST到控制器操作。 就像是:

var json = {
            entidade_endereco : {
//TODO: structure as per your model
            }
        }


$.ajax({
                url: "/Controller/AddEndereco",
                type: "POST",
                data: json,
                success: function (data) {
//TODO: success message or something
                }

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM