2014-04-09 2 views
0

http://www.how-to-asp.net/messagebox-control-aspnet/과 비슷한 사용자 지정 사용자 컨트롤을 찾고 있는데 팝업으로 표시되는 기능이 있습니다. 메시지 상자에는 "ok"및 "cancel"단추를 바인드하기위한 이벤트 훅이있는 asp.net 4의 코드에서 호출 할 수있는 기능이 있어야합니다.C의 팝업 메시지 상자 #

저는 Ajax Toolkit 및 JQuery에 익숙합니다.

비슷한 방향으로 참조 또는 샘플을 보내면 매우 유용합니다.

감사합니다.

답변

0

내 경험에 비추어 볼 때 서버 측 코드에서 클라이언트 측에서 무언가를 열어보기를 원할 경우 일반적으로 나쁜 디자인입니다. 그것이 당신이 필요로하는 것이라 확신합니까?

그렇다고 가정하면 Ajax Control Tookit의 ModalPopupExtender을 사용할 수 있습니다. 클라이언트 또는 서버 측에서 열 수 있습니다. 다음은 샘플입니다.

<ajaxToolkit:ModalPopupExtender ID="MPE" runat="server" 
    TargetControlID="LinkButton1" ClientIdMode="Static" 
    PopupControlID="Panel1" /> 

PopupControlID는 팝업으로 표시 할 패널의 ID 여야합니다. 필요한 경우 패널에 단추를 넣을 수 있습니다. 뒤에 코드에서, 그것은 ...

MPE.Show(); 

당신이 다음, 정적에 ClientIdMode 설정을 호출해야합니다, 자바 스크립트 (jQuery를 가정)에서 그것을 보여주기 위해 ...이만큼 간단

$('#MPE').show(); 
+0

asp.panel 조각을 사용자 정의 컨트롤, 즉 ascx 파일에 넣지 않는 한이 방법은 저의 측면에서 효과가 있습니다. 패널이 aspx 페이지에 있고 ModalPopupExtender를 사용하면 팝업이 잘 표시됩니다. 팝업을 사용하여 클라이언트 측에서 해고 할 수 있어야합니다. 사용자가 그리드의 삭제 버튼을 클릭하면 행이 영구적으로 삭제된다는 경고를 표시합니다. 마찬가지로 포스트 백 작업이 수행 될 때 코드에서 실행해야합니다. 즉 처리가 모두 완료되었다는 확인을 사용자에게 제공합니다. –

+0

ASCX 사용자 정의 컨트롤에 넣을 수 있습니다. 그것을 속성으로 드러내기만하면됩니다. public ModalPopupExtender ThePopup {get; 개인 세트}'는 .ascx.cs 코드에 충분해야하며, 뒤에 .aspx.cs 코드는'MyUserControl.ThePopup.Show()'를 수행 할 수 있습니다. – mason

5

jQuery UI을 사용하십시오. 그들은 훌륭한 모범을 보입니다. 나는 항상 대화를 사용한다.

소스를 볼 수 있으며 여기에는 그 예가 나와 있습니다.

<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>jQuery UI Dialog - Default functionality</title> 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"> 
    <script src="//code.jquery.com/jquery-1.10.2.js"></script> 
    <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script> 
    <link rel="stylesheet" href="/resources/demos/style.css"> 
    <script> 
    $(function() { 
    $("#dialog").dialog(); 
    }); 
    </script> 
</head> 
<body> 

<div id="dialog" title="Basic dialog"> 
    <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p> 
</div> 


</body> 

원하는대로 맞춤 설정할 수 있습니다. 이 방법을 보여주는 링크가 표시됩니다.

EDIT : 코드를 뒤에서 열고 싶으므로 jQuery를 보여주고 어떻게 뒤 코드에서 호출 할 수 있습니까? 나는 이것을 사용하여 이메일을 보낸다.

function sendEmail() { 
    $("#email").dialog({ 
     modal: true, 
     width: 700, 
     buttons: { 
      "Send": function() { 
      var btn = document.getElementById("<%=lbSend.ClientID %>"); 
      if (btn) btn.click(); 
      $(this).dialog("close"); 
      }, 
      Cancel: function() { 
       $(this).dialog("close"); 
      } 
     } 
    ); 
     jQuery("#email").parent().appendTo(jQuery("form:first")); 
    }; 

다음 코드에서.

protected void btnEmail_Click(object sender, EventArgs e) 
{ 
     //this calls the jQuery function. 
     Page.ClientScript.RegisterStartupScript(this.GetType(), "Call my function", "sendEmail();", true); 
} 
+0

좋은 점. 나는 편집 할 것이다. – Humpy

0
public void Message(String msg) 
    { 
     string script = "window.onload = function(){ alert('"; 
     script += msg; 
     script += "');"; 
     script += "window.location = '"; 
     script += "'; }"; 
     ClientScript.RegisterStartupScript(this.GetType(), "Redirect", script, true); 
    } 
관련 문제