Problem with jquery dialog

Question

I have a partial view with a drop-down list (with options Paid and unpaidlike) and a button. I load this partial view using jquery loading when the user clicks Paid/Unpaid List linkon the page submenu.

When I select the “Paid” drop-down list and click the button, it will display the list of paid customers in the jquery dialog and if I select “Unpaid” and click the button, unpaid customers are displayed in the jquery dialog.

I am writing the following code for the dialog:

 $('#customers').dialog({
            bgiframe: true,
            autoOpen: false,
            open: function(event, ui) {
                //populate table
                var p_option = $('#d_PaidUnPaid option:selected').val();
                if (p_option  == 'PAID') {
                    $("#customercontent").html('');
                    //$("#customercontent").load("/Customer/Paid");
                }
                else if (p_option  == 'UNPAID') {
                    $("#customercontent").html('');
                    //$("#customercontent").load("/Customer/Unpaid");
                }
            },
            close: function(event, ui) {
                //do nothing
            },
            height: 500,
            width: 550,
            modal: true
        });

For the first time, I get the list correctly in the jquery dialog, but when I click again Paid/Unpaid List linkand select "Unpaid" from the drop-down list and click the button, it displays the downloaded content in the jquery dialog.

?

Answer 1

jQuery AJAX. load() ( IE), . jQuery AJAX,

$.ajaxSetup({cache: false});

Answer 2

, . , ajax.

open: function () {
      jQuery.ajaxSetup({
             cache: false
       });
       //populate table or do what you want...
}

Answer 3

Try adding this after opening:

$('#customers').empty().remove();

Example:

    open: function(event, ui) {
              //populate table
              var p_option = $('#d_PaidUnPaid option:selected').val();
              if (p_option  == 'PAID') {
                  $("#customercontent").html('');
                  //$("#customercontent").load("/Customer/Paid");
              }
              else if (p_option  == 'UNPAID') {
                  $("#customercontent").html('');
                  //$("#customercontent").load("/Customer/Unpaid");
              }

              $('#customers').empty().remove();

          },