PDA

View Full Version : [CLOSED] Issue with Dialog



jcanton
Oct 28, 2019, 11:12 AM
Hello,

I'm upgrading to Ext.Net 5.0 but I'm stuck on dialog. On previous version I called a javascript function to oepn a new dialog wich contains another ext.net page.

Unfortunatelly I cannot make it work with version 5.0 and I do not know why. This is an example code wich reproduces the issue.

When clicked the button should open a dialog wich contains the same page. The dialog is opened and the call to the page is done, but nothing is shown.

Any Clues?

This is the code for test.aspx



<%@ Page Language="C#" %>

<%@ Register assembly="Ext.Net" namespace="Ext.Net" tagprefix="ext" %>

<script runat="server">
protected void Button1_Click(object sender, DirectEventArgs e)
{

string script="newWindow('test.aspx',{title: 'New title'})";
Button1.AddScript(script);
}
</script>

<!DOCTYPE html>

<html>
<head runat="server">
<title>Ext.NET Example</title>
<script type="text/javascript">
var newWindow = function (url, config) {
new Ext.Window(Ext.apply({
renderTo: Ext.getBody(),
resizable: false,
title: "Test",
height: 500,
width: 500,
frame: true,
autoLoad: {
showMask: true,
mode: "iframe",
url: url
}
}, config)).show();
}
</script>
</head>

<body>
<ext:ResourceManager runat="server" Theme="Triton" />

<form runat="server">
<ext:Panel
ID="Window1"
runat="server"
Title="Welcome to Ext.NET"
Height="215"
Width="350"
Frame="true"
Collapsible="true"
Cls="box"
BodyPadding="5"
DefaultButton="0"
Layout="AnchorLayout"
DefaultAnchor="100%">
<Items>
<ext:TextArea
ID="TextArea1"
runat="server"
EmptyText=">> Enter a Test Message Here <<"
FieldLabel="Message"
Height="85"
/>
</Items>
<Buttons>
<ext:Button
ID="Button1"
runat="server"
Text="Submit"
Icon="Accept"
OnDirectClick="Button1_Click"
/>
</Buttons>
</ext:Panel>
</form>
</body>
</html>

fabricio.murta
Oct 28, 2019, 6:01 PM
Hello @jcanton!

The client-side syntax has changed to loader instead of an autoLoad object. For the equivalence, the loader object should have an autoLoad: true property.

In other words, your autoLoad property in the window object should be:



loader: {
showMask: true,
url: url,
renderer: 'frame',
autoLoad: true
}


You may also want to change the window creation syntax from:



new Ext.Window(Ext.apply({ window_config }, config)).show();


Into



Ext.create("Ext.Window", { window_config }).show();


Where window_config would be the window config object, in your case:



var window_config = {
renderTo: Ext.getBody(),
resizable: false,
title: "Test",
height: 500,
width: 500,
frame: true,
loaderoad: {
showMask: true,
mode: "frame",
url: url,
autoLoad: true
}
}


I just turned in a variable to make it easier to understand what changed in the component creation code.

An example close to what you need would be the TabPanel > Add Tabs (https://examples5.ext.net/#/TabPanel/Basic/Add_Tabs/) one. The difference there is the pages are loaded within a tab panel (container), while your container is a window.

Hope this helps!

jcanton
Oct 29, 2019, 9:01 AM
Thank you!!,

It works now.

fabricio.murta
Oct 31, 2019, 5:13 PM
Hello @jcanton.

Thanks for the feedback, and glad it helped!