简体   繁体   English

淘汰赛js-确认后从列表中删除项目

[英]Knockout js - Deleting an item from list after confirmation

I am using knockout js and bootstrap. 我正在使用淘汰赛js和bootstrap。 I have a list of users with a delete button on each row. 我有一个用户列表,每行都有一个删除按钮。 I also have a bootstrap modal dialog that has a confirmation message whether to delete the user or not. 我也有一个引导模式对话框,该对话框包含一条确认消息是否删除用户。 I have a click binding on the delete button that can remove the user from the model. 我在删除按钮上具有单击绑定,可以将用户从模型中删除。 How do i change it so that the deletion happens after the user has confirmed. 我如何更改它,以便在用户确认后进行删除。 I have searched several examples and they all suggest to use custom bindings, and the closest i found was this fiddle example 我搜索了几个示例,它们都建议使用自定义绑定,而我发现的最接近的是此小提琴示例

http://jsfiddle.net/snaptopixel/vDZQk/ http://jsfiddle.net/snaptopixel/vDZQk/

The one problem with this example is, it uses a pre-defined item from the model in the modal popup, what i want is to automatically bind the item that was deleted by the user and show the user name and other properties in the modal window and ask for confirmation. 这个示例的一个问题是,它在模式弹出窗口中使用了模型中的预定义项目,我想要的是自动绑定用户删除的项目,并在模式窗口中显示用户名和其他属性并要求确认。

Here is my modal dialog 这是我的模态对话框

<div class="modal-body">

  <div class="well">
    <p>By clicking 'Yes', you will remove the User 'foo' from the system. This action cannot be undone.  To cancel this action, click 'No'. </p>
  </div>

  <div class="modal-footer">
    <button type="button" class="btn btn-primary">Yes</button>
    <button type="button" class="btn btn-default" data-dismiss="modal">No</button>

  </div>

For example... 例如...

The modal window will say "Are you sure you want to delete User 'foo'? I would like to have access to the selected User inside the modal window. 模态窗口将显示“您确定要删除用户'foo'吗?我想访问模态窗口内的选定用户。

Thanks for your help 谢谢你的帮助

Set a click binding on the 'Yes' button to the function that actually does the deletion, and set the click binding on the delete button to a function that displays the modal. 将“是”按钮上的单击绑定设置为实际执行删除的功能,并将“删除”按钮上的单击绑定设置为显示模式的功能。 You'll probably want that function to store the current item in an observable ( itemToDelete or something like that) so that the actual delete function knows what to delete. 您可能希望该函数将当前项目存储在可观察的状态( itemToDelete或类似的名称)中,以便实际的删除功能知道要删除的内容。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM