2012-08-27 31 views
5

tengo una vista parcial que estoy llamando en las páginas de la siguiente manera: -pasar una variable a partir de afeitar cshtml a jQuery

@Html.Partial("~/Views/Shared/ImageGallery.cshtml", Model) 

El código para el Jquery real de esta página es la siguiente: -

<script type="text/javascript"> 
    $(document).ready(function() { 

     $('.modal_block').click(function (e) { 
      $('#tn_select').empty(); 
      $('.modal_part').hide(); 
     }); 

     $('#modal_link').click(function (e) { 
      $('.modal_part').show(); 
      var context = $('#tn_select').load('/Upload/UploadImage?Page=Article&Action=Edit&id=16', function() { 
       initSelect(context); 
      }); 
      e.preventDefault(); 
      return false; 
     }); 

    }); 
</script> 

Ahora bien, esto funciona a la perfección, sin embargo tengo que encontrar una manera de pasar VARs dinámicos en lugar de VARs cifrados duros a esto: -

Upload/UploadImage?Page=Article&Action=Edit&id=16 

En el Modelo, tengo todos los vars, sin embargo, no sé cómo puedo insertarlos en el Jquery. ¡Cualquier ayuda sería muy apreciada!

--------- ACTUALIZACIÓN -----------------------

Este es el código que estoy poniendo en cada cshtml que necesita ImageGallery.

</div> 
    @Html.HiddenFor(model => model.PageViewModel.Page.PageTitle, new { id = "PageTitle"}); 
    @Html.HiddenFor(model => model.PageViewModel.Page.PageAction, new { id = "PageAction"}); 
    @Html.HiddenFor(model => model.ArticleViewModel.Article.ArticleID, new { id = "ArticleID"}); 
<div> 
    @Html.Partial("~/Views/Shared/ImageGallery.cshtml", Model) 
</div> 

Nueva Javascript en el ImageGallery: -

<script type="text/javascript"> 

    var pageTitle = $('#PageTitle').val(); 
    var pageAction = $('#PageAction').val(); 
    var id = $('#ArticleID').val(); 
    $(document).ready(function() { 
     $('.modal_block').click(function (e) { 
      $('#tn_select').empty(); 
      $('.modal_part').hide(); 
     }); 
     $('#modal_link').click(function (e) { 
      $('.modal_part').show(); 
      var context = $('#tn_select').load('/Upload/UploadImage?Page=' + pageTitle + '&Action=' + pageAction + '&id=' + id, function() { 
       initSelect(context); 
      }); 
      e.preventDefault(); 
      return false; 
     }); 
    }); 

</script> 

Esto funciona bien ahora

Respuesta

18

Puede añadir campo oculto a la vista y enlazar datos forman el modelo. Entonces puedes leer fácilmente este valor de jQuery.

Vista:

@Html.HiddenFor(model => model.Id, new { id = "FieldId"}); 

Guión:

var id= $('#FieldId').val(); 

También usted puede poner este hiddens en su vista parcial. Si su vista parcial no está fuertemente tipada, cambie HiddenFor a Hidden. Su ImageGallery vista parcial debe contener la siguiente div:

</div> 
    @Html.Hidden("PageTitle", Model.PageViewModel.Page.PageTitle); 
    @Html.Hidden("PageAction", Model.PageViewModel.Page.PageAction); 
    @Html.Hidden("ArticleID", Model.ArticleViewModel.Article.ArticleID); 
<div> 

En este caso no es necesario para poner a cada hiddens cshtml que necesita el ImageGallery.

+0

Artem ¿me puede dar un ejemplo de código? – Johann

+0

Ver publicación actualizada. –

+0

ok esto funciona, antes de aceptarlo como respuesta, ¿es posible en lugar de pasarlo como vars ocultos, pasarlo desde aquí? ------- @ Html.Partial ("~/Views/Shared/ImageGallery.cshtml", Modelo) – Johann

2

Puede establecer campos ocultos o simplemente declarar javascript las variables y establecer sus valores ya sea de su modelo o la Viewbag, al igual que:

var action = @Model.action; 

o

var id = @ViewBag.id; 

y sólo se puede utilizar en su código

<script type="text/javascript"> 

var action = @Model.action; 
var id = @ViewBag.id; 
$(document).ready(function() { 

$('.modal_block').click(function (e) { 
    $('#tn_select').empty(); 
    $('.modal_part').hide(); 
}); 
$('#modal_link').click(function (e) { 
    $('.modal_part').show(); 
    var urlToLoad = "/Upload/UploadImage?Page=Article&Action=" + action + "&id=" + id; 
    var context = $('#tn_select').load(urlToLoad, function() { 
     initSelect(context); 
    }); 
    e.preventDefault(); 
    return false; 
}); 

});

+0

Probé su ejemplo GR7 ----- var page = @ Model.PageViewModel.Page.PageTitle; ------ pero obtengo el error "Referencia de objeto no configurado a una instancia de un objeto" – Johann

+0

puede pegar un poco más de tu código Johann? ¿Está configurando las variables de JavaScript para las propiedades reales de su modelo o Viewbag? – GR7

+0

Hola, GR7, he actualizado mi código con una solución que está funcionando ahora, me gustó la solución de Artem, solo necesito encontrar una forma de hacerlo un poco más "limpio". – Johann

Cuestiones relacionadas