jQuery Ui对话框表单和部分视图重新加载

Question

我正在尝试在ASP.NET MVC应用程序中重新加载Ajax部分视图后打开JQuery Ui对话框表单。

HTML代码

 <div>
    <table id="tabletotal">
      <thead>
        <tr>                    
         <th>
           Operator
         </th>
        </tr>
       </thead>
      <tbody>
         @for (int h = 0; h < Model.ToList().Count; h++)
           {
             <tr>
              <td>
                <button  type="button" class="assign"  id="@Model.ElementAt(h).id" >Assign</button>                                    

               </td>
              </tr>
           }
      </tbody>
    </table>
  </div>

对话形式

<div id="dialog-form" style="display:none;">
<form action=@Url.Action("Assign", "Ticket") method="post" style="padding-top:10px">
    <fieldset>
        <div class="form-group" >
            <input id="passedId" name="passedId" type="hidden" />
            <select name="idOperator" id="idOperator" class="form-control">
                @foreach (Model.Data.Operator op in ViewBag.Operators)
                {
                    <option value="@op.id">@op.name</option>
                }
            </select>
        </div>
        <div align="right" style="padding-top:10px">
            <input type="submit" class="btn btn-secondary" value="Send">
        </div>
    </fieldset>
</form>

JS代码

$(function () {
    var dialog = $("#dialog-form").dialog({
        autoOpen: false,
        height: 200,
        width: 350,
        modal: true
});
$(".assign").button().on("click", function () {
    $('#passedId').val(this.id);
    alert($(this).attr('id'));
    //dialog.data("idt", this.id);
    dialog.dialog("open");
});
});

我每3秒钟使用Ajax重新加载此局部视图。 重新加载后，httppost操作（“ Assign”，“ Ticket”）将失败，因为idPassed为null。 可能是哪个问题？ 我认为重新加载后按钮的ID丢失了，但我不知道为什么。

Answer 1

好的，解决方案是简单的XD

$(function () {
    $(".assign").button().on("click", function () {
        $('#passedId').val(this.id);
        createDialog();
        dialog.dialog("open");
    });
});
function createDialog() {
    var dialog = $("#dialog-form").dialog({
        autoOpen: true,
        height: 310,
        width: 350,
        modal: true
    });
}