回发后jQuery无法正常工作

Question

I have combo box in which I fill data from ajax jquery. It works fine but when I click save button post back occurs after post back it not works.

This is my Jquery code.

 $(document).ready(function () {
 var EmpCombo = $('#Cmb_PEmp');
                        var textbox = $("#TxBx_BasicSalary");
                        var BasicSalary = $('#Hid_BasicSalary');
                        var EmpID = $('#Hid_EmpID');
  EmpCombo.on('change', function EmpCmbFuction(e) {
                    e.preventDefault();
                    myEvent();

                });
function myEvent() {
                    var EmployeeId = $('#Cmb_PEmp :selected').val();
                    if (EmployeeId == 0) {
                        return;
                    }
                    $.ajax({
                        type: "POST",
                        cache: false,
                        contentType: "application/json; charset=utf-8",
                        url: '/WebService/GetBasicSalaryByEmpID.asmx/GetSalaryByEmpId',
                        data: '{ "EmployeeId": "' + EmployeeId + '" }',
                        dataType: 'json',
                        success: function (data) {
                            var data = $.parseJSON(data.d)

                            if (data["BasicSalary"] == 0) {
                                textbox.val("No BasicSalary Define Yet");
                                return;
                            }
                            textbox.val(data["BasicSalary"]);
                            BasicSalary.val(data["BasicSalary"]);
                            EmpID.val(EmployeeId);

                        },
                        error: function () { alert("error"); }
                    });
                }
 var prm = Sys.WebForms.PageRequestManager.getInstance();
                prm.add_endRequest(function () {
                    $(document).ready(function () {
 EmpCombo.on('change', function EmpCmbFuction(e) {
                            e.preventDefault();
                            myEvent();

                        });
});

How I will fix this problem after post back it does not give me proper result? Jquery does not perform any function.

Answer 1

Try using

function pageLoad() 
{

}

Insted of $(document).ready()

Answer 2

function myEvent() {
    // Put all your code
}
$(document).ready(function () {
    myEvent();
});
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_endRequest(function () {
    myEvent();
});

Answer 3

Please try the below script part:

         function pageLoad(sender, args) {
         //Your jquery code
         }



     I hope this will work.

Answer 4

As you are using jQuery and you are handling your data using jQuery ajax, why don't you put a separate placeholder (that deosn't use update panel). And then your code will difinitly work eg define a placeholder like this;

<asp:Content ID="Content3" ContentPlaceHolderID="RemoveUpdatePanelPlaceHolder" runat="Server">
   // your content goes here
</asp:Content>

Answer 5

I can see you are already using the PageRequestManager needed in this type of issues, but you need to put all your code, to make it work properly like this:

var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_endRequest(function () {
    $(document).ready(function () {
        var EmpCombo = $('#Cmb_PEmp');
        var textbox = $("#TxBx_BasicSalary");
        var BasicSalary = $('#Hid_BasicSalary');
        var EmpID = $('#Hid_EmpID');
        EmpCombo.on('change', function EmpCmbFuction(e) {
            e.preventDefault();
            myEvent();

        });

        function myEvent() {
            // Put all your myEvent function code here

        }
    });
});

Answer 6

document.ready函数仅触发一次，发布后也不会触发。尝试使用page_load()函数。