MVC Jquery Ajax Request error 0x800a138f - JavaScript runtime error: Object expected
MVC Jquery Ajax Request error 0x800a138f - JavaScript runtime error: Object expected
过去一个小时我一直在努力使用这个函数,我不确定出了什么问题,我有一个函数需要调用控制器操作并填充下拉列表,代码似乎在我声明 url 的行,它因未定义而失败并抛出上面的异常,知道我如何解决这个问题,任何帮助将不胜感激。
这是我的下拉定义
<div class="form-group">
@Html.LabelFor(m => m.Town, new { @class = "col-md-2 control-label" })
<div class="col-md-10">
@Html.DropDownList("Town", ViewBag.Town as SelectList)
</div>
</div>
<div class="form-group">
@Html.Label("Surburb", new { @class = "col-md-2 control-label" })
<div class="col-md-10">
@Html.DropDownList("Surburb", new SelectList(string.Empty, "Value", "Text"), "Please select a Surburb", new { style = "width:250px", @class = "dropdown1" })
</div>
</div>
这是我的 Jquery 请求
<script type="text/javascript" src="~/Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#Town").change(function () {
debugger;
var url = url("GetSurburbs", "Account");
$.post(url,{id : $("#Town").val()}).done(function(data){
alert('Success');
}).fail(function(data){
alert('failed');
});
})
})
</script>
应该是Url.Action
html辅助方法
var url = '@Url.Action("GetSurburbs", "Account")';
假设此代码在 razor 文件中。
这将执行 Url.Action
并设置 return 值,这是 GetSurburbs
操作方法到 url
变量的正确相对路径。
将 HTML 助手与外部 javascript 文件一起使用
上面的代码在 razor 文件中时会起作用,因为 razor 文件在服务器上执行。但是,如果您不喜欢在您的 js 代码中调用 html 辅助方法,您可以将此 url 值保留在视图标记中,并根据需要在您的 js 中从那里读取。
@Html.DropDownList("Surburb", new List<SelectListItem>(), "Please select a Surburb",
new { style = "width:250px", @class = "dropdown1",
data_url=Url.Action("GetSurburbs","Account") })
这将为您的 SELECT element.Now 生成 data-url 属性,只需读取此值并在您的 javascript 代码中使用即可。
var url = $("#Surburb").data("url");
您对 url 的定义不正确。您需要使用@Url.Action extension
<script type="text/javascript" src="~/Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#Town").change(function () {
debugger;
var url = '@Url.Action("GetSurburbs", "Account")';
$.post(url,{id : $("#Town").val()}).done(function(data){
alert('Success');
}).fail(function(data){
alert('failed');
});
})
})
</script>
过去一个小时我一直在努力使用这个函数,我不确定出了什么问题,我有一个函数需要调用控制器操作并填充下拉列表,代码似乎在我声明 url 的行,它因未定义而失败并抛出上面的异常,知道我如何解决这个问题,任何帮助将不胜感激。
这是我的下拉定义
<div class="form-group">
@Html.LabelFor(m => m.Town, new { @class = "col-md-2 control-label" })
<div class="col-md-10">
@Html.DropDownList("Town", ViewBag.Town as SelectList)
</div>
</div>
<div class="form-group">
@Html.Label("Surburb", new { @class = "col-md-2 control-label" })
<div class="col-md-10">
@Html.DropDownList("Surburb", new SelectList(string.Empty, "Value", "Text"), "Please select a Surburb", new { style = "width:250px", @class = "dropdown1" })
</div>
</div>
这是我的 Jquery 请求
<script type="text/javascript" src="~/Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#Town").change(function () {
debugger;
var url = url("GetSurburbs", "Account");
$.post(url,{id : $("#Town").val()}).done(function(data){
alert('Success');
}).fail(function(data){
alert('failed');
});
})
})
</script>
应该是Url.Action
html辅助方法
var url = '@Url.Action("GetSurburbs", "Account")';
假设此代码在 razor 文件中。
这将执行 Url.Action
并设置 return 值,这是 GetSurburbs
操作方法到 url
变量的正确相对路径。
将 HTML 助手与外部 javascript 文件一起使用
上面的代码在 razor 文件中时会起作用,因为 razor 文件在服务器上执行。但是,如果您不喜欢在您的 js 代码中调用 html 辅助方法,您可以将此 url 值保留在视图标记中,并根据需要在您的 js 中从那里读取。
@Html.DropDownList("Surburb", new List<SelectListItem>(), "Please select a Surburb",
new { style = "width:250px", @class = "dropdown1",
data_url=Url.Action("GetSurburbs","Account") })
这将为您的 SELECT element.Now 生成 data-url 属性,只需读取此值并在您的 javascript 代码中使用即可。
var url = $("#Surburb").data("url");
您对 url 的定义不正确。您需要使用@Url.Action extension
<script type="text/javascript" src="~/Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#Town").change(function () {
debugger;
var url = '@Url.Action("GetSurburbs", "Account")';
$.post(url,{id : $("#Town").val()}).done(function(data){
alert('Success');
}).fail(function(data){
alert('failed');
});
})
})
</script>