2010-01-23 4 views
0

asp.net MVC에서 Simple Modal을 사용하고 있습니다. 대화 상자에보기를로드하는 OSX 데모를 사용하여 설정했습니다. 나는 txtEmail 상자를 숨기려하고 쇼 기능에SimpleModal 및 ASP.NET MVC 사용

jQuery(function($) { 

    $("input.ema, a.ema").click(function(e) { 
     e.preventDefault(); 
     $("#osx-modal-content").modal({ 
      appendTo: 'form', 
      overlayId: 'osx-overlay', 
      containerId: 'osx-container', 
      closeHTML: '<div class="close"><a href="#" class="simplemodal-close">X</a></div>', 
      minHeight: 80, 
      opacity: 65, 
      position: ['0', ], 
      overlayClose: true, 
      onOpen: OSX.open, 
      onClose: OSX.close, 
      onShow: OSX.show 

     }); 
    }); 

    var OSX = { 
     container: null, 
     open: function(d) { 
      var self = this; 
      $.ajax({ 
       url: "/Message/UserMessage/", 
       type: 'GET', 
       dataType: 'html', // <-- to expect an html response 
       success: doSubmitSuccess 
      }); 
      function doSubmitSuccess(result) { 
       $('div#osx-modal-data').html(result); 
      } 

      self.container = d.container[0]; 
      d.overlay.fadeIn('slow', function() { 
       $("#osx-modal-content", self.container).show(); 
       $('div#osx-modal-title').html("Send Email"); 
       var title = $("#osx-modal-title", self.container); 
       title.show(); 

       d.container.slideDown('slow', function() { 
        setTimeout(function() { 
         var h = $("#osx-modal-data", self.container).height() + 
         title.height() + 
         20; // padding 
         d.container.animate({ 
          height: h 
         }, 200, function() { 
          $("div.close", self.container).show(); 
          $("#osx-modal-data", self.container).show(); 

         }); 
        }, 300); 
       }); 
      }) 

     }, 
     close: function(d) { 
      var self = this; 
      d.container.animate({ 
       top: "-" + (d.container.height() + 20) 
      }, 500, function() { 
       self.close(); // or $.modal.close(); 
      }); 
     }, 
     show: function(d) { 
      var self = this; 
      $("#txtEmail", self.container).hide(); 
      }); 

     } 
    }; 


}); 

,하지만 그것을 찾을 수있을 것 같지 않습니다 :

내가 사용하고 자바 스크립트입니다. 대화로가는

html로는

입니다
<%@ Page Language="VB" Inherits="System.Web.Mvc.ViewPage" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title>CreateMessage</title> 
</head> 
<body> 
    <div> 

     <p> 
      <input id="txtEmail" type="text" style="width: 90%" /></p> 
     <p> 
      <textarea id="TextArea1" cols="20" rows="5"></textarea></p> 
     <p> 
      <input id="submitmsg" type="submit" value="Send" /></p> 
    </div> 
</body> 
</html> 

이 사람이 나를 도울 수 있습니까?

덕분에,

답변

1

나는 AJAX 호출이하여 show 방법은 호출 시간 때문에 요소가 당신이 그것을 숨길려고하고있는 시간에 존재하지 않는 완료되지 않았 음을 믿습니다. 아마도 open 핸들러의 ajax 호출 다음에 나오는 모든 코드를 txtEmail 요소를 숨기는 코드와 함께 ajax 콜백으로 이동해야합니다.

var OSX = { 
    container: null, 
    open: function(d) { 
     var self = this; 
     $.ajax({ 
      url: "/Message/UserMessage/", 
      type: 'GET', 
      dataType: 'html', // <-- to expect an html response 
      success: function(html) { 
       $('div#osx-modal-data').html(result) 
             .find("#txtEmail") 
             .hide(); 
       ...rest of code to display the dialog... 
      } 
     }); 
+0

jquery에는 새로운 것이므로 아약스 호출은 어디에서 다시 호출할까요? 죄송 합니다만 바보 같은 질문입니다. – DanielJaymes

+0

당신의 경우에는'doSubmitSuccess' 메서드입니다 - 그런데, 당신은 단순히 inline을 success 속성의 값으로 쓸 수 있습니다. 설명하기 위해 약간의 코드를 추가하겠습니다. – tvanfosson

+0

고맙습니다. – DanielJaymes