Displaying a popup in PHPRunner 9.0, ASPRunnerPro 9.5, ASPRunner.NET 9.0

Categories ASP.NET, PHP, PHP Code Generator, PHP Form Generator

In this new version we are providing an easy way to display any page in Bootstrap popup window. Welcome, Runner.displayPopup() function.

The simplest form is really simple. There is only one mandatory parameter, URL of the page to be displayed. You can use this function anywhere you can use Javascript code i.e. in Javascript OnLoad event or ClientBefore event of custom button.

Here is how you can display Add page of Products table in popup:

Runner.displayPopup( { 
	url: "products_add.php"
});



Here is the complete list of parameters:

url: URL of the page to be displayed

html: instead of specifying URL you can supply HTML code to be displayed in popup window

header: to be displayed in popup header section

footer: to be displayed in popup footer section

afterCreate: function to be called after popup window is created

beforeClose: function to be called before popup window is closed. 
Return false to prevent popup from being closed. Return true to proceed with closing.
 
width: popup width in pixels

height: popup height in pixels

More examples.

Simple popup window

var win = Runner.displayPopup( { 
	url: "products_add.php",
	width: 700,
	height: 500,
	header: 'Add new product'
});

Using HTML instead of URL

var win = Runner.displayPopup( { 
		html: "<h1>Hello world!</h1><p>It works</p>",
		header: 'Custom popup text'
});

Use of close()

var win = Runner.displayPopup( { 
	url: "products_add.php",
	width: 500,
	height: 300,
	header: 'Add new product'
});

alert('That was an example of popup window');

win.close();

Use of afterCreate() event

var win = Runner.displayPopup( { 
	url: "products_add.php",
	header: 'Add new product',
	afterCreate: function(win) {
		win.setWidth(700);
		win.setHeight(500);
	}
});

Add 'Close window' link to the footer

var win = Runner.displayPopup( { 
	url: "products_add.php",
	header: 'Add new product',
	footer: '<a href="#" onclick="window.win.close();">Close window</a>',
	afterCreate: function(win) {
		window.win = win;
	}
});

Use of beforeClose() event

In this function you can return false to prevent window from being closed.
Do not allow to close window if 'Product Name' field is empty.

var win = Runner.displayPopup( { 
	url: "products_add.php",
	header: 'Add new product',
	footer: '<a href="#" onclick="window.win.close();">Close window</a>',
	afterCreate: function(win) {
		window.win = win;
	},
	beforeClose: function(win) {
		if ($('iframe').contents().find("input#value_ProductName_1").val()=="")
			return false;
		else
			return true;
	}
});

Show 'View customer' button on each row of Orders List page

Insert a button into Orders List page grid.

Server code

$record = $button->getCurrentRecord();
$result["CustomerID"] = $record["CustomerID"];

ClientAfter code

var win = Runner.displayPopup( { 
	url: "customers_view.php?editid1="+result["CustomerID"],
	width: 700,
	height: 500,
	header: 'View customer'
});

Show Add page in popup, close popup on 'Save' and refresh the List page

We are adding a button to the list page to display Add page in popup and once record is saved we close the popup and refresh the list page to show a new record.

1. PHP

Button's ClientBefore code

window.popup = Runner.displayPopup( {
url: "Categories_add.php",
width: 700,
height: 700,
header: 'Add Category'
});

AfterAdd event

$pageObject->setProxyValue('saved', true);
echo "";

Javascript OnLoad event of Add page

if ( (proxy['saved'] ) && window.parent && window.parent.popup ) {
window.parent.close();
window.parent.location.reload();
}

2. ASP

Button's ClientBefore code

window.popup = Runner.displayPopup( {
url: "Categories_add.asp",
width: 700,
height: 700,
header: 'Add Category'
});

AfterAdd event

pageObject.setProxyValue "saved", true
Response.Write  ""

Javascript OnLoad event of Add page

if ( (proxy['saved'] ) && window.parent && window.parent.popup ) {
window.parent.close();
window.parent.location.reload();
}

3. C#

Button's ClientBefore code

window.popup = Runner.displayPopup( {
url: "Categories/add",
width: 700,
height: 700,
header: 'Add Category'
});

AfterAdd event

pageObject.setProxyValue("saved", true);
MVCFunctions.EchoToOutput("");

Javascript OnLoad event of Add page

if ( (proxy['saved'] ) && window.parent && window.parent.popup ) {
window.parent.close();
window.parent.location.reload();
}

5 thoughts on “Displaying a popup in PHPRunner 9.0, ASPRunnerPro 9.5, ASPRunner.NET 9.0

  1. I just came across this blog post. THANK YOU!!!!! This is absolutely perfect. I works with any URL which really helps my current project. Looks awesome with the Bootstrap theme.

  2. THX! very cool. I tried the “view customer” button and it looks fantastic. How can I manage to close the Pop up when clicked “save” here?
    THX
    Andreas

  3. how to passing an array through that GET request?

    while ($data = $button->getNextSelectedRecord() ) {
    $result[“id”]=$data[“id”]; // array..

    }

    Client after

    var win = Runner.displayPopup( {

    url: “test.php?id=”+result[“id”],

    width: 900,

    height: 600,

    header: ‘Demonstrativo Exportacao’

    });

Leave a Reply

Your email address will not be published. Required fields are marked *