Oct 15, 2014, 9:17 PM
Code behind content handling (from client events)
Hello, I got stuck again on something.
What I want: to be able to click something and make a page load right below it (and above the next something that might happen to be on screen).
What complicates it: I don't know how many somethings will be on screen so I have to create them via code behind
What I couldn't do: fire the something.load() client-side method once the object is built and I can interact with it using (for example) show/hide methods.
What have I based on: https://examples2.ext.net/#/Loaders/...Direct_Method/
Here is the KISS code for it:
aspx:
What I want: to be able to click something and make a page load right below it (and above the next something that might happen to be on screen).
What complicates it: I don't know how many somethings will be on screen so I have to create them via code behind
What I couldn't do: fire the something.load() client-side method once the object is built and I can interact with it using (for example) show/hide methods.
What have I based on: https://examples2.ext.net/#/Loaders/...Direct_Method/
Here is the KISS code for it:
aspx:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="loaderFromCB.aspx.cs" Inherits="ExtNetPlayground.loaderFromCB" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<ext:ResourceManager runat="server" />
<ext:Panel runat="server" ID="pn1" Height="600" />
</div>
</form>
</body>
</html>
aspx.csusing Ext.Net;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using x = Ext.Net;
namespace ExtNetPlayground
{
public partial class loaderFromCB : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
var iterator = 1; // it would be an iterated number, left constant for simplicity
var panId = "pnl" + iterator;
var panIdJs = "#{" + panId + "}";
var lbl = new x.Button { Text = "Click to show/hide page." };
lbl.Listeners.Click.Handler = "if ( " + panIdJs + ".isVisible()) { " + panIdJs + ".hide(); } else { " + panIdJs + ".show(); };"; // can't add a //" + panIdJs + ".load()// here
var pnlLoader = new x.ComponentLoader
{
Url = "http://www.ext.net/",
Mode = LoadMode.Frame,
LoadMask = { ShowMask = true },
AutoLoad = true // this true, and pnl below, Hidden = false, makes the page load "on load"
// this true, pnl with 'Hidden = true' makes the page not load "on load" (good). Shouldn't trigger on 'show()'? Prolly no.
};
// interesting fact: if you hide this panel before page is loaded, the panel is hidden; not its load mask. :)
var pnl = new x.Panel() {
ID = panId,
Hidden = true,
Loader = pnlLoader,
Height = 200, // want to make it 100%, scrolling only once height exceeds 400 pixels
MaxHeight = 400
};
lbl.AddTo(pn1);
pnl.AddTo(pn1);
}
}
}
Thank you very much! I'll ask my boss to purchase premium support when this page I am trying to build is ready! heh