重新打开jquery ui对话框,清空并刷新

时间:2012-05-07 22:13:57

标签: jquery-ui jquery

这个jquery ui对话框中填充了来自ajax调用(工作)的html和表单值。我想关闭或提交它,然后重新打开并重复使用它。我可以关闭并重新打开,但它仍然存在旧值,然后添加新值。它会在每次关闭后不断添加html值并重新打开。关于这个有很多问题,但我没有看到明确的答案。我试过了近,空,破坏,但组合不按我需要的方式工作。有什么想法吗?

$("#StoreForm").dialog({
    autoOpen:false, 
    width:500, 
    height:900, 
    modal:true,
    buttons: { 
   OK: function() { 
   $('#StoreForm').dialog('close'); 
$(this).dialog('hide');
$(this).dialog('empty'); 
 }, 
 'Save': function() { 
  $(this).dialog('empty'); 
 } 

 }

 });


 //additional code to click and open the dialog

 $(".sel").unbind('click');
 $(".sel").on("click", function(e){
e.preventDefault();                 
 $("#StoreForm").dialog('open');
 var valueSelected = $(this).closest('tr').children('td.item').text();                                  
$.ajax({
url: 'query/categories.cfc',
dataType: 'json',
cache: false,
data: {method: 'getProductInfo', 
                                queryFormat: 'column',
                            returnFormat: 'JSON',
productID:   valueSelected

},
success: function(response, status, options){
$("#PROD_SUPER_ID").val(response.DATA.PROD_SUPER_ID[0]);

$("#color").val(response.DATA.COLOR_ATTRIB);

                            $("#SIZE_ATTRIB").val(response.DATA.SIZE_ATTRIB);

$("#price").val(response.DATA.PRICE);
var w = [];
w.push("<p>", response.DATA.ICON[0], "</p>", "<p>", 
      response.DATA.FULL_DESCRIPTION [0], "</p>") 
                            $("#StoreForm").prepend(w.join(""));

1 个答案:

答案 0 :(得分:0)

我发现你可以关闭对话框并清空html,它将清除这种类型的对话框设置。为了重新打开,我在初始的成功响应中嵌套了第二个ajax调用..

 //set up dialog with options

$("#StoreForm").dialog({
autoOpen: false,
width: 500,
height: 500,
modal: true,
buttons: {
    Cancel: function(){

        $('#StoreForm').dialog('close');
        $('#StoreForm').html("");

    },

//pop-up individual items

    "Add to Cart": function(){
            $.ajax({
            url: $("#storeCart").attr('action'),
            data: $("#storeCart").serializeArray(),
            type: 'POST',
            success: function(response){

                  var name = $( "#name" ),
    email = $( "#email" ),
    password = $( "#password" ),
    allFields = $( [] ).add( name ).add( email ).add( password ),
    tips = $( ".validateTips" );

if you have any questions please respond. Thanks