0

Tengo una vista en la que quiero que: Por defecto se muestre una vista parcial al entrar en la misma. Después, según se seleccione una opción con un radio button, muestre una u otra.

Las vistas parciales son: _DirTipoF.cshtml y la que se ha de cargar por defecto, _DirTipoL.cshtml El código de la vista es este:

@using (Html.BeginForm())
{
   @Html.AntiForgeryToken()

   <div class="nav-tabs-top nav-responsive-sm">
      <ul class="nav nav-tabs">
         <li class="nav-item">
            <a class="nav-link active" data-toggle="tab" href="#item-General">General</a>
         </li>
      </ul>
      <div class="tab-content">
         <div class="tab-pane fade show active" id="item-General">
            <div class="card-body">
                    <div class="form-row">
                  <div class="form-group col-md-12">
                     <label class="form-label">Tipo de dirección</label>
                     <div class="form-inline">
                        <label class="custom-control custom-radio">
                           <input name="radio-direccion" value="local" type="radio" checked="checked" class="custom-control-input">
                           <span class="custom-control-label">Local &nbsp;&nbsp;</span>
                        </label>
                        <label class="custom-control custom-radio">
                           <input name="radio-direccion" value="foranea" type="radio" class="custom-control-input">
                           <span class="custom-control-label">Foránea</span>
                        </label>
                     </div>
                  </div>
               </div>
               <div class="form-row">
                        <div id="direccion"></div>
               </div>
            </div>
         </div>
        </div>
   </div>
   <div class="text-right mt-3">
      <button type="button" class="btn btn-primary">Save changes</button>
   </div>
}

@section Scripts {
   <script type="text/javascript">
      $(function(){
         $("[name=radio-direccion]").on('change', function(){
            var $radio = $(this);
            $.ajax({
                url:'@Url.Action("GetTipoDireccion", "Cliente")',
                data: { tipodir = $radio.val() },
                type: 'GET',
                success: function(data){
                   $("#direccion").html(data);
            }
         });
      });

   </script>
}

El código del método de la acción es este:

[HttpGet]
public ActionResult GetTipoDireccion(string tipodir)
{
   if (tipodir.ToLower() == "local")
      return PartialView("_DirTipoL");
   else
      return PartialView("_DirTipoF");
}

He probado con todos los ejemplos al efecto que he encontrado, pero por algún motivo, parece no llegar a realizarse la solicitud a GetTipoDireccion().

Agradezco cualquier ayuda al respecto.

3
  • Intentaste poner un breakpoint en GetTipoDireccion(string) aver si entra al método? el 30 oct. 2018 a las 16:32
  • Juan, sí. Tengo un breakpoint al que no llega al cambiar el checked de los radio buttons. Sin embargo sí que actúa cuando pongo la url directamente
    – Carlos
    el 31 oct. 2018 a las 8:45
  • En la consola de javascript no te produce ningún error? la url que esta generando Url.Action es correcta? el 31 oct. 2018 a las 11:06

2 respuestas 2

0

Ya encontré el problema. Era una asignación en un objeto mal realizada. Concretamente esta:

data: { tipodir = $radio.val() },

que ha de ser:

data: { tipodir : $radio.val() },

Gracias a Juan Salvador Portugal que me ha dado la pista de la consola de JavaScript para detectar el error.

1
  • Cierto, y eso es porque en la llamada ajax se enviar objectos json y no variables.
    – KodiakMx
    el 31 oct. 2018 a las 19:58
0

Como estas pasando información desde tu vista al controlador que carga la vista parcial y (supongo) ese valor está fuera de tu tabla de ruteo (/controlador/metodo/{id}), tu llamada debe de ser tipo Post, y el método de acción debe de ser decorado con HttpPost

Llamada ajax:

$.ajax({
    url:'@Url.Action("GetTipoDireccion", "Cliente")',
    data: { tipodir: $radio.val() },
    type: 'POST',
    success: function(data){
       $("#direccion").html(data);
}

Método de acción:

[HttpPost]
public ActionResult GetTipoDireccion(string tipodir)
{...
1
  • KodiakMx, he cambiado de GET a POST y continúa igual. Sigue sin funcionar.
    – Carlos
    el 31 oct. 2018 a las 8:46

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.