部分加载后点击MVC按钮

本文关键字:MVC 按钮 加载 | 更新日期: 2023-09-27 18:18:42

我有一个页面,我正在显示笔记,并单击一个按钮后,我希望能够添加一个笔记。下面的代码是我尝试加载create note操作结果的部分。

<script type="text/javascript">
    (function() {
    $('#load-partial'.click(function(){
        $('#partial'.load('/EntityController/CreateNote/');});
    })();    
</script>
<div id="partial"></div>
<button type="button" id="load-partial" />

但是,单击按钮不做任何事情。这里出了什么问题?

部分加载后点击MVC按钮

Darin Dimitrov的建议非常好。进入下一关

你需要使用url帮助器:$('#partial').load('@Url. js ')行动("CreateNote"、"实体")');

为了使此操作不引人注目(并将java脚本移动到文件中),您需要使用@URL帮助器来设置操作属性/值,然后在JavaScript中获取操作属性值。在我的下拉列表教程中,我做了以下操作:

     @using (Html.BeginForm("IndexDDL", "Home", FormMethod.Post, 
new { id = "CountryStateFormID",
 StateListAction = @Url.Action("StateList") })) {

——then在JavaScript

$('#CountriesID').change(function () {
    var CountryStateFormID = $('#CountryStateFormID');
    $.getJSON(CountryStateFormID.attr('StateListAction') + '/' + $('#CountriesID').val(), function (data) {

你还应该使用IE9/F12开发工具或Chrome或FF来调试你的代码。

这里出了什么问题?

对于初学者来说,在你所展示的内容中有很多javascript错误。在订阅像click这样的事件之前,也不等待DOM准备好。您刚刚创建了一个立即执行的匿名函数,而无需等待DOM准备好。应该是这样的:

<script type="text/javascript">
    $(function() {
        $('#load-partial').click(function() {
            $('#partial').load('@Url.Action("CreateNote", "Entity")');
        });
    });    
</script>
<div id="partial"></div>
<button type="button" id="load-partial" />

除此之外,这里可能会有无数的事情出错(不幸的是,我们不能从您提供的糟糕的代码片段中排除):

    你忘了引用jquery
  • 你引用jquery后,你已经显示的脚本
  • 你引用了jquery但是提供了一个错误的url
  • 应该返回局部的控制器动作不存在
  • 应该返回部分的控制器动作抛出异常
  • 应该返回分部视图的控制器动作不会抛出异常,但它不会在(按约定)搜索位置中找到分部视图
  • 应该返回分部的控制器动作不会抛出异常,它找到分部,但在这个分部中有一个错误(语法错误,空引用异常,…)这个列表也无限)
  • 在生成操作的url时没有使用url helper,所以如果将此应用程序部署在虚拟目录中,则/EntityController/CreateNote/ url可能是错误的。你需要使用url帮助:$('#partial').load('@Url.Action("CreateNote", "Entity")');
  • 您使用/EntityController作为控制器名称,但根据约定,控制器后缀仅在命名控制器类时使用,而不是在引用url时使用。所以url应该是/entity/createnote(参见前面的正确生成url的原因)。
  • 你有一些javascript错误在页面的一部分,你没有显示。使用javascript调试工具,如FireBug来调试脚本和AJAX请求。
  • …这个列表一直到无穷远