如何通过JS将值传递给控制器​​和部分视图 - javascript

我正在尝试实现一个系统,其中将文本框中的值传递到局部视图,在该视图中将显示与该值相对应的详细信息。因此,例如,如果作业“ 1”在文本框中,则部分视图将返回该作业的详细信息,以供用户更改等。关于如何将值传递给控制器​​的任何想法,然后是部分视图?

Job.js

  $(document).ready(function () {
        $('#qr-value').on('change', function () {
            if ($('#qr-value').val() == 'Job 1') {

                $("#second").show(1000);
            }
        });
    });

CameraInfo(局部视图)

    model JobTracker.Models.Job

<h2>Edit and Confirm</h2>

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>Job</legend>

        @Html.HiddenFor(model => model.JobID)

       <div class="editor-label">
            @Html.LabelFor(model => model.OrderID, "Order")
        </div>
        <div class="editor-field">
            @Html.DropDownList("OrderID", String.Empty)
            @Html.ValidationMessageFor(model => model.OrderID)
        </div><br />

      <div class="editor-label">
            @Html.LabelFor(model => model.LocationID, "Location")
        </div>
        <div class="editor-field">
            @Html.DropDownList("LocationID", String.Empty)
            @Html.ValidationMessageFor(model => model.LocationID)
        </div><br />

        <div class="editor-label">
            @Html.LabelFor(model => model.HighPriority)
        </div>
        <div class="editor-field">
            @Html.DropDownListFor(model => model.HighPriority, new SelectList(
        new[] 
        { 
            new { Value = "Yes", Text = "Yes" },
            new { Value = "No", Text = "No" },
        },
         "Value",
         "Text",
        Model
    ))

            @Html.ValidationMessageFor(model => model.HighPriority)
        </div><br />

        <div class="editor-label">
            @Html.LabelFor(model => model.Comments)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Comments)
            @Html.ValidationMessageFor(model => model.Comments)
        </div><br />

          <div class="editor-label">
            @Html.LabelFor(model => model.Status)
        </div>
        <div class="editor-field">
               @Html.DropDownListFor(model => model.Status, new SelectList(
        new[] 
        { 
            new { Value = "In Progress", Text = "In Progress" },
            new { Value = "Completed", Text = "Completed" },
            new { Value = "Not Started", Text = "Not Started" },
            new { Value = "Stopped", Text = "Stopped" },
        },
         "Value",
         "Text",
        Model
    ))
            @Html.ValidationMessageFor(model => model.Status)
        </div><br />

        <p>
            <input type="submit" value="Save" />
        </p>
    </fieldset>
}

<div>
    @Html.ActionLink("Back to Home Page", "Index","Home")
</div>

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

作业控制器

//
        // GET:/ Job / Edit / 5

    public ActionResult Edit(int id = 0)
    {
        Job job = db.Jobs.Find(id);
        if (job == null)
        {
            return HttpNotFound();
        }
        ViewBag.LocationID = new SelectList(db.Locations, "LocationID", "LocationName", job.LocationID);
        ViewBag.OrderID = new SelectList(db.Orders, "OrderID", "OrderID", job.OrderID);
        return View(job);
    }

    //
    // POST: /Job/Edit/5

    [HttpPost]
    public ActionResult Edit(Job job)
    {
        if (ModelState.IsValid)
        {
            db.Entry(job).State = EntityState.Modified;
            db.SaveChanges();
            return RedirectToAction("Index");
        }
        ViewBag.LocationID = new SelectList(db.Locations, "LocationID", "LocationName", job.LocationID);
        ViewBag.OrderID = new SelectList(db.Orders, "OrderID", "OrderID", job.OrderID);
        return View(job);
    }

参考方案

<div id='Sample'></div>

如果要加载部分视图,请使用ajax。

$(document).ready(function () {
    $('#qr-value').on('change', function () {
       $.ajax({
        type: "Get",
        url: '@Url.Action("Edit", "job")',
        data: { id: $('#qr-value').val()},
        success: function (response) {
        $('#Sample').html(response);
        },
        error: function (response) {
        if (response.responseText != "") {
             alert(response.responseText);
             alert("Some thing wrong..");
           }
       }
     });
    });
});


 [HttpGet]
 public ActionResult Edit(int id = 0)
 {
  Job job = db.Jobs.Find(id);
    if (job == null)
    {
        return HttpNotFound();
    }
    ViewBag.LocationID = new SelectList(db.Locations, "LocationID", "LocationName", job.LocationID);
    ViewBag.OrderID = new SelectList(db.Orders, "OrderID", "OrderID", job.OrderID);

  return PartialView("Edit",job);
 }

希望这可以帮助

在PHP文件中调用javascript函数并在加载HTML文件之后? - javascript

我需要在我的php中调用js函数,但无法正常工作。有人可以告诉我我在做什么错吗?我该如何轻松地做到这一点?谢谢!我有三个文件:  mail.php负责发送$ _POST的内容(工作正常)。我调用我的javascript函数来切换模式,具体取决于邮件是否已发送。 <? ... $response = $sendgrid->send($email);…

将Web用户控件添加到页面时,asp按钮onclick不会触发 - javascript

我正在使用使用Visual Studio模板创建的Web表单应用程序。模板具有一个内容占位符,该占位符被访问的任何页面的内容替换。有问题的页面有几个服务器控件,例如文本框,标签和按钮。当我单击我的更新按钮时,它可以正常工作,这些值会回传并更新数据库。我想在所有子页面上创建通用的登录提示。我的导航栏(位于我的母版页中)具有引导程序设置。我在导航栏中添加了一个下…

Telerik单选按钮所需的字段验证器 - javascript

如何设置Telerik单选按钮所需的字段验证器?我想在按钮单击“ BtnSave”上设置必填字段验证器吗?请帮忙!<telerik:RadButton ID="radio_male" runat="server" ToggleType="Radio" AutoPostBack="fa…

用symfony隐藏树枝中的表格行 - javascript

我正在开始编码。我正在使用Symfony 3.3我想用复选框隐藏(并显示)表上的a或某些特定行。我尝试使用javascript和jquery。我希望隐藏的行保持隐藏状态。我不知道该怎么做。这是我的树枝{% block body %} <div class="container"> <h3>List of produ…

表单不提交或按钮提交不起作用 - javascript

据我所知,此代码必须有效,但是我编码时却无效问题在于该表单未提交。我该如何解决?选中时,我什至没有得到复选框的值。<table id="example" class="display" cellspacing="0" width="100%"> <thead&g…