Question

似乎有几种方法可以做到这一点。我真的希望这部影片对我有用。 https://www.youtube.com/watch?v=oHWEs8XWA2U

在网上搜索时，我发现很难找到这个问题，所以我想知道是否已经实施了更新和改进的（更简便的）方法。

这是我的家庭控制器

output

这是我想在其上弹出的视图

   public class HomeController : Controller
    {
        public ActionResult Index()
        {
            return View();
        }

        public ActionResult PartialViewTest()
        {
            return PartialView();
        }
        [HttpPost]
        public ActionResult PartialViewTest(Person person)
        {
            return View();
        }
        public ActionResult About()
        {
            ViewBag.Message = "Your application description page.";

            return View();
        }

        public ActionResult Contact()
        {
            ViewBag.Message = "Your contact page.";

            return View();
        }
    }
}

这是我的部分看法

@{
    ViewBag.Title = "Contact";
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button type="button" class="btn-block" style="width:225px">Modal </button>
<div class="modal fade" id="myModal" role="dialog" data-url='@Url.Action("PartialViewTest","Home")'></div>

<script type="text/javascript">
    $(document).ready(function () {

        $('.btn-block').click(function () {

            var url = $('#myModal').data('url');
            $.get(url, function (data) {

                $("#myModal").html(data);
                $("#myModal").modal('show');
            });
        });

    });
</script>

Page view when running

当我单击上图所示的按钮时。什么都没发生。为什么没有显示弹出视图？

如果这不是解决问题的最佳方法，您是否可以提供指向该教程的链接，以获得最专业，最适当，最简单的方法来完成此操作？

Answer 1

如果这是Bootstrap，则局部视图的模式HTML会损坏。 modal-body和modal-footer在modal-header下。我很确定modal-header，modal-body和modal-footer必须是modal-content的直接子代，并且需要是modal-dialog的子代，并且必须是modal-child的子代，并且这些容器divs在那里包装着他们。

编辑：您的问题是尝试使用它们后正在加载jquery和bootstrap。 public class SensorMapReducer { public static class SensorMapper extends Mapper<Object, Text, Text, Text>{ public void map(Object key, Text value, Context context) throws IOException, InterruptedException { String line = value.toString(); if(line.startsWith("s")) processSensorLine(line,context); else processSimulatorLine(line,context); } private void processSensorLine(String line, Mapper<Object, Text, Text, Text>.Context context) throws IOException, InterruptedException { String[] values = line.split(","); Calendar gc = DatatypeConverter.parseDateTime(values[1]); Text bucket = new Text(String.format("%4d-%02d-%02dT%02d:%02d:00Z", gc.get(Calendar.YEAR), gc.get(Calendar.MONTH) + 1, gc.get(Calendar.DAY_OF_MONTH), gc.get(Calendar.HOUR), gc.get(Calendar.MINUTE))); context.write(bucket, new Text("ACC," + values[2] + "," + values[3] + "," + values[4])); context.write(bucket, new Text("GYRO," + values[5] + "," + values[6] + "," + values[7])); context.write(bucket, new Text("MAG," + values[8] + "," + values[9] + "," + values[10])); context.write(bucket, new Text("REST," + values[11] + "," + values[12] + "," + values[13] + "," + values[14])); } private void processSimulatorLine(String line, Mapper<Object, Text, Text, Text>.Context context) throws IOException, InterruptedException { String[] values = line.split(","); Calendar gc = DatatypeConverter.parseDateTime(values[1]); Text bucket = new Text(String.format("%4d-%02d-%02dT%02d:%02d:00Z", gc.get(Calendar.YEAR), gc.get(Calendar.MONTH) + 1, gc.get(Calendar.DAY_OF_MONTH), gc.get(Calendar.HOUR), gc.get(Calendar.MINUTE))); context.write(bucket, new Text("PF" + values[6])); } } public static class SensorReducer extends Reducer<Text, Text, Text, Text> { public void reduce(Text key, Iterable<Text> values, Context context) throws IOException, InterruptedException { XYZ acc = new XYZ(), gyro = new XYZ(); Single mlux = new Single(), temp = new Single(), pressure = new Single(), rh = new Single(); int pass = 0, fail = 0; for(Text value : values) { String val = value.toString(); if(val.startsWith("ACC")) acc.process(val); else if(val.startsWith("GYRO")) gyro.process(val); else if(val.startsWith("REST")) { String[] vals = val.split(","); mlux.process(vals[1]); temp.process(vals[2]); pressure.process(vals[3]); rh.process(vals[4]); } else if(val.startsWith("PF")) { String pf = val.substring(2); if(pf.equalsIgnoreCase("1")) pass++; else fail++; } **// On my environment, if I don't do this it fails for no reason that I can see, but // I DO NOT WANT THIS LINE TO BE WRITTEN!!!!** context.write(key,new Text(val)); } StringBuffer sb = new StringBuffer(); acc.append(sb); sb.append('\t'); gyro.append(sb); sb.append('\t'); mlux.append(sb); sb.append('\t'); temp.append(sb); sb.append('\t'); pressure.append(sb); sb.append('\t'); rh.append(sb); sb.append('\t'); sb.append(pass); sb.append('\t'); sb.append(fail); context.write(key, new Text(sb.toString())); } } private static class Single { private int val, count, min, max; private void process(String val) { int v = Double.valueOf(val).intValue(); this.val += v; this.count++; max = max > v ? max : v; min = min > v ? min : v; } public void append(StringBuffer sb) { if(count > 0) sb.append(val/count); else sb.append(""); sb.append('\t'); sb.append(min); sb.append('\t'); sb.append(max); } } private static class XYZ { double x, y, z; double xMax = 0.0, yMax = 0.0, zMax = 0.0; double xMin = 0.0, yMin = 0.0, zMin = 0.0; int count = 0; public void process(String val) { String[] vals = val.split(","); double x = Double.valueOf(vals[1]); double y = Double.valueOf(vals[2]); double z = Double.valueOf(vals[3]); xMax = xMax < x ? x : xMax; yMax = yMax < y ? y : yMax; zMax = zMax < z ? z : zMax; xMin = xMin < x ? x : xMin; yMin = yMin < y ? y : yMin; zMin = zMin < z ? z : zMin; this.x += x; this.y += y; this.z += z; count++; } public void append(StringBuffer sb) { sb.append(x/count); sb.append('\t'); sb.append(xMin); sb.append('\t'); sb.append(xMax); sb.append('\t'); sb.append(y/count); sb.append('\t'); sb.append(yMin); sb.append('\t'); sb.append(yMax); sb.append('\t'); sb.append(z/count); sb.append('\t'); sb.append(zMin); sb.append('\t'); sb.append(zMax); } } public static void main(String[] args) throws IllegalArgumentException, IOException, ClassNotFoundException, InterruptedException { Configuration conf = new Configuration(); Job job = Job.getInstance(conf, "word count"); job.setJarByClass(SensorMapper.class); job.setMapperClass(SensorMapper.class); job.setCombinerClass(SensorReducer.class); job.setReducerClass(SensorReducer.class); job.setOutputKeyClass(Text.class); job.setOutputValueClass(Text.class); FileInputFormat.addInputPath(job, new Path(args[0])); FileOutputFormat.setOutputPath(job, new Path(args[1])); System.exit(job.waitForCompletion(true) ? 0 : 1); } }在加载脚本之前运行。您需要将其放入<script>部分。

Camilo Terevin注意，您需要从视图中删除jQuery脚本标签。您已经捆绑了jQuery。

Answer 2

“当我单击上图所示的按钮时，什么都没发生。”->我刚刚尝试了您的代码，它起作用了，模态正在打开。让Camilo Terevin发表评论，您应该在Chrome中按12，然后在控制台标签中检查错误。

模式打开后，代码中缺少什么？在模式中使用“人”模型，创建帖子表格，然后将“确定”按钮设置为提交

@model Person //Should contain person model namespace
@Html.BeginForm("PartialViewTest", "Home", FormMethod.Post)
{
<div class="container">
    <div class="row">
        <div class="col-sm-4"></div>
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModal-label">Bootstrap Dialog</h4>
                <div>

                    <div class="modal-body">
                        <div class="form-group">
                            @Html.TextBoxFor(p => p.name)
                        </div>
                        <div class="form-group">
                            @Html.TextBoxFor(p => p.adress)
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="submit" class="btn btn-primary" id="btnOK" onclick="">OK</button>
                        <button class="btn btn-default" data-dismiss="modal" id="btnCancel">Cancel</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
}

您的发布操作应重定向到索引。

[HttpPost]
public ActionResult PartialViewTest(Person person)
{
    /* do things */
    return RedirectToAction("Index");
}

如何在MVC 5中使用部分视图获取弹出窗口

2 个答案: