ASP MVC 将值传递到模态窗口

2023-11-30

我有一个带有模态窗口的视图。当我点击打开模态窗口时,我想传递参数item.InstrumentId进入模式窗口,以便我可以单击一个链接,将我重定向到属于 InstrumentId 的特定仪器的页面。我在下面所做的成功地将 InstrumentId 传递到窗口中,但问题是我不知道如何将该值传递到窗口中Html.ActionLink。关于我如何继续的任何提示?

   @foreach (var item in Model)
    {
        <li class="list-group-item">
            <div class="row">
                <div class="col-md-4">
                    <h4>
                        Instrument: @item.InstrumentId
                    </h4>
                </div>
                <div class="col-md-4">
                    @item.Type
                </div>
                <div class="col-md-4">
                    <!-- Button trigger modal -->
                    <button type="button" class="open-dialog btn btn-primary btn-sm" data-toggle="modal" data-target="#myModal" data-id="@item.InstrumentId">
                        View details
                    </button>

                    <script type="text/javascript">
                        $(document).on("click", ".open-dialog", function() {
                            var modalId = $(this).data('id');
                            $(".modal-dialog #myModal").val(modalId);
                        })
                    </script>
                    <!-- Modal -->
                    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                        <div class="modal-dialog" role="document">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                    <h4 class="modal-title" id="myModal"></h4>
                                </div>
                                <div class="modal-body">
                                    @item.Message
                                    <br/> <br/> <br/>
                                    <div class="row">
                                        <div class="col-md-4">
                                            Slide: <a href="/Home/Slide" class="Button">1234500323</a>
                                        </div>
                                        <div class="col-md-4">
                                            Instrument: @Html.ActionLink(item.InstrumentId, "Instrument", new {instrumentid = item.InstrumentId})
                                        </div>
                                        <div class="col-md-4">
                                            Checked: @item.Checked
                                        </div>
                                    </div>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                    <button type="button" class="btn btn-primary">Save changes</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </li>
    }

UPDATE

<div>
<ul class="list-group">
    @foreach (var item in Model)
    {
        <li class="list-group-item">
            <div class="row">
                <div class="col-md-4">
                    <h4>
                        Instrument: @item.InstrumentId
                    </h4>
                </div>
                <div class="col-md-4">
                    @item.Type
                </div>
                <div class="col-md-4">
                    <!-- Button trigger modal -->
                    <button type="button" class="open-dialog btn btn-primary btn-sm" data-url="@Url.Action("Instrument", new {instrumentid = @item.InstrumentId})">
                        View details
                    </button>

                    <script type="text/javascript">
                        $(document).on("click", ".open-dialog", function() {
                            $('#details').attr('href', $(this).data('url')); // update the links url
                        });
                    </script>
                </div>
            </div>
        </li>
    }
</ul>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            </div>
            <div class="modal-body">
                @*@item.Message*@
                <br /> <br /> <br />
                <div class="row">
                    <div class="col-md-4">
                        Slide: <a href="/Home/Slide" class="Button">1234500323</a>
                    </div>
                    <div class="col-md-4">
                        Instrument: <a id="details" href="#">Details</a>
                    </div>
                    <div class="col-md-4">
                        Checked: @*@item.Checked*@
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">Save changes</button>
            </div>
        </div>
    </div>
</div>


您当前为集合中的每个项目生成一个模式,但给它一个id="myModal"这是无效的 html,意味着data-target="#myModal"只会打开第一个。将模态移到循环之外,这样您就只创建一个(并且还删除了<h4 class="modal-title" id="myModal"></h4>也有相同的元素id属性)

然后将按钮 html 更改为

<button type="button" class=".." .. data-url="@Url.Action("Instrument", new { instrumentid = item.InstrumentId })">

并将模态中的html更改为

Instrument: <a id="details" href="#">Details</a>

然后将脚本更改为

$(document).on("click", ".open-dialog", function() {
    $('#details').attr('href', $(this).data('url')); // update the links url
})

旁注:您可能想做类似的事情Checked: @item.Checked在模态中

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

ASP MVC 将值传递到模态窗口 的相关文章

  • Ajax 表单从 Jquery 对话框内重定向页面

    我在部分视图中有一个 jquery 对话框 model JQueryDialogPoc Models FeedBack using Ajax BeginForm GiveFeedback Home null new AjaxOptions
  • Chrome 中的性能问题

    我目前正在从事一个相对较大的项目 使用 AngularJs 构建 应用程序的一部分是一个表单 您可以向其中添加任意数量的页面 不幸的是 添加了很多不必要的垃圾 即表示表单模型的对象可能会变得非常大 在某些时候 Chrome 基本上无法处理它
  • 如何使用asp.net检查li点击事件以进行代码隐藏

    我有列表 li 我想知道单击哪个选项可以在后面编写代码 我怎么可能 ul class mega select sort li class filter wrap a href class mega select filter filter
  • 如何针对 Node.js 中发生的每个错误发送电子邮件?

    假设我的 node js 应用程序正在运行 如果出现错误 我的意思是所有错误 不仅仅是网络错误 如果出现错误 则很重要 我如何调用函数向我发送电子邮件 基本上 在我希望它写入 err out 之前 我希望向我发送一封电子邮件 我正在使用no
  • 在打字稿中导入 json

    我是 typescript 的新手 在我的项目中 我们使用 typescript2 在我的要求之一中 我需要导入 json 文件 所以我创建了 d ts 文件如下 test d ts declare module json const va
  • Draggable JS Bootstrap 模式 - 性能问题

    对于工作中的项目 我们在 JavaScript 中使用 Bootstrap Modal 窗口 我们想让一些窗口可移动 但我们遇到了 JQuery 的性能问题 myModal draggable handle modal header Exa
  • 防止 iOS 键盘在 cordova 3.5 中滚动页面

    我正在使用 Cordova 3 5 和 jQuery mobile 构建 iOS 应用程序 我在大部分应用程序中禁用了滚动功能 但是 当我选择输入字段时 iOS 键盘会打开并向上滚动页面 我不想要这个功能 由于输入足够高 键盘不会覆盖它 我
  • 如何将函数附加到弹出窗口关闭事件(Twitter Bootstrap)

    我做了一些搜索 但我只能认为我可以将事件附加到导致其关闭的按钮 https stackoverflow com questions 13205103 attach event handler to button in twitter boo
  • 调整图像大小并将画布旋转 90 度

    这里有很多关于在 js 上使用画布旋转图像的主题 我阅读了其中的大部分内容 但无法找到解决我的问题的方法 我正在接收任何分辨率的图像 来自上传组件 我将其大小调整为 1024x768 如下所示 var canvas document cre
  • 如何解决 Typescript 构建中的错误“找不到模块 'jquery'”

    我目前在 ts 文件的顶部有这个import require jquery 我这样做是因为我试图在我的打字稿文件中使用 jquery 但我似乎无法编译它 因为它返回标题中所述的错误 我正在使用 ASP NET CORE 脚本文件夹 tsco
  • 将 UMD Javascript 模块导入浏览器

    你好 我正在对 RxJS 进行一些研究 我可以通过在浏览器中引用它来使用该库 如下所示 它使用全局对象命名空间变量 Rx 导入 我可以制作可观察的东西并做所有有趣的事情 当我将 src 更改为指向最新的 UMD 文件时 一切都会崩溃 如下所
  • 不可勾选的单选按钮与专有的复选框

    从 UI 角度来看 是拥有一组具有取消选中功能的单选按钮更好 还是拥有一组独占的复选框 意味着一次只能选中一个 更好 Update 我没想到对此会有如此负面的反应 如果我给出一个更接近其使用方式的示例 也许会有所帮助 我有一个充满数据绑定内
  • Vuejs 2:去抖动不适用于手表选项

    当我在 VueJs 中反跳此函数时 如果我提供毫秒数作为原语 它就可以正常工作 但是 如果我将其提供为对 prop 的引用 它会忽略它 这是道具的缩写版本 props debounce type Number default 500 这是不
  • 如何在整个 ASP .NET MVC 应用程序中需要授权

    我创建的应用程序中 除了启用登录的操作之外的每个操作都应该超出未登录用户的限制 我应该添加 Authorize 每个班级标题前的注释 像这儿 namespace WebApplication2 Controllers Authorize p
  • Javascript 假值(null、未定义、false、空字符串:“”或 '' 和 0)和比较(==)运算符 [重复]

    这个问题在这里已经有答案了 当我使用任何一个值时 null undefined false 0 in a if陈述 它总是被评估为谬误 false 另外 这些值的否定 null undefined false 0 in a if语句总是被评
  • Firebase 函数 onWrite 未被调用

    我正在尝试使用 Firebase 函数实现一个触发器 该触发器会复制数据库中的一些数据 我想观看所有添加的内容votes user vote 结构为 我尝试的代码是 const functions require firebase func
  • 服务器不支持 C# 中的安全连接

    我在下面的代码中收到错误 服务器不支持安全连接 SmtpClient smtp new SmtpClient MailMessage mail new MailMessage mail From new MailAddress gmail
  • 用于交互式图形绘制的轻量级 JavaScript 库? [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 我有兴趣了解用于绘制交互式图表的最轻量级 javascript 库 我掌握的数据主要是与海洋研究相关的科学数据 我知道一些 jquery
  • JavaScript 相对路径

    在第一个 html 文件中 我使用了一个变量类别链接 var categoryLinks Career prospects http localhost Landa DirectManagers 511 HelenaChechik Dim0
  • 使用 MongoDB 和 Nodejs 插入和查询日期

    我需要一些帮助在 mongodb 和 nodejs 中按日期查找记录 我将日期添加到抓取脚本中的 json 对象 如下所示 jsonObj last updated new Date 该对象被插入到 mongodb 中 我可以看到如下 la

随机推荐

  • 在 React 循环内多次调用 setter 时状态未正确更新

    我想一键将多个对象发送到购物车 为此 我循环一个数组并调用addProductToCart但它只保存最后一个对象CartContext state 当逐个发送对象时 来自不同页面 或者如果发送的是同一页面的一些对象 但不是全部 它会保存在状
  • SQLConfigDataSource 不添加 64 位驱动程序的系统 DSN

    我从加载 odbccp32 dllSystem32甚至尝试使用来自SysWow64 I use SQLConfigDataSource函数为指定的驱动程序配置我的系统 DSN 此函数可以成功配置 32 位驱动程序 但不能对 64 位驱动程序
  • 在文件中查找文本并检索行号

    我试图 以编程方式 在大量 VB6 文件中查找对特定字符串 即 LOCK ID 的引用 为了帮助人们直接导航到参考 我还想检索匹配的行号 IE 搜索所有 VB6 文件以供参考 如果找到引用 我想检索引用所在的行号 除了打开目录中的每个文件并
  • Unicode 转换为字符串留下前导字节顺序标记[重复]

    这个问题在这里已经有答案了 在我的 NET 3 5 C 应用程序中 我将 unicode 编码的字节数组转换为字符串 字节数组如下 255 254 85 0 83 0 69 0 Using Encoding Unicode GetStrin
  • NPM 获取失败

    这是一个快速的 npm install socket io npm http GET https registry npmjs org socket io npm http 304 https registry npmjs org sock
  • ES6 模块:导入后未定义 onclick 函数

    我正在测试 ES6 模块并希望让用户使用以下命令访问一些导入的函数onclick 测试 html
  • 在 C# 中拖放矩形

    我想知道如何在 C 中绘制矩形 并将其拖放到页面中 我的代码用于绘制它 但我无法拖放它 public partial class Form1 Form public bool drag false int cur x cur y Recta
  • 如何在 Pygame 中对对象或精灵的位置进行动画处理,并将其移向预定义的位置或沿着定义的路径移动?

    我学会了如何在pygame中打印图像 但我不知道如何制作动态位置 它可以自行改变图像位置 我错过了什么 这是我的尝试 import pygame screen size 360 600 screen pygame display set m
  • 从字符串到 MongoDB ObjectID 的转换

    我尝试将字符串 ID 转换为 MongoDB ObjectID public class relevancy test extends Object implements Comparable
  • 在 Android 应用程序中使用 startActivityForResult

    我写了一个应用程序 其中有一个
  • 尝试使用 JSON.Net 使用 SmartyStreets JSON...“无法将 JSON 数组反序列化为组件类型”

    我正在尝试使用 SmartyStreets JSON LiveAddress API 但遇到了一些困难 我承认我对 JSON 不太熟悉 无论如何 我尝试了几种不同的方法 但通常会出现错误 无法将 JSON 数组反序列化为元数据类型 这是 J
  • AJAX 表单提交后重定向

    使用 MVC 4 我有一个部分视图表单 其中包含 Ajax BeginForm 表单按预期提交 结果异步显示在我的主视图中 我想要我的控制器上有一个条件 如果我的表单上的某个参数为真 那么它会重定向到一个全新的页面 而不是在我的主视图中显示
  • 使用 R 下载并读取压缩的 xml 文件

    基于thisDirk Eddelbuettel 的回答 我正在尝试阅读xml文件来自zip存档以供进一步处理 除了 URL 和文件名之外 对引用的代码的唯一更改是我更改了read table to xmlInternalTreeParse
  • 检测输入数字中向上/向下按钮的不同事件

    有没有办法区分输入类型数字的事件向上 向下按钮 我读到有一个change事件 但我想知道我是否可以识别按下向上 向下按钮时的不同事件 我会更清楚
  • SQL Server 中的服务器端分页

    我对 SQL Server 如何使用公用表表达式和 ROW NUMBER 实现更少的读取和性能改进感到有点困惑 为什么表达式中实现的表不必执行普通查询必须执行的所有读取操作 以允许查询使用 ROW NUMBER 进行排序 The CTE不是
  • UiView 内的 IOS swift avplayer 我怎样才能让它工作

    我刚开始使用 AVPlayer for IOS swift 并让它正常工作 不过 我希望视频现在可以在 UIView 内播放 默认情况下视频会占据整个页面 我一直在尝试一些事情 但我的代码没有任何作用 我在该页面上还有其他内容 这就是为什么
  • Android 在WebView中调用JavaScript函数

    我试图调用一些位于 android webview 内运行的 html 页面中的 javascript 函数 下面的代码尝试执行的操作非常简单 从 android 应用程序中 使用测试消息调用 javascript 函数 该函数又调用 an
  • 倒计时至特定日期

    我想做的事情看起来应该很简单 但事实证明很棘手 我需要一个倒计时脚本 它使用目标日期并为我提供三个单独的数字 即距该日期的天数 小时数和分钟数 然后我可以将其插入页面的适当位置 我尝试了 jCountdown 但虽然它是高度可定制的 但我仍
  • php 解析字符串并替换子字符串

    我有一个 PHP 字符串 该字符串出现了该模式 abc some substring xyz 此类子字符串在主字符串中多次出现 每个出现的地方都需要替换为数组中的字符串array substring1 substring2 substrin
  • ASP MVC 将值传递到模态窗口

    我有一个带有模态窗口的视图 当我点击打开模态窗口时 我想传递参数item InstrumentId进入模式窗口 以便我可以单击一个链接 将我重定向到属于 InstrumentId 的特定仪器的页面 我在下面所做的成功地将 Instrumen