Showing posts with label html. Show all posts
Showing posts with label html. Show all posts

Wednesday, March 28, 2012

ListBox and DragPanelExtender

ListBox is rendered last so z-index has no effect.

Can a use any (html) trick to get the object attach to the DragPanelExtender (asp:panel) moving over the ListBox?

Huh? [:^)]

My reading of thez-index documentation makes me think it would help here - you're saying it doesn't?


no z-index fails
On IE (at least) ListBox, TextBox, and ComboBox are actual windows controls placed by the browser. Since they are separate HWNDs ordered above the browsers rendering surface HWND< they can't be z-ordered under other elements, unfortuntately.
I am running into this right now. The DragPanelExtender is pretty much useless unless you don't have any controls with Hwnds on your page (which is very rare for me.) Granted I could leave it, but it does not look professional at all.

The frustrating thing is that the PopupControlExtender DOES get layered above all other controls. So I think it is an opportunity for the Atlas team to change the DragPanelExtender to have whatever it is the PopupControlExtender has that allows it to be on top.

If I come up with a solution, I will post it. I think there should be a way around this if the PopupControlExtender is able to show HTML content on top of an asp:DropDownList.

can i use css adapters to make z-index to work for DropDownList ...


I found another page have some hints to doing so, I think it should also implement to Modal Popup

http://dotnetjunkies.com/WebLog/jking/archive/2003/10/30/2975.aspx

<html>
<head>
<script>
function DivSetVisible(state)
{
var DivRef = document.getElementById('PopupDiv');
var IfrRef = document.getElementById('DivShim');
if(state)
{
DivRef.style.display = "block";
IfrRef.style.width = DivRef.offsetWidth;
IfrRef.style.height = DivRef.offsetHeight;
IfrRef.style.top = DivRef.style.top;
IfrRef.style.left = DivRef.style.left;
IfrRef.style.zIndex = DivRef.style.zIndex - 1;
IfrRef.style.display = "block";
}
else
{
DivRef.style.display = "none";
IfrRef.style.display = "none";
}
}
</script>
</head>
<body>
<form>
<select>
<option>A Select Box is Born ...</option>
</select>
</form>
<div
id="PopupDiv"
style="position:absolute; top:25px; left:50px; padding:4px; display:none; background-color:#000000; color:#ffffff; z-index:100">
... and a DIV can cover it up<br>through the help of an IFRAME.
</div>
<iframe
id="DivShim"
src="http://pics.10026.com/?src=javascript:false;"
scrolling="no"
frameborder="0"
style="position:absolute; top:0px; left:0px; display:none;">
</iframe>
<br>
<br>
<a href="http://links.10026.com/?link=#" onclick="DivSetVisible(true)">Click to show DIV.</a>
<br>
<br>
<a href="http://links.10026.com/?link=#" onclick="DivSetVisible(false)">Click to hide DIV.</a>
</body>
</html>

Monday, March 26, 2012

ListSearchExtender - Inside HTML Table - Prompt position is above table

I've seen forum questions regarding this issue from several months ago.

Has a solution been found?

I am putting al dropdownlist inside an html table using a listsearchextender.

I have not modified the css, so it is using the sample that comes with the toolkit.

When I click on the dropdownlist, the search prompt displays above the table.

I also added several additional dropdownlists with extenders and they all put the search prompt above the table

Is there a work around to get the search prompt to display directly above the position of the dropdownlist regardless of what row it on in a table ?

Thanks.

Hi,

I tried what you described on the sample web site, but can't reproduce the issue. Here is the code I used:

<table>
<tr>
<td>
</td>
<td style="width: 103px">
aa</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td style="width: 103px">
bb</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
<td style="width: 103px">
<asp:DropDownList ID="DropDownList1" runat="server" Width="100px" /></td>
<td>
</td>
</tr>
</table>
<br />
<p>
<ajaxToolkit:ListSearchExtender ID="ListSearchExtender2" runat="server"
TargetControlID="DropDownList1" PromptCssClass="ListSearchExtenderPrompt">
</ajaxToolkit:ListSearchExtender>
</p>

ListSearchExtender prompt position

Would it be possible to add two new positions for the prompt: Left and Right? When using a DropdownList control inside of an HTML table the prompt cannot display correctly when positioned at the top of the control because it overwrites the list and it becomes unreadable. When inside of an HTML table it would be nice to be able to position the prompt either to the left or right of the control. Also, it would be good to have a prompt enable/disable feature because blanking the prompt text does not resolve the problem. I tried the workaround of setting the CSS class .list_search_method display:none; but that doesn't seem to work in some cases.

You could change the ListSearchExtender code easily to have it adapt to your scenario. Although, you shouldopen a work item to have us fix this.

You will need to add additional values to the ListSearchPromptPosition enum and modify the Behavior as well.

1 In the js file...
2
3 // Hook up a PopupBehavior to the promptDiv
4 this._popupBehavior = $create(AjaxControlToolkit.PopupBehavior, { parentElement : element }, {}, {},this._promptDiv);
5 if (this._promptPosition &&this._promptPosition == AjaxControlToolkit.ListSearchPromptPosition.Bottom) {
6 this._popupBehavior.set_positioningMode(AjaxControlToolkit.PositioningMode.BottomLeft);
7 }else if (this._promptPosition &&this._promptPosition == AjaxControlToolkit.ListSearchPromptPosition.Top) {
8 this._popupBehavior.set_positioningMode(AjaxControlToolkit.PositioningMode.TopLeft);
9 }else {
10 this._popupBehavior.set_x(getLeftOffset());// compute those offset values based on whether left or right was passed for the prompt position
11 this._popupBehavior.set_y(getTopOffset());// see popup control behavior on how it does that
12 }

Modify theenum...1516AjaxControlToolkit.ListSearchPromptPosition.prototype = {17 Top: 0,18 Bottom: 1,19 Left: 2,20 Right: 321}22AjaxControlToolkit.ListSearchPromptPosition.registerEnum('AjaxControlToolkit.ListSearchPromptPosition');In the cs file...26public enum ListSearchPromptPosition27 {28 Top = 0,29 Bottom=1,30 Left=2,31 Right=3,3233 }34


would you be able to advise your HTML that isn't working? Simply doing this:

 <table style="border: 2px solid black;"> <tr> <td><asp:ListBox ID="ListBox1" runat="server" Width="100px" /></td> </tr> </table> <ajaxToolkit:ListSearchExtender ID="ListSearchExtender1" runat="server" TargetControlID="ListBox1" PromptCssClass="ListSearchExtenderPrompt"> </ajaxToolkit:ListSearchExtender> works fine.


well, what it is overwriting is the top of the table and the border.

Basically to work around this, the behavior would have to create a span located above the textbox in its parent container.

I don't see that it overwrites the text of the list itself, though.


Thanks for the suggestion. I experimented a bit more based on your suggestion and found that by adding a row on top of the ListBox row allows the prompt to be displayed without clobbering anything around it. But if you need to place some text above the ListBox, then this workaround is not the best.

<table style="border: 2px solid black;">

<tr><td> </td></tr>


<tr>
<td><asp:ListBox ID="ListBox1" runat="server" Width="100px" /></td>
</tr>
</table>
<ajaxToolkit:ListSearchExtender ID="ListSearchExtender1" runat="server"
TargetControlID="ListBox1" PromptCssClass="ListSearchExtenderPrompt">
</ajaxToolkit:ListSearchExtender>


Thanks, I will open a work request as suggested. I had started to play with the source code last week and figured out the enum and prototype additions for Left and Right. I tried also to add code to check for ListSearchPromptPosition.Left and ListSearchPromptPosition.Right and was hoping that AjaxControlToolkit.PositioningMode.Left and AjaxControlToolkit.PositionMode.Right was already supported. I gave up at that point.

Here is what I tried to do:

3 // Hook up a PopupBehavior to the promptDiv
4 this._popupBehavior = $create(AjaxControlToolkit.PopupBehavior, { parentElement : element }, {}, {}, this._promptDiv);
5 if (this._promptPosition && this._promptPosition == AjaxControlToolkit.ListSearchPromptPosition.Bottom) {
6 this._popupBehavior.set_positioningMode(AjaxControlToolkit.PositioningMode.BottomLeft);
7 } else if (this._promptPosition && this._promptPosition == AjaxControlToolkit.ListSearchPromptPosition.Top) {
8 this._popupBehavior.set_positioningMode(AjaxControlToolkit.PositioningMode.TopLeft);
7 } else if (this._promptPosition && this._promptPosition == AjaxControlToolkit.ListSearchPromptPosition.Left) {
8 this._popupBehavior.set_positioningMode(AjaxControlToolkit.PositioningMode.Left);
7 } else if (this._promptPosition && this._promptPosition == AjaxControlToolkit.ListSearchPromptPosition.Right) {
8 this._popupBehavior.set_positioningMode(AjaxControlToolkit.PositioningMode.Right);
9 }

If I have time I will try to work out the code as suggested.

thanks!


Hi,

Was there ever a work item opened for this? Ability to position the prompt text more precisely would be helpful. Also, sometimes the dropdown opens down and sometimes it opens up. Then the prompt is covered up. Making the prompt position dynamic would be even better.

Saturday, March 24, 2012

Load a web page, play with the html code and paste in a DIV

Hi,

I have a default.aspx page and I want one of it's frames to present a web page from another site. I tried using JS AJAX and found that is is impossible to do this across sites. It there a way to get the server to get a web page, allow me to play with it's html code and then paste it in a div in default.aspx?

I know how to get my I default.aspx page to invoke a function on WebServer.asmx, but have no idea how to get a web page in VB. Can someone explain how / redirect me to an explaination?

Thanks
Yoni

Check this article:http://msdn2.microsoft.com/en-us/library/system.net.webrequest.aspx


If it's in a frame anyway, it seems like you might be adding needless complexity by trying to do this on the client side. For good security reasons, there will always be limitations on what you can do cross-domain on the client side.

You could just set that frame's src to a RemoteContent.aspx (or whatever) page on your site, and have that make the web request on the server side, manipulate it how you want, and then present it.


gt1329a:

If it's in a frame anyway, it seems like you might be adding needless complexity by trying to do this on the client side. For good security reasons, there will always be limitations on what you can do cross-domain on the client side.

You could just set that frame's src to a RemoteContent.aspx (or whatever) page on your site, and have that make the web request on the server side, manipulate it how you want, and then present it.

and how can I do this? also, can I put it in an iframe?
Thanks,
Yoni


MSDN has good information on how to use the WebRequest class (as someone else linked above): http://msdn2.microsoft.com/en-us/library/system.net.webrequest(VS.80).aspx

It would work fine in an iframe. Just set the iframe's src to your RemoteRequest.aspx (or whatever) and have that do the processing on the server side and output what you want to appear in the iframe.


gt1329a:

MSDN has good information on how to use the WebRequest class (as someone else linked above): http://msdn2.microsoft.com/en-us/library/system.net.webrequest(VS.80).aspx

I tried to get the following page but keep getting a timout error:
http://he.wikipedia.org/w/index.php?title=%D7%AA%D7%91%D7%A0%D7%99%D7%AA:%D7%94%D7%A2%D7%A8%D7%9A_%D7%94%D7%9E%D7%95%D7%9E%D7%9C%D7%A5&action=render
Why won't Microsoft's WebRequest example work with this page?
Yoni


I'm not sure why that would time out. Is there anything blocking outbound connections to port 80 on the server you're testing this on?

Another thing you might want to look at issetting the request's user agent to a popular browser's. Wikipedia might have some sort of restrictions in place to deter scrapers from stealing its content.


Thanks. I managed to load the page using the following code:

Dim wcAs WebClient =New WebClient()wc.Credentials = CredentialCache.DefaultCredentialswc.Encoding = System.Text.Encoding.UTF8wc.Headers.Add("Content-Type","application/x-www-form-urlencoded")wc.Headers.Add("User-agent","User")Dim resAs Uri =New Uri("http://he.wikipedia.org/w/index.php?title=%D7%AA%D7%91%D7%A0%D7%99%D7%AA:%D7%94%D7%A2%D7%A8%D7%9A_%D7%94%D7%9E%D7%95%D7%9E%D7%9C%D7%A5&action=render&ctype=text/plain&dontcountme=s")Return wc.DownloadString(res)
Thanks for your help.

Load external HTML file

Hi All,

I'm very new to this (Ajax & ASP) and am trying to implement something which I think should be stright-forward but am having no luck.

Basically I want to load an external html file (or html snippet) into a section of the current web form/page, I don't want to use iframes for this. I have an idea that I might need to use an UpdatePanel and maybe a DynamicPopulateExtender but can't piece it together.

Any help/direction greatly appreciated . . .

Hi,

How do you plan to use UpdatePanel & DynamicPopulateExtender?

I think IFrame is a good choice for such situation.

Wednesday, March 21, 2012

loading a page is taking too long

Hello.. On a page in a AjaxEnabledWebApplication I have 3 server controls (asp:ScriptManager, asp:Timer, asp:UpdatePanel) and some HTML controls(some inputs). Sometimes, when IIS loads the page, the loading works fine(max 1 second)... but sometimes it`s taking a couple of minutes. Everything is on localhost and I don`t have any database connections.

Can someone help me?

thanks

One more specification... This happens only I run the application from Visual Studio 2005(F5). If I run the application from a browser, everything works great.

Thanks


ASP.NET AJAX at the first time when you run your project in degug(F5) may take a few extra time becose the deguge mode is true.when you publish your website specifydebug="false" in web.config file .or try debug = false ,you will see it faster.

Regards.


I think I`ve tricked him... I set the IIS as the development server(from project proprietes... not the one from Visual Studio..) and now works great...

Loading the Ajax Toolkit Page with IFrame into Php-website: Access denied

How to load the Ajax Toolkit Page (my Chat) with IFrame into Php-website?

Code for an illustration:

1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">2<html xmlns="http://www.w3.org/1999/xhtml" >3<head>4<title>Untitled Page</title>5</head>6<body>7<iframe id="iframe1" width="100%" height="1000" frameborder="0" src="http://ajax.asp.net/ajaxtoolkit/Accordion/Accordion.aspx" marginwidth="0" marginheight="0" scrolling="no" />8</body>9</html>10

There is nothing elase that you have to do.

Since PHP is in-line with HTML, just close your PHP and specify the HTML iframe tage.

As long as the iframe page is a complete AJAX Toolkit page that works stand-alone, you should be fine.