如何自定义数据::确认弹出窗口以提示输入,该输入将附加到请求参数上?

时间:2016-04-19 12:49:14

标签: javascript ruby-on-rails ruby-on-rails-4 ujs

我的申请中的许多地方,提交表格和访问后链接都要求用户指定一些推理,说明为什么他们决定这样做(评论/推理用于跟踪谁在内部做了哪些更改)。

现在出于这个原因,我希望能够改变data: {confirm: "Are you sure you want to submit this form?"}的行为以提示输入而不是仅回答是/取消。我希望该框显示一个输入字段,然后将该内容附加到请求参数,以便我可以从控制器存储它。

我该怎么做?

3 个答案:

答案 0 :(得分:1)

使用伪提交按钮,这是触发提示对话框。 当提示填充时,复制值的形式隐藏输入,然后触发表单提交事件。 这是工作示例:

HTML:

<form id="myForm">
    <input type="checkbox" name="checkbox" checked />
    <input id="myVisibleInput" name="visibleinput" type="text" />  
    <input id="myHiddenInput" name="hiddeninput" type="text" />
    <button id="fakesubmit" type="button">Submit</button>
</form>

jQuery的:

$('#fakesubmit').on('click', function() {
    var answer = prompt('Why?');
    if (answer != null) {
        $('#myHiddenInput').val(answer);
        $('#myForm').submit();
    }
});

$("#myForm").on("submit", function(event) {
    console.log($(this).serialize());
});

CSS:

#myHiddenInput {
    display: none;
}

答案 1 :(得分:0)

您可以使用提示符:

&#13;
&#13;
var test = prompt("Enter your name:");
alert("Hi " + test + "!");
&#13;
&#13;
&#13;

Prompt - W3Schools

答案 2 :(得分:0)

你可以尝试一些模态服务,比如bootstrap modal,或者只是构建你自己的指令。有一些很好的信息here。实际上,无论您将ng-click绑定到哪个函数,都会先调用-,一旦用户确认/拒绝,$ modalService将调用$modalServicefunc.success