使用 AJAX 在 Bootstrap Modal 上调用 PHP 函数

2024-03-14

我使用 PHP 循环在我的页面上回显了用户列表。当我单击每个用户的名称时,会弹出一个 Bootsrap 模态并显示该用户的更多详细信息。链接看起来像这样。

<a href="#user"  data-toggle="modal"  data-id="{$user['id']}">UserName</a>

如您所见,我将用户的 ID 传递给 Bootstrap 模式,以便我可以通过调用它来检索用户的其他信息get_user_by_id()在引导模态中。

模态看起来像这样

<div class="modal fade" id="user">
    <div class="modal-header">
        <button class="close" data-dismiss="modal">×</button>
        <h3>Modal header</h3>
    </div>
    <div class="modal-body">
        <?php
          $user = get_user_by_id($id);
         ?>
        <input type="text" name="bookId" id="bookId" value=""/>
    </div>
</div>

JS代码是这样的

$('#user').on('show.bs.modal', function (event) {
   var button = $(event.relatedTarget)
   var id = button.data('id')
})

根据上面的JS代码,我的用户ID在var id多变的。 但是,我无法想象如何使用上述 PHP 函数的该值作为参数。

有什么可能的办法吗?

我已经编辑了这个问题,使其关于 AJAX 方法更加独特,大多数答案都基于 AJAX

PS:我对 PHP 和 Bootstrap 很陌生。


你会想要使用ajax http://api.jquery.com/jquery.ajax/运行 PHP。正如 @Tom 所说,在 DOM 中加载后,javascript 无法访问 PHP。 PHP 是一种服务器端语言,只能这样访问。

一旦你通过ajax连接到PHP,你就可以加载div与返回的内容。只有在加载内容之后才应该打开模式,否则您会看到显示的框跳动,然后内容刚刚出现。

基本示例

$(".btn").click(function(){
    // AJAX code here.
    $.ajax(
    ....
    success: function($data){
      $('.target').html(data)
      $("#myModal").modal('show');
    }
    );
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 AJAX 在 Bootstrap Modal 上调用 PHP 函数 的相关文章

  • angular.copy() 和 JSON.parse(JSON.stringify()) 之间的区别?

    有人可以解释 angular copy 和 JSON parse JSON stringify 之间的区别吗 有吗 您会推荐使用什么 angular fromJson angular toJson 与 JSON parse JSON str
  • Atom“自动完成”不起作用

    因此 当您安装 Atom 时 autocomplete 会随其一起提供 并且默认情况下处于启用状态 当我编写代码时 什么也没有显示 为什么 是否需要配置任何文件才能正常工作 In autocomplete plus settings pag
  • jquery/javascript 处理后移至命名锚点

    在进行一些 jquery 处理后 如何将焦点移动到同一页面上的不同部分 名为锚点 函数 ABC 进行一些处理 然后 我需要将用户移动到同一页面上的某个部分 页面下方 您可以使用下面的代码将屏幕滚动到 div 只需更改选择器以匹配您要滚动到的
  • KineticJS - 将舞台缩放到视口

    我正在努力将默认分辨率设置为 1366x756 我会根据视口来放大和缩小它 类似于此处显示的示例 http blogs msdn com b davrous archive 2012 04 06 modernizing your html5
  • 通过单击字段启用非活动字段

    是否可以有一组非活动字段 如果单击其中一个字段 则某些字段将变为必填字段并运行某些代码段 举例来说 您显示了三个字段
  • 嵌套对象的 AJV 模式验证

    函数返回的对象看起来像这样 answer vehicle type 1 message Car model VW color red 答案 对象始终存在 其他字段基于 vehicle type E g 如果vehicle type 1 则有
  • 使用JS将图像的特定背景颜色设置为透明

    我正在使用以下代码来修改图像的透明度 然而 我想做的只是修改图像的背景颜色并将其 alpha 通道设置为 0 而不是整个图像 以下代码将整个图像的 Alpha 透明度设置为 0 var ctx this data getContext 2d
  • Symfony 4.1 组件 - 依赖注入问题

    我正在用 PHP 重构旧应用程序 我正在尝试使用 Symfony 依赖注入组件将服务注入控制器 或其他服务 但我不知道如何实现这一点 因为 symphony 文档比框架组件更适合使用框架 我已经有了自己的内核 包含所有服务和控制器的容器 控
  • 在 NPM 上捆绑并发布客户端 Web 代码

    我制作了一个 JavaScript 文件 假设它的内容是这样的 let myCoolAlert str gt alert str in a different js file SO doesn t allow you to cross fi
  • mysqli_connect(): (HY000/2002): 无法建立连接,因为目标机器主动拒绝

    我知道有很多这样的问题 但我没有找到任何解决方案 我尝试过的事情 检查防火墙 重新启动我的电脑和 Apache 服务器 重新启动MYSQL 检查了我的代码 尝试了我所知道的和在互联网上找到的一切 这是我的代码
  • 在 Chrome 中检索浏览器语言

    我一直在尝试让 momentjs 正确检测浏览器语言并本地化时间显示 按照使用 Moment js 进行区域设置检测 https stackoverflow com questions 25725882 locale detection w
  • 获取键盘事件中的鼠标位置

    我试图在用户按住 Shift 键时出现选择轮 滚轮应以鼠标位置为中心 然而当我测试这个时 pageX and clientX两者在事件对象上都未定义 是否可以通过键盘事件获取鼠标坐标 不 只需跟踪mousemove事件并持续保存当前位置 以
  • Firefox OS 后台服务

    我想构建一个应用程序 用户可以通过它输入一些设置 并且应用程序将启动后台服务来根据这些设置执行一些任务 我只想在模拟器中运行应用程序和后台服务 我知道它需要 认证 模式才能运行后台服务 但我现在不考虑在 Firefox Marketplac
  • 当脚本是从加载的脚本动态创建的 DOM 节点时,脚本 onload 和 window.onload 的顺序是否定义良好?

    File loader js function main if typeof window undefined var script window document createElement script script src https
  • 将 javascript 变量发送到服务器端 ASP .NET

    我需要在回发时将 JavaScript 数据传递到服务器端 Exvar jsVariableToPass new Object jsVariableToPass key1 value1 jsVariableToPass key2 value
  • 如何检查摘要周期是否稳定(又名“Angular 完成编译了吗?”)

    tl dr 最初的问题是 如何在每个摘要周期触发回调 但潜在的问题更有趣 因为这回答了两个问题 所以我继续修改了标题 Context 在解决了所有依赖项 nginclude API 调用等之后 我试图控制 Angular 何时完成 HTML
  • 在javascript中定义Date.parse的格式[重复]

    这个问题在这里已经有答案了 我正在使用 Date parse 将字符串转换为 JavaScript 中的日期 但是 如果字符串看起来像 10 11 2016 它会被解释为 2016 年 10 月 11 日 我需要将其解释为 2016 年 1
  • JavaScript 右移负数

    这是片段 var i 101 console log 101 i toString 2 console log 101 gt gt 1 i gt gt 1 toString 2 var l 101 console log 101 l toS
  • 禁用 Materialise Carousel 上的触摸

    看起来以前没有人问过这个问题 因为我几乎在互联网上寻找一个非常简单的答案 如何禁用在物化轮播上向左 向右滑动的功能 在 Materialize js 添加 编辑 var allowCarouselDrag true value functi
  • addEventListener keydown 不起作用

    我在互联网上找到了一些基本的 Pong 代码 并尝试添加按键 代码在这里 http cssdeck com labs ping pong game tutorial with html5 canvas and sounds http css

随机推荐

  • 在Swift中实现UILabel动画效果的最佳方法?

    我对 Swift 动画还很陌生 并且知道如何去做 但想看看其他人会如何做 我正在尝试创建这样的效果 当用户进入搜索栏时 搜索栏的占位符文本会缩小并向上移动到搜索字段上方 并更改为不同的颜色 像这样 http magicus xyz http
  • [String] 的 Swift 扩展?

    我正在尝试编写一个扩展方法 String 看来你不能延长 String 直接 类型 元素 限制为非协议类型 字符串 尽管我遇到了这个技巧 protocol StringType extension String StringType 但我仍
  • 在世界地图上方可视化网络[关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我在 NodeXL 中有一个网络数据集 我试图在世界地图上可视化它 我的数据集有 具有国家属性的节点 链接 节点之间的未加权连接 我尝
  • 如何在 MATLAB 中迭代 n 维矩阵中的每个元素?

    我有个问题 我需要在 MATLAB 中迭代 n 维矩阵中的每个元素 问题是 我不知道如何对任意数量的维度执行此操作 我知道我可以说 for i 1 size m 1 for j 1 size m 2 for k 1 size m 3 等等
  • 使用 Angular 4.4.6 的开发模式下没有 NgForm 错误提供程序

    EDIT 我已经发现是什么导致了这个问题 我现在正在寻找一个解决方案来满足它 NOTE 此问题发生在开发模式下 即不是生产模式 并且不使用 aot 我正在使用这里的 更新 解决方案 https stackoverflow com a 463
  • 带css的透明滚动条

    现在使用此代码 以及此代码的许多变体 但滚动轨道变为深灰色 例如 222222 或接近此颜色 找到很多例子 但它们都给出相同的结果 Opera Chrome 和 Firefox 均显示此错误 怎么修 style 3 webkit scrol
  • HSTS 安全标头中的 max-age 属性是什么?

    HSTS 中 max age 的目的是什么 例如 Strict Transport Security max age 100 如果该值超过 100 会发生什么 有没有设置 max age 的最佳实践 thanks 有语义上不同的方式来发送
  • MPI:广播 long long int

    这个程序估计Pi通过将随机 飞镖 采样点 扔到一个圆或半径 1内切于长度 2的方板内的圆上 利用关系 Area of circle Area of Square Pi 4 我们可以使用表示为的相同关系来估计 Pi Darts Inside
  • 如何动态导入模块并将其名称作为字符串?

    我正在编写一个 Python 应用程序 它将命令作为参数 例如 python myapp py command1 我希望应用程序是可扩展的 也就是说 能够添加实现新命令的新模块 而无需更改主应用程序源 这棵树看起来像 myapp init
  • 如何收集多个 openFile:(NSString *) 事件,然后对它们执行某些操作?

    我正在开发 Cocoa Objective C 实用程序应用程序 并且想要处理多个 瞬时 文件打开 为了处理文件打开部分 我在我的AppDelegate mm file BOOL application NSApplication app
  • Joomla 的自定义模板支持

    Joomla 是相当不错的 CMS 但是有什么方法可以创建 joomla 支持的自定义模板吗 如果我理解您的问题 您想要转换甚至不是 Joomla 模板的现有模板 如果是这种情况 我发现很难做到 当然这取决于模板的来源 我最终采用了 Joo
  • 移动所有 git 分支中的文件夹

    我们有一个有 20 个分支的中央存储库 它们都使用如下布局 gitignore file1 txt file2 txt 现在应该改为 gitignore ProjectFolder file1 txt ProjectFolder file2
  • Carbon 获取指定开始年份和当前年份之间的年份

    如果可能的话 是否可以使用 Carbon 来获取数组中起始年份和当前年份之间的年份 所以今年的数组将是 2014 2015 2016 明年 2017 年将包括 2014 2015 2016 2017 Thanks 解决方案 years ra
  • lapply后从列表返回到data.frame

    我有一个关于 lapply 的非常简单的问题 我正在从 STATA 过渡到 R 我认为有一些非常基本的概念 我没有在 R 中循环 但是我整个下午都在阅读它 但无法找到一个合理的方法来完成这个非常简单的事情 我有三个数据框 df1 df2 和
  • Google Drive API“监视”文件夹中,如何知道添加了哪些文件

    我正在运行一个测试端点 当我将文件放入监视文件夹时 我收到一个带有标头的请求X Goog Resource State update 但我似乎没有获得添加文件的 ID I get X Goog Resource Id我原以为这可能是新文件
  • 如何使 README_FOR_APP 的内容出现在 doc/app/index.html 中

    我想要的内容doc README FOR APP出现在doc app index html 当我做rake doc app 目前 内容为 这是 Rails 应用程序文档的 API 文档 To see README FOR APP 我必须点击
  • 中没有足够的空间。如何添加多行

    我想在选项文本下添加描述该选项的行 默认情况下 mat select 限制字符数并在行末尾添加 我想要有需要的多行选项 斯塔克闪电战演示 https stackblitz com edit angular wj9svw https stac
  • Python-如何检查Redis服务器是否可用

    我正在开发一个用于访问 Redis 服务器的 Python 服务 类 我想知道如何检查Redis服务器是否正在运行 而且如果不知何故我无法连接到它 这是我的代码的一部分 import redis rs redis Redis localho
  • Ruby 项目帮助。无法从数组中获取已保存的实例

    TLDR 我正在开发一个使用 API 创建实例的项目 我希望能够回忆起所有的实例 但不知道如何回忆 我对 Ruby 和一般编程还比较陌生 所以我希望我能很好地解释一切 这是我的代码 class Suggestion attr accesso
  • 使用 AJAX 在 Bootstrap Modal 上调用 PHP 函数

    我使用 PHP 循环在我的页面上回显了用户列表 当我单击每个用户的名称时 会弹出一个 Bootsrap 模态并显示该用户的更多详细信息 链接看起来像这样 a href user UserName a 如您所见 我将用户的 ID 传递给 Bo