PDA

View Full Version : [CLOSED] [CODE] Is the Ext.ux.IFrame available in Ext.Net



RCM
Jul 19, 2016, 7:42 PM
Good day,

Please can you inform me on how I can get access to the Ext.ux.IFrame component that is available in SenchaJs. I need to render some raw HTML text in a panel and this seems the best option.

The html content can be a partial html page or a full html page including scripts and Css.


I need to be able to set the raw HTML content directly to be loaded in the IFrame.

fabricio.murta
Jul 19, 2016, 8:46 PM
Hello @RCM!

You saying that using a frame (iframe) loader in the panel does not work for you, in a similar way it does in the example linked below?

Load External Website into an <ext:Window> (http://examples2.ext.net/#/Window/Basic/Load_External_Website/).

At first, the Ext.ux.IFrame class is not exported to the Ext.NET scope.

RCM
Jul 19, 2016, 9:03 PM
Good day,

Thanks for your quick response. Can I pass raw HTML content to the loader without using the URL property to an html document. If so please offer some guidance in doing this approach.

thanks

RCM
Jul 19, 2016, 9:07 PM
Good day,

See my use case below:

I am trying to render the following page in a pane using the update method on panel and setting the use scripts parameter to true, but it does not load my my scripts.



panel.update(htmlContent, true, function(){}); - In addition there is no response to the callback function.

<!doctype html>
<head>

<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.2/raphael-min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/prettify/r224/prettify.min.js"></script>
<script src="lib/example.js"></script>
<link rel="stylesheet" href="lib/example.css">
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/prettify/r224/prettify.min.css">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.css">

<script>
$(document).ready(function(){
alert('Ready');
});
</script>
</head>
<body>
<h1>Area charts</h1>
<div id="graph"></div>
<pre id="code" class="prettyprint linenums">
// Use Morris.Area instead of Morris.Line
Morris.Area({
element: 'graph',
data: [
{x: '2010 Q4', y: 3, z: 7},
{x: '2011 Q1', y: 3, z: 4},
{x: '2011 Q2', y: null, z: 1},
{x: '2011 Q3', y: 2, z: 5},
{x: '2011 Q4', y: 8, z: 2},
{x: '2012 Q1', y: 4, z: 4}
],
xkey: 'x',
ykeys: ['y', 'z'],
labels: ['Y', 'Z']
}).on('click', function(i, row){
console.log(i, row);
});
</pre>
</body>

fabricio.murta
Jul 19, 2016, 10:29 PM
Hello @RCM!

Please provide a fully runnable test case so we can try and reproduce it in our side and provide you better feedback.

RCM
Jul 20, 2016, 4:54 PM
Good day,

Thanks for assistance, I got it working using the following loader settings:



<Loader Scripts="True" AutoLoad="False" Mode="Html"></Loader>

fabricio.murta
Jul 21, 2016, 5:59 AM
Hello!

Glad you could make your use case work, even without requiring our help on the specific last step! And thanks for sharing the outcome! It may, somehow, help someone else with this same problem in the future.

Oh, and if you don't mind, please remember wrapping code you paste (or type) in posts between
and tags! For convenience I've just edited both your posts with the tags around code.