在回发

时间:2018-04-21 04:23:56

标签: javascript jquery asp.net bootstrap-modal postback

我有一个Bootstrap模式对话框,当用户点击jQuery数据表中的“Edit”时,我用它来填充数据。此模式上有一个取消和提交按钮。

当我打开模态并单击取消然后选择另一个表行并单击“编辑”时,一切都很好;每次单击“编辑”时,数据都会正确填充。但是,如果我通过单击模式上的“提交”进行回发,然后再次单击“编辑”,则会打开模态并且没有数据。

我正在使用modal('show.bs.modal',...)来填充它,并且在回发完成后它永远不会被击中。

// This is called when "Edit" in data table row is clicked
function showEdit(var1, var2) {debugger
    $('#hfVar1').val(var1);
    $('#hfVar2').val(var2);
    showEditModal();
}

function showEditModal() {debugger
    $("#spnEditHeader").text("Edit Something");
    $('#editModal').modal('show');
}

$(document).ready(function () {
    // This populates the jQuery data table
    showTable(somthing, anotherThing);

    // This is executed as long there is no postback; 
    // once a postback is perfoemd this is not hit, modal not populated
    $('#editModal').modal({
        keyboard: true,
        backdrop: "static",
        show: false
    }).on('show.bs.modal', function (e) {debugger
        var var1= $('#hfVar1').val();
        var var2= $('#hfVar2').val();

        //make ajax call to populate items
        populateMPOOEdit(var1, var2);
    });
    ....
});

//This is the button in modal that causes postback
<div class="modal-footer">
    <div id="divEditButtons" style="text-align: center;">
        <button id="btnCancel" class="btn btn-info2" data-dismiss="modal" aria-hidden="true" aria-label="Cancel">Cancel</button>&nbsp;&nbsp;&nbsp;&nbsp;
        <button id="btnSubmit" class="btn btn-primary" aria-hidden="true" aria-label="Update">Update</button>
    </div>
</div>

// "Submit" button's click handler
$(document).on("click", "#btnSubmit", function (event) {
    // Validate data (client side validation)
    var isValid = validateUpdate();

    // Also need a server side validation checking for duplicate name, using ajax to do this
    $.ajax({
        type: "POST",
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        url: '<%= ResolveUrl("services/mpoo.asmx/NameExists") %>',
        cache: false,
        data: JSON.stringify({ "Name": name }),
    }).done(function (data) {
        var result = data.d;

        if (result != '') {
            nameExists = JSON.parse(data.d);

            if (nameExists == "true") {
                $("#lblErrName").text("Duplicate Name");
                $("#lblEditErrName").show();
                isValid = false;
            }
            if (isValid) {
                __doPostBack('btnSubmit', JSON.stringify({
                    action: "SaveUpdate", Var1: var1, ..., Varn: varn
                }));
                $('#editModal').modal('hide');
            }
        }
    });
    return false;  // to prevent modal from closing if there are errors on page
});

1 个答案:

答案 0 :(得分:0)

创建一个这样的函数:

//basically everything you had in your document.ready function
function myJsFunc() {
  // This populates the jQuery data table
  showTable(somthing, anotherThing);

  // This is executed as long there is no postback; 
  // once a postback is perfoemd this is not hit, modal not populated
  $('#editModal').modal({
    keyboard: true,
    backdrop: "static",
    show: false
  }).on('show.bs.modal', function (e) {debugger
    var var1= $('#hfVar1').val();
    var var2= $('#hfVar2').val();

    //make ajax call to populate items
    populateMPOOEdit(var1, var2);
  });
....
}

然后在代码隐藏的Page_Load事件处理程序中,尝试将其放入:

Page.ClientScript.RegisterStartupScript(this.GetType(), "some random name for your script", "myJsFunc();", true);