Question

我正在尝试使用telerik在mvc 4中创建一个项目，我必须显示用户详细信息，并且应该能够使用弹出窗口创建，编辑和删除用户详细信息。我收到错误TypeError：jQuery（...）。tGrid不是一个函数。我在stackoverflow中提到了类似类型的许多问题并尝试了很多东西，但我总是得到同样的错误。我还检查了telerik.com站点，并在我的项目中包含了各种脚本文件。我在我的项目中使用javascript telerik和ajax。我包含的脚本文件是：

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-migrate/1.2.1/jquery-migrate.min.js"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/2013.2.611/jquery-1.7.1.min.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/2013.2.611/telerik.all.min.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/2013.2.611/telerik.grid.min.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/2013.2.611/telerik.common.min.js")"></script>
<script type="text/javascript" src="~/Scripts/2013.2.611/telerik.window.min.js"></script>               
<script type="text/javascript" src="~/Scripts/2013.2.611/jquery.validate.min.js"></script>

<script type="text/javascript">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>‌
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

我的javascript代码是：

$(document).ready(function () {
    $("#Users .t-grid-add")
        .first()
        .text("Add new User")
        .prepend("<span class='t-icon t-add'>");
});

function onError(e) {
    e.preventDefault();
    alert(e.XMLHttpRequest.getResponseHeader("message"));
}

function onDataBoundUsers() {
    replaceDeleteConfirmation(this, "User");
}

function onEditUsers(e) {
    var popup = $("#" + e.currentTarget.id + "PopUp");
    var popupDataWin = popup.data("tWindow");

    popup.css({ "left": "700px", "top": "400px" });

    if (e.mode == "insert")
        popupDataWin.title("Add new User");
    else
        popupDataWin.title("Edit User");

    $(e.form).find("#UserId").closest(".editor-field").prev().andSelf().hide();
}

function onExpandUser() {
    $(".t-detail-cell").css({
        "padding-left": "80px",
        "padding-bottom": "30px"
    });
}

function onLoadUsers(e) {
    replaceDeleteConfirmation(this, "User");
}

function replaceDeleteConfirmation(item, itemType) {
    var grid = $(item).data('tGrid');

    $(item).find('.t-grid-delete').click(function (e) {
        grid.localization.deleteConfirmation = "Are you sure you want to delete this " + itemType + "?";
    });
}



@(Html.Telerik().StyleSheetRegistrar()
    .DefaultGroup(group=> group.Add("telerik.common.css").Add("telerik.windows7.css").Combined(true).Compress(true)))
@(Html.Telerik().ScriptRegistrar().DefaultGroup(group => group
            .Compress(true)
            .Combined(true))
        .jQuery(false)
        )
@(Html.Telerik().ScriptRegistrar().CombinedComponentFile(true))

请提供帮助并回复

Answer 1

重新整理您的脚本加载，如下所示：

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
//Style sheets should be loaded at begining

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>‌
//Load jquery before loading any other js files

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-migrate/1.2.1/jquery-migrate.min.js"></script>

//<script type="text/javascript" src="@Url.Content("~/Scripts/2013.2.611/jquery-1.7.1.min.js")">
//</script> Remove this as you have already one version of jquery loaded

<script type="text/javascript" src="@Url.Content('~/Scripts/2013.2.611/telerik.all.min.js')"></script>
                                               //^^keep these in single quotes
<script type="text/javascript" src="@Url.Content('~/Scripts/2013.2.611/telerik.grid.min.js')"></script>
<script type="text/javascript" src="@Url.Content('~/Scripts/2013.2.611/telerik.common.min.js')"></script>
<script type="text/javascript" src="~/Scripts/2013.2.611/telerik.window.min.js"></script>               
<script type="text/javascript" src="~/Scripts/2013.2.611/jquery.validate.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

TypeError：jQuery（...）。tGrid不是telerik mvc 4中的函数

1 个答案: