All geek questions in one place

An error occurs when calling RegisterClientScriptBlock in the jQuery dialog

I open another inner page in a dialog that attaches to a div. After user input, I need to save SQL and close the dialog box. I used RegisterClientScriptBlock to call the jQuery script, but there is an error. enter image description here

On the child page (Test2.aspx) there is a Cancel button to invoke the same script, and it worked. Someone will tell me how to do this. Thanks in advance.

There is a parent aspx page:

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Test1.aspx.vb" Inherits="Order.Test1" %>

<%--<!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">
      <script src="include/dialog.js" type="text/javascript"></script>  
      <link rel="stylesheet" href="jquery-ui-themes-1.11.4/themes/smoothness/jquery-ui.css" />   
      <link rel="stylesheet" href="jquery-ui-themes-1.11.4/themes/redmond/jquery-ui.css" />
      <script  language="javascript" src="jquery-2.1.4.min.js" type="text/javascript"></script>
      <script language="javascript" src="jquery-ui-1.11.4/jquery-ui.js" type="text/javascript"></script>
      <script language="javascript" src="/include/dailog.js" type="text/javascript"></script>


      <script type="text/javascript" language="javascript">
        $(document).ready(function () {
            $('#btnOrder').click(function (e) {
                 e.preventDefault();
                 openBox('Test2.aspx?id=0', 'Testing', 700, 650);

            });
        });
      </script>
    <title>Parent page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Button ID="btnOrder" runat="server" Text="Order" />

         <div id="dialog-box"/>
    </div>
    </form>    
</body>
</html>

In the dialog box, the child page loads:

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Test2.aspx.vb" Inherits="Test.Test2" %>

<!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">
    <script type="text/javascript" language="javascript" src="scripts.js"></script>
     <script language="javascript" src="dailog.js" type="text/javascript"></script>         
  <script language="javascript" type="text/javascript">
     $(document).ready(function () {
            $('#btnCancel').click(function (e) {
                e.preventDefault();
                CloseDialogBox();
            });
     });
    </script>
    <title>Dialog Box</title>
</head>
<body>
    <form id="form1" runat="server">

    <div>
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="* Required" ControlToValidate="TextBox1"></asp:RequiredFieldValidator>
        <asp:Button ID="btnCancel" runat="server" Text="Cancel" />
        <asp:Button ID="btnSave" runat="server" Text="Save" />

        <br />

    </div>
    </form>
</body>
</html>

Here is my vb code:

Private Sub btnSave_Click(sender As Object, e As EventArgs) Handles     btnSave.Click
'Need to do something on backend and close dialog box
    Page.ClientScript.RegisterClientScriptBlock(Me.GetType(), "Script", "<script type='text/javascript'>CloseDialogBox();</script>", True)  
End Sub

Here is my jQuery script:

function openDailogBox(url, name, width, height) {  
$('#dialog-box').load(url).dialog({
    autoOpen: false,
    resizable: true,
    height: height
    width: width,       
    title: name,
    modal: true,
   draggable: false

});
  $('#dialog-box').dialog('open');
 return false;
}


function CloseDialogBox() {   
    alert('Close');
    $('#dialog-box').dialog({

        autoOpen: false,
        resizable: true,     
        title: name,
        modal: true,

    });

    $('#dialog-box').dialog('close');
}
+4
source share
3 answers

. , , , . , . dialog.js jquery-ui . , . ​​:

function openDailogBox(url,height,width) {
if ($('#dialog-box').length==0) {
    $('body').append('<div id="dialog-box"></div>');
}

$('#dialog-box').dialog({
    width: width,
    height:height,
    autoOpen:false
});

if (url!==""){
    $('#dialog-box').load(url);
    $('#dialog-box').dialog('open');

}
else
{
   $('.ui-dialog').not(':last').remove(); //clear any extra dialogs created from the append
   $('#dialog-box').dialog('close');

    }
     }

, awol jquery, .

 $('#dialog-box').dialog({

    autoOpen: false,
    resizable: true,     
    title: name,
    modal: true

});

, . . Test1.aspx .

.

Test2.aspx

<input id="btnSave" type="button" value="Save" / >

JS

 $('#btnSave').click(function (e) {
$.ajax({
    url: 'yourwebserviceurl',
    type: 'POST',
    data: { field1: $('#TextBox1').val()} ,
    contentType: 'application/json; charset=utf-8',
    success: function (response) {
        //your success code
    },
    error: function () {
        //your error code
    }
}); 
        });
+2
Page.ClientScript.RegisterClientScriptBlock(Me.GetType(), "CloseDialogBoxScript", "CloseDialogBox();", True)

? , RegisterClientScriptBlock , script . , .

+2

I assume that the "CloseDialogBox" function exists on the parent page, and the button (btnSave) that you run is on the Child page (Test2.aspx). Thus, the JavaScript runtime error: "CloseDialogBox" is undefined ".

0
source

Source: https://habr.com/ru/post/1621541/

More articles:


All Articles