1

tenho um modal para pesquisar clientes: inserir a descrição da imagem aqui

Que é chamado de um form de cadastro da seguinte forma:

$('#linkSearchShipperCustomer').on("click", function (e) {
            showDialogList("@Url.Action("IndexShadow", "ShipperCustomer")", "IdShipperCustomerDiv", "IdShipperCustomer", "ShipperCustomerFullName", "Buscar Cliente", function (value, text) {
                loadCustomerAddress(value);
            });

        });

o showDialog tem esse corpo:

function showDialogList(url, idDiv, idValueUpdate, idTextUpdate, dialogTitle, callback) {
debugger;
elementChoosedCallback = callback;

idElementValueUpdate = idValueUpdate;
idElementTextUpdate = idTextUpdate;

$.post(url, {}, function (result) {
    $("#" + idDiv).html(result);
    if (dialogTitle != undefined)
        $("#" + idDiv).dialog({ width: 670, title: dialogTitle });
    else
        $("#" + idDiv).dialog({ width: 670 });

  });
}

e chama essa action:

public ActionResult IndexShadow(ShipperCustomerFilter filter)
    {
        filter.IsActive = true;
        filter.PageSize = 12;

        var modelList = new ShipperCustomerListViewModel()
        {
            ShipperCustomers = ShipperCustomerViewModel.ConvertFromModelList(repository.GetAllShipperCustomers(filter, out totalRecords)),
            LegalTypes = GetAllLegalTypes()
        };

        CreateRouteValuesForFilters();

        ViewBag.PagingModel = SetCurrentPage(totalRecords, filter.Page, filter.PageSize, true);
        ViewBag.PagingModel.FormId = "ShipperCustomerFormSearchId";

        return View(modelList);
    }

O que eu acho que seja o problema é, quando dou submit no modal ele recarrega a pagina de trás e retorna assim, recarregou o pai com os campos do modal:inserir a descrição da imagem aqui

como fazer para não recarregar a página que chamou o modal, e exibir os resultados no próprio modal?(não está na imagem mas ele retorna os resultados nessa pagina errada).

EDIT: Após dica do @Harrison, eu vi que meu código não entra na função que chama o e.preventDefault();não sei porque.

$("#ShipperCustomerFormSearchId").on("submit", function (e) {
        debugger;
        e.preventDefault();

        $.post($(this).attr("action"), $(this).serialize(), function (result) {
            $("#IdShipperCustomerDiv").html(result);
        });
    });`

meu beginForm:

@using (Html.BeginForm("IndexShadow", "ShipperCustomer", ViewBag.Routes as RouteValueDictionary, FormMethod.Get, new { @id = "ShipperCustomerFormSearchId", @class = "middle-forms" }))

1 Resposta 1

2

Para cancelar um submit do formulário tem que usar o preventDefault no evento, por exemplo:

$('form').on('submit', function(e) {
    e.preventDefault();
    // insira aqui sua chamada ajax
})
3
  • o problema é que se eu fizer isso o submit do próprio form não vai funcionar, meu problema é recarregar o pai quando dou submit no filho, ou seja, ele recarrega a pagina que abriu o modal quando dou submit no modal.
    – Vinicius
    Commented 9/06/2017 às 13:12
  • você tinha razão já existe uma função com e.preventDefault();, porem meu código não entra nela. editei a pergunta.
    – Vinicius
    Commented 9/06/2017 às 14:01
  • use o inspect do console para confirmar que o id #ShipperCustomerFormSearchId é inserido na tag <form>, como não sei como é feito seu render, pode ser que esse id entre em uma div, por exemplo: <div id="ShipperCustomerFormSearchId"><form>...</form></div>
    – Harrison
    Commented 9/06/2017 às 18:45

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .