Showing posts with label situation. Show all posts
Showing posts with label situation. Show all posts

Wednesday, March 28, 2012

Calling Custom Client Method with xml-script

Here is the situation, I have created a custom class that inherits from the ATLAS foundation client classes, I can initialize it with no problems with-in the xml-script, but what I want to do next is have a button call a method that of my custom client class, I know to add the button and click behavior but after that I am not sure what to declare as all the examples that I find are for web services and global javascript functions. Here is a tiny excerpt of the code I am working with to help:

I want to call MyContainer.AdjustThumbnailDimensions method and pass in the attributes from the two text form fields. Any help would be greatly apprieciated.

1<%@dotnet.itags.org. Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>23<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">4<html xmlns="http://www.w3.org/1999/xhtml">5<head runat="server">6 <link href="CSS/Thumbnail.css" rel="stylesheet" type="text/css" />7 <title>Untitled Page</title>8</head>9<body>10 <form id="form1" runat="server">11 <atlas:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true" />1213 <div id="ThumbnailContainer" thumbnailHeight="150" thumbnailWidth="100">14 <div class="Thumbnail" img="Images/Space.gif" label="Test Thumbnail"></div>15 <div class="Thumbnail" img="Images/Joker.jpg" label="Joker"></div>16 <div class="Thumbnail" img="Images/Space.gif" label="Another Test"></div>17 </div>1819 height <input type="text" name="tHeight" value="150" size="4" /> width <input type="text" name="tWidth" value="100" size="4" /> <input id="adjustDimensions" type="button" value="Adjust Thumbnails" onclick="AdjustThumbnailDimensions( document.forms[0].tWidth.value, document.forms[0].tHeight.value );" />20 </form>21 <script>22My.Client.UI.MyContainer = function( associatedElement ) {23 My.Client.UI.MyContainer.initializeBase(this, [associatedElement]);2425 var m_Thumbnails = new Array();26 var m_ThumbnailHeight;27 var m_ThumbnailWidth;2829 this.initialize = function() {3031 for( var index = 0; index < associatedElement.childNodes.length; index++ ) {32 thumbnail = associatedElement.childNodes[index];33 m_Thumbnails[index] = new SGP.SPI2.Client.UI.Thumbnail( thumbnail );34 m_Thumbnails[index].initialize();3536 m_Thumbnails[index].set_ThumbnailHeight( m_ThumbnailHeight );37 m_Thumbnails[index].set_ThumbnailWidth( m_ThumbnailWidth );38 }39 }4041 this.AdjustThumbnailDimensions = function( width, height ) {4243 for( var index = 0; index < thumbnails.length; index++ ) {44 m_Thumbnails[index].set_ThumbnailHeight( height );45 m_Thumbnails[index].set_ThumbnailWidth( width );46 }4748 }4950}51My.Client.UI.MyContainer.registerClass( "My.Client.UI.MyContainer", Sys.UI.Control);52Sys.TypeDescriptor.addType("script", "MyContainer", My.Client.UI.MyContainer);53</script>54 <script type="text/xml-script">55 <page xmlns:script="http://schemas.microsoft.com/xml-script/2005">56 <references>57 <add src="Thumbnail.js" />58 </references>59 <components>60 <ThumbnailContainer id="ThumbnailContainer" />61 <button id="adjustDimensions">62<!-- What to do here ?? -->63<click>64 <invokeMethod />65 </click>66 </button>67 </components>68 </page>69 </script>70</body>71</html>
Thank youOk, I have figured out what I was missing from more disection of the ATLAS runtime and hunting around for more examples of invokeMethod. I had to add the method getDescriptor and then I was able to reference my method. Now the next phase to bind the parameters to the form fields.

Wednesday, March 21, 2012

CalendarExtender, MaskedEditExtender, and MaskedEditValidator

Hi all,

I have this fiddly situation where I have a MaskedEditExtender to give me a date mask on a TextBox, and a MaskedEditValidator to give the user feedback if the date is invalid - empty is allowed. I also have a CalendarExtender on this TextBox so the user doesn't have to type. I have two things to note:

    When you set "ClearMaskOnLostFocus" of the extended TextBox properties, the CalendarExtender doesn't work - you can set the date, but when you click away to hide the calendar, it also resets the mask and the TextBox content.When you do not have "ClearMaskOnFocus" set, allow empty values, click in the TextBox (to bring up the input mask), and click out again - the input mask remains and any validation message you attached to the MaskedEditValidator now appears - this goes against what I expect to be correct, as the TextBox is empty.

The third problem that I won't number is that the two problems are exacerbated by the CalendarExtender, without that only the second problem would persist, which could furthermore be solved by setting "ClearMaskOnLostFocus". I haven't tested what happens to the TextBox and its values etc in any other situation.

Has anyone else encountered this issue?

Temporarily, does anyone have a work around? I require the calendar object to give the user a mouse option, and need a basic input mask toat leastblock out alphabetic characters and format the date in dd/MM/yyyy format.

Thanks in advance!

Hello. Might be a bit late for an reply, but I had the same problem as you. I was using a textBox with a MaskedEdit & a CalendarExtender.

I was clicking on the textbox, the calendar was showing up. One time on two, it was telling me the date was invalid (but it was valid). And the weirdest thing was when I clicked on a date, it was writing it in the textbox, saying it was valid. But as soon as I clicked outside the calendar to close it, the validator was emptying the textbox and telling me it was an invalid date.

I was losing it, but strangely, when I read your post I decided to try adding a "ClearMaskOnLostFocus="False" (that parameter wasn't originally declared so I don't know what is the default value). and now ... it WORKS 100%.

Btw, I'm using DD/MM/YYYY format. The easiest trick to do that is simply to set the MaskedEditExtender's culture to "en-GB" and it worked #1. Here's my code of a working textbox with a calendar, all using the DD/MM/YYYY format.

<asp:LabelID="Label5"runat="server"Font-Bold="True"Font-Size="Smaller"Style="text-align: right"

Text="DATE DéPART:"Width="143px"></asp:Label>

<asp:TextBoxValidationGroup="dateValidator1"MaxLength="1"ID="dateDepart"runat="server"style="text-align:center"Width="77px"></asp:TextBox>

<asp:LabelID="Label14"runat="server"Width="68px"></asp:Label>

<cc1:MaskedEditValidatorID="MaskedEditValidator1"runat="server"

ControlExtender="MaskedEditExtender1"

SetFocusOnError="true"

Display="Dynamic"

ControlToValidate="dateDepart"

IsValidEmpty="False"

EmptyValueMessage="Date is required"

InvalidValueMessage="Date is invalid"

ValidationGroup="dateValidator1"

TooltipMessage="Input a Date"/>

<asp:LabelID="Label7"runat="server"Width="75px"></asp:Label><br/>

<cc1:CalendarExtenderID="CalendarExtender1"runat="server"Format="dd/MM/yyyy"TargetControlID="dateDepart">

</cc1:CalendarExtender>

<br/>

<br/>

<cc1:MaskedEditExtenderID="MaskedEditExtender1"runat="server"

MaskType="Date"

TargetControlID="dateDepart"

Mask="99/99/9999"

CultureName="en-GB"

MessageValidatorTip="true"

OnFocusCssClass="MaskedEditFocus"

OnInvalidCssClass="MaskedEditError"

ClearMaskOnLostFocus="false"

DisplayMoney="Left"

AcceptNegative="Left"/>

<br/>

Pat.


I ran into some of the same problems. My issue was allowing for empty values w/out invalidating. Seethis post for more info and sample code.

Hope this helps.

CalendarExtender, MaskedEditExtender, and MaskedEditValidator

Hi all,

I have this fiddly situation where I have a MaskedEditExtender to give me a date mask on a TextBox, and a MaskedEditValidator to give the user feedback if the date is invalid - empty is allowed. I also have a CalendarExtender on this TextBox so the user doesn't have to type. I have two things to note:

    When you set "ClearMaskOnLostFocus" of the extended TextBox properties, the CalendarExtender doesn't work - you can set the date, but when you click away to hide the calendar, it also resets the mask and the TextBox content.When you do not have "ClearMaskOnFocus" set, allow empty values, click in the TextBox (to bring up the input mask), and click out again - the input mask remains and any validation message you attached to the MaskedEditValidator now appears - this goes against what I expect to be correct, as the TextBox is empty.

The third problem that I won't number is that the two problems are exacerbated by the CalendarExtender, without that only the second problem would persist, which could furthermore be solved by setting "ClearMaskOnLostFocus". I haven't tested what happens to the TextBox and its values etc in any other situation.

Has anyone else encountered this issue?

Temporarily, does anyone have a work around? I require the calendar object to give the user a mouse option, and need a basic input mask toat leastblock out alphabetic characters and format the date in dd/MM/yyyy format.

Thanks in advance!

Apologies, I appear to have double posted - use the other one :)