2012-07-25 53 views
0

我不确定我的头是否已经解决了这个问题,所以如果解释看起来不足,请耐心等待。我在MVC-3上还是有点新的。从MVC中的模型数据中选定的下拉列表项目动态更改视图

我有一个MVC页面,我不确定从正确的行为模型生成视图的最佳方式是什么。该模型包含文本字段类的列表,每个类都包含一组要显示在视图中的文本字段(比如“HeadlineText”,“ButtonText”,“ColorText”等)。文本字段类的列表用于每个独特的语言由用户设置,以便他们可以为每种不同的语言创建一组文本字段。

在视图中有一个下拉列表,其中包含文本字段类列表中的每个语言/对象,并且我希望根据选择的语言选项在视图中更改显示的文本字段下拉列表(并相应地动态改变)。

我原来的计划是从模型中生成列表中的所有对象的查看HTML,只需使用JavaScript来隐藏/显示一组文本字段不属于所选语言在掇下表。我不太喜欢在页面上生成一堆额外html的想法,所以它可以通过javascript进行更改,但我没有看到更新视图的其他方式,而无需重新加载/重新生成视图(我' m试图使它看起来异步,没有回发)。

UPDATE:

的建议有关部分的看法似乎是我想要的,但我仍想知道的东西,其他的评论者没有对输入。也就是说,如果我想做部分视图,我仍然需要将文本字段绑定到父模型中的数据,并且(可能还有编辑器模板)仍然可以修改它们并在父视图/模型/表格提交保存。

我在bit.ly/N5DY5a和bit.ly/SVYqdT上读了一些其他的东西。如果我正确理解它们,我应该能够将文本字段列表对象或父模型传递给局部视图,以便视图将生成正确字段的编辑器模板,并将这些模板绑定到父模型,以便父表单提交时他们会保存吗?我没有得到什么工作还没有,但我仍然试图...

回答

1

解决方案

使用视图来渲染页面的第一次。

然后,当您选择的值更改时,使用ajax来获取新内容。

现在使用局部视图呈现被修改页面的一部分。

您的部分视图包含与您的视图相同的标记,但只是修改了部分。

在Controller

//get data 

if (!Request.IsAjaxRequest()) 
{ 
    return View(data); 
} 
else 
{ 
    return PartialView("myPartialView", data); 
} 

在视图

HTML

...  
<div id="partialView"></div> 
... 

jQuery的

<script type="text/javascript"> 
    $(function() { 
     $('#myDropdownlist').change(function() { 
      $.get('/controller/action' + $(this).find(':selected').val(), function (data) { 
       $('#partialView').html(data); 
      } 
     }); 
    }); 
</script> 
+0

我对http://bit.ly/N5DY5a和http://bit.ly/SVYqdT阅读一些其他的东西了。如果我正确理解它们,我应该能够将文本字段列表对象或父模型传递给局部视图,以便视图将生成正确字段的编辑器模板,并将这些模板绑定到父模型,以便父表单提交时他们会保存吗? – Tom 2012-07-26 17:13:17

+0

对不起,我不明白。 ':(' – 2012-07-26 17:50:02

1

您可以使用Ajax的局部视图做到这一点。

为每种语言创建一个局部视图,然后根据用户选择执行一次Ajax调用,以用局部视图更新/替换页面的一段。

more about partial views

+1

请参阅@GG的代码示例的答案,他打我了。:) – keshav 2012-07-25 23:03:49

相关问题