Javascript 无法更新引导模式窗体

我有一个CRUD提醒应用程序，当用户右键单击提醒时，会弹出一个上下文菜单。选项包括编辑、删除等。每个提醒都有一个id，关联菜单按钮根据提醒id进行更新，并将其传递到引导模式表单：

JS:

HTML:

---

我将如何解决这个问题？任何帮助都将不胜感激

您可以在提醒列表或表格中为每个提醒添加一个

数据id

属性，然后在导航上单击，您可以获得所选的提醒id。

这正是我在代码中所做的-每个提醒都有一个数据id，并且上下文菜单按钮会用id更新。问题是每次id更新时都没有创建modalForm你能分享完整的HTML代码吗？什么时候调用toggleMenuOn js函数？感谢您的快速响应！我刚刚用更多信息更新了问题。右键单击后，请检查上下文\u btn\u id和上下文\u菜单\u btn1数据id值。很可能是ajax调用在切换模式后更新这些值。尝试添加$（“#context_menu_btn1”）.modalForm（{formURL:context_btn_id}）；更改后，\u var（提醒\u url）仅用于测试，请告诉我它是否有效。

//part of the context menu script
//this function is called when the user right clicks inside of any element with class task
function toggleMenuOn(e) {
    if ( menuState !== 1 ) {
      menuState = 1;
      menu.classList.add( contextMenuActive );
    }

    let reminder_id = e.target.id

    $.ajax({
    url: '/ajax/get_reminder/',
    data: {
      'reminder_id': reminder_id
    },
    dataType: 'json', 
    success: function (data) {
        let context_btn1 = document.getElementById("context_menu_btn1");
        let reminder_pk = data.serialized_reminder.toString(); 
        let reminder_url = "{% url 'update-reminder' 0 %}".replace(/0/, reminder_pk) 
        context_btn1.className = "update-reminder context-menu__link btn btn-light";
        context_btn1.setAttribute('data-id', reminder_url);
        change_var(reminder_url)
    }  
  });

  }

let context_btn_id = "/update_reminder/0/";
function change_var(new_name) {
    context_btn_id = new_name;
}
$(document).ready(function() {
    $("#context_menu_btn1").click(function () {
        $(this).modalForm({formURL: context_btn_id});  
    });
});

<nav id="context-menu" class="context-menu">
    <ul class="context-menu__items">
        <li class="context-menu__item">
            <button type="button" class="context-menu__link btn btn-light" id="context_menu_btn1" data-id=""><i class="fa fa-edit"></i> Edit</button>
        </li>
        <li class="context-menu__item">
            <button type="button" class="context-menu__link btn btn-light" id="context_menu_btn2" data-id=""><i class="fa fa-times"></i> Delete</button>
        </li> 
        <li class="context-menu__item">
            <button type="button"class="context-menu__link btn btn-light" id="context_menu_btn3" data-id=""><i class="fa fa-eye"></i> Share</button>
        </li>
    </ul>
</nav>

<div>
    <h3 class="ml-4">Long-Term Assignments:</h3> 
    <div class="events-content-section ml-4 mr-3">
        {% get_reminder_id user.username as id_reminders %} 
        {% for reminder_id, long_term_reminder in id_reminders.items %}
            <div class="task mb-2" style="display: flex;">
                <button type="button" class="view-reminder btn btn-light" data-id="{% url 'view-reminder' long_term_reminder.pk %}" id="{{ reminder_id }}" style="width: 100%;">
                    <h4 style="float: left;">{{ long_term_reminder.title }}</h4>
                </button>
            </div> 
        {% endfor %}    
    </div>
</div>

$(".view-reminder").each(function () {
  $(this).modalForm({formURL: $(this).data('id')});
});