gpt4 book ai didi

jquery - 使用ajax提交时弹出显示模式对话框

转载 作者:行者123 更新时间:2023-12-01 01:07:34 25 4
gpt4 key购买 nike

我在 Rails 中使用 Zurb-Foundation Reveal Modal。

我想在按下提交按钮时打开一个新的模式对话框并显示确认信息。

使用这样的链接,模式打开没有问题。

<a data-remote="true" data-reveal-id="myModal" data-type="html" href="/foo">Link</a>

但是使用表单并提交时,模式不会出现。

<form accept-charset="UTF-8" action="/foo" data-remote="true" data-type="html" method="get">
<input name="utf8" type="hidden" value="✓"></div>
<input id="bar" name="bar" type="text" value="bar">
<input id="my-submit" name="commit" type="submit" value="Submit">
</form>

我已经把 data-reveal-id="myModal" 拿走了,因为如果它存在,提交本身就不起作用。

还有它的 CoffeeScript 。单击 submit 后,show modal 出现在控制台中。

$ ->
$('#my-submit').on(
click: ->
console.log("show modal")
$('#myModal').trigger('click')

当我将 trigger('click') 替换为 `reveal()' 时,我收到此错误。

Uncaught TypeError: Object [object Object] has no method 'reveal'

我已经关注了 this question 的回答.

如何在模态对话框中显示提交结果?

最佳答案

根据documentation on the Zurb Foundation site ,您需要在对象上有一个名为 data-reveal-id 的数据属性,该属性应在单击时显示模式。

所以你应该尝试这样的事情:

<form accept-charset="UTF-8" action="/foo" data-remote="true" data-type="html" method="get">
<input name="utf8" type="hidden" value="✓"></div>
<input id="bar" name="bar" type="text" value="bar">
<input id="my-submit" data-reveal-id="myModal" name="commit" type="submit" value="Submit">
</form>

编辑

我想我误解了你的问题。如果您希望在提交成功后显示该对话框,那么您可能需要使用 jQuery 的 ajax 函数。

您可以在 JavaScript 中尝试类似的操作。

// formId is the id of your form
$('#formId').submit(function (e) {
var url = $(this).attr('action');

$.ajax({
type: 'POST',
url: url,
data: $('#formId').serialize(),
success: function (data) {
$('#myModal').reveal();
}
});
e.preventDefault();
});

一旦 AJAX 请求完成,就会调用 reveal 函数。如果您需要显示服务器生成的信息,则传递给成功回调函数的 data 参数将包含服务器响应的任何数据。

关于jquery - 使用ajax提交时弹出显示模式对话框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20726375/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com