Fatal编程技术网
  • javascript/
  • Javascript 异步传递字符串以查看（Ajax）

Javascript 异步传递字符串以查看（Ajax）

javascript jquery ajax asp.net-mvc json

Javascript 异步传递字符串以查看（Ajax）,javascript,jquery,ajax,asp.net-mvc,json,Javascript,Jquery,Ajax,Asp.net Mvc,Json,我正在尝试创建一个视图，用户将在其中创建与文章关联的日期。当用户输入条形码时，应显示物品名称，以帮助用户确保输入的条形码正确 DateController中获取字符串并将其传递的方法： public JsonResult GetArticleName(long barcode) { ArticleDbContext artdb = new ArticleDbContext(); Article art = (Article) artdb.Articles.Where(a =>

我正在尝试创建一个视图，用户将在其中创建与文章关联的日期。当用户输入条形码时，应显示物品名称，以帮助用户确保输入的条形码正确

DateController中获取字符串并将其传递的方法：

public JsonResult GetArticleName(long barcode)
{
    ArticleDbContext artdb = new ArticleDbContext();
    Article art = (Article) artdb.Articles.Where(a => a.Barcode == barcode).First();
    return Json(art.Name, JsonRequestBehavior.AllowGet);
}

$("#ArticleBarcode").change(function (event) {
    var URL = "/Date/GetArticleName";
    $.getJSON(URL, { Barcode: $("#ArticleBarcode").val() }, function (data) {
        $.each(data, function (index, d) {
            $("#ArticleName").html(d);
        });
    });
});
获取数据的javascript:

public JsonResult GetArticleName(long barcode)
{
    ArticleDbContext artdb = new ArticleDbContext();
    Article art = (Article) artdb.Articles.Where(a => a.Barcode == barcode).First();
    return Json(art.Name, JsonRequestBehavior.AllowGet);
}

$("#ArticleBarcode").change(function (event) {
    var URL = "/Date/GetArticleName";
    $.getJSON(URL, { Barcode: $("#ArticleBarcode").val() }, function (data) {
        $.each(data, function (index, d) {
            $("#ArticleName").html(d);
        });
    });
});


问题是它似乎根本没有传递任何值。我该怎么办

PS:ArticleBarcode更改事件似乎未触发。

编辑：

public JsonResult GetArticleName(long barcode)
{
    ArticleDbContext artdb = new ArticleDbContext();
    Article art = (Article) artdb.Articles.Where(a => a.Barcode == barcode).First();
    return Json(art.Name, JsonRequestBehavior.AllowGet);
}

$("#ArticleBarcode").change(function (event) {
    var URL = "/Date/GetArticleName";
    $.getJSON(URL, { Barcode: $("#ArticleBarcode").val() }, function (data) {
        $.each(data, function (index, d) {
            $("#ArticleName").html(d);
        });
    });
});
整个Create.cshtml

model DatoCheckerMvc.Models.Date

@{
    ViewBag.Title = "Opret ny";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Opret</h2>

@using (Html.BeginForm("Create", "Date", FormMethod.Post, new { }))
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)


    <script type="text/javascript">
        function validationFunction() {
            var isValid = true;
            if (!$("#ArticleBarcode").val() || $("#ArticleBarcode").val() == "" || $("#ArticleBarcode").val().match("^\d+$")) {
                isValid = false;
            }
            if (!$("#RunDate").val() || $("#RunDate").val() == "" || $("#RunDate").val().match("((?:(?:[0-2]?\\d{1})|(?:[3][01]{1}))[-:\\/.](?:[0]?[1-9]|[1][012])[-:\\/.](?:(?:[1]{1}\\d{1}\\d{1}\\d{1})|(?:[2]{1}\\d{3})))(?![\\d])")) {
                isValid = false;
            }

            if (isValid) {
                return true;
            }
            else {
                return false;
            }
        }

        $(document).ready(function () {
            $(window).keydown(function (event) {
                if ((event.keyCode == 13) && (validationFunction() == false)) {
                    event.preventDefault();
                    return false;
                }
            });

            $("#ArticleBarcode").change(function (event) {
                alert("executed");
                $.getJSON('@Url.Action("GetArticleName", "Date")', { Barcode: $("#ArticleBarcode").val() }, function (data) {
                    $.each(data, function (index, d) {
                        $("#ArticleName").html(d);
                    });
                });
            });
        });
    </script>

    <fieldset>
        <legend>Dato</legend>
        <div class="row">
            <div class="form-group col-md-4">
                <div class="editor-label">
                    @Html.LabelFor(model => model.ArticleBarcode)
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(model => model.ArticleBarcode, null, new { @class = "form-control" })
                    @Html.ValidationMessageFor(model => model.ArticleBarcode)
                </div>
            </div>
        </div>

        <div class="row">
            <div class="form-group col-md-4">
                <div class="editor-label">
                    <label for="ArticleName">Varenavn</label>
                </div>
                <div class="editor-field">
                    <div id="ArticleName">

                    </div>


         </div>
        </div>
    </div>

    <div class="row">
        <div class="form-group col-md-4">
            <div class="editor-label">
                @Html.LabelFor(model => model.RunDate)
            </div>
            <div class="editor-field">
                @Html.TextBoxFor(model => model.RunDate, null, new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.RunDate)
            </div>
        </div>
    </div>
    <p>
        <input class="btn btn-default" type="submit" value="Opret" />
    </p>
</fieldset>

}

<div>
    @Html.ActionLink("Tilbage", "Index") </div>

@section Scripts 
{
    @Scripts.Render("~/bundles/jqueryval") 
}

model DatoCheckerMvc.Models.Date
@{
ViewBag.Title=“Opret ny”；
Layout=“~/Views/Shared/_Layout.cshtml”；
}
奥普拉特
@使用（Html.BeginForm（“Create”，“Date”，FormMethod.Post，new{}））
{
@Html.AntiForgeryToken（）
@Html.ValidationSummary（true）
函数验证函数（）{
var isValid=true；
如果（！$（“#ArticleBarcode”）.val（）|$（“#ArticleBarcode”）.val（）==”|$（“#ArticleBarcode”）.val（）.match（“^\d+$”）{
isValid=false；
}
若有（！美元（“35；运行日期）以及（“35；运行日期”运行日期）的（（（！！）以及（（（（！）以及（（（“#运行日期”）以及（（（（（“[运行日期）以及（（“[运行日期）运行日期））的（（（（（（：：：：（：（[除了除了除了除了除了除了除了除了除了运行日期）运行日期）之外，；；；；；；；；；）若（（（（（（（“[[[除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了除了（？！[\\d]））{
isValid=false；
}
如果（有效）{
返回true；
}
否则{
返回false；
}
}
$（文档）.ready（函数（）{
$（窗口）.keydown（函数（事件）{
if（（event.keyCode==13）&&（validationFunction（）==false））{
event.preventDefault（）；
返回false；
}
});
$（“#ArticleBarcode”）。更改（功能（事件）{
警报（“已执行”）；
$.getJSON（'@Url.Action（“GetArticleName”，“Date”），{Barcode:$（“#ArticleBarcode”）.val（）}，函数（数据）{
$。每个（数据，函数（索引，d）{
$（“#ArticleName”）.html（d）；
});
});
});
});
达托
@LabelFor（model=>model.ArticleBarcode）
@Html.TextBoxFor（model=>model.ArticleBarcode，null，新{@class=“form control”}）
@Html.ValidationMessageFor（model=>model.ArticleBarcode）
瓦雷纳夫
@LabelFor（model=>model.RunDate）
@TextBoxFor（model=>model.RunDate，null，新的{@class=“form control”}）
@Html.ValidationMessageFor（model=>model.RunDate）



}
@ActionLink（“Tilbage”，“Index”）
@节脚本
{
@Scripts.Render（“~/bundles/jqueryval”）
}
尝试使用与控制器中使用的名称相同的名称，如下所示

$.getJSON('@Url.Action("GetArticleName", "Date")', { barcode: $("#ArticleBarcode").val() }, function (data) {
        $.each(data, function (index, d) {
            $("#ArticleName").html(d);
        });
    });
使用“/Date/GetArticleName”可能会给您的下载带来问题

服务收到什么请求？你的要求是什么？（使用浏览器开发工具中的netpanel进行检查）。客户机收到的响应是什么？服务器作为响应发送什么？$.getJSON用于从服务器获取JSON数据，然后如何将其用于您的案例？@SivaRajini他正在使用它获取JSON数据，并将条形码参数传递给端点。尝试使用blur event而不是change，看看它是否有效。它已实现，但仍然无效。我在文章更改事件中插入了一个警报，它似乎没有触发。然后我猜您的jquery有问题，或者在jquery@highace2中绑定事件时检查是否有拼写错误没有jquery问题或拼写错误。但是请注意，ArticleBarcode是由html助手TextBoxFor生成的输入。您可以发布您的mvc代码吗？我的意思是TextBoxCode？JQuery是在布局页面的底部导入的。