I just started using YUI DD and everything is working great, but I am
having issues in Mozilla when I set my div overflow property that my
items are contained in.  The draggable objects are simply getting lost
in the ether when I attempt to move them to my target.  Everything
works fine in IE.

I have to have a horizontal scroll on the page because I have a large
collection of draggable items.

There has to be a solution for this somewhere out there, but I can't
seem to find it.

ANY advice, help, solutions would be GREATLY appreciated!!!

THANKS!

Hi, I've searched all over Google for information on this, but I
couldn't find any. I implemented (correctly) the YUI Calendar widget
on a site I am working on, but the right side is a bit cut off and the
dates are completely un-aligned. Any help would be appreciated.

-Chris

I don't know if the issue come from that, but you set a new
autocomplet widget for every change.

I put my code. Therefore ther i another issue.
When I select a item from the first autocomplete, the second is well
refreshed. Then I select a value in the second everything is OK.
BUT, when I select another value from the first autocomplete, the
second is'nt correctly refreshed.

// <!-- DEBUT AUTOCOMPLETE DES PAYS -->
/**
  * Fonctions utilisées pour l'autocomplétion des pays
  * et des villes en fonction du pays sélectionné
  *
  * @variable datasetStates[i][j] : i == 0 => StateLib
  * 										 i == 1 => StateUNID
  */
var datasetStates;

  /**
  * Fonction retournant la liste des pays commençant par la chaine
transmise en paramètre
  * en utilisant la variable datasetStates précédement initialisée
  *
  * @method getStates
  * @param sQuery {String} Query string.
  * @returns {String[]} Array of result objects.
  */
function getStates(sQuery) {
     aResults = [];
     if(datasetStates == undefined){
	     var columns = new Array(1);
		 columns[0] = 0;
		 columns[1] = 1;
		 var datasetStates = dbColumn("","","Pays",columns);
     }
     if(sQuery && sQuery.length > 0) {

         if(datasetStates) {
             for(var i = datasetStates.length-1; i >= 0; i--) {
                 var sKey = datasetStates[i][0];
                 var sKeyIndex =
encodeURI(sKey.toLowerCase()).indexOf(sQuery.toLowerCase());

                 // Query found at the beginning of the key string for
STARTSWITH
                 // returns an array of arrays where STATE is index=0,
ABBR is index=1
                 if(sKeyIndex === 0) {
                     aResults.unshift([sKey, datasetStates[i][1]]);
                 }
             }
             return aResults;
         }
     }
     // Empty queries return all states
     else {
             for(var i = datasetStates.length-1; i >= 0; i--) {
                 aResults.push([datasetStates[i][0], datasetStates[i][1]]);
             }
         return aResults;
     }
}

YAHOO.locations.autocompleteStates = function(){
     var oACDSStates;
     var oAutoCompStates;

     return {
         init: function() {

             // Instantiate JS Function DataSource
             oACDSStates = new YAHOO.widget.DS_JSFunction(getStates);
             oACDSStates.maxCacheEntries = 0;

             // Instantiate AutoComplete
             oAutoCompStates = new
YAHOO.widget.AutoComplete('statesinput','statescontainer', oACDSStates);
             oAutoCompStates.alwaysShowContainer = true;
             oAutoCompStates.queryDelay = 0;
             oAutoCompStates.minQueryLength = 0;
             oAutoCompStates.maxResultsDisplayed = 50;
             oAutoCompStates.formatResult = function(oResultItem, sQuery) {
                 var sMarkup = oResultItem[0] ;
                 return (sMarkup);
             };

             // Subscribe to Custom Events

oAutoCompStates.itemSelectEvent.subscribe(YAHOO.locations.autocompleteStates.myi\
temSelectEvent);

oAutoCompStates.dataReturnEvent.subscribe(YAHOO.locations.autocompleteStates.myO\
nDataReturn);

oAutoCompStates.containerCollapseEvent.subscribe(YAHOO.locations.autocompleteSta\
tes.myOnContainerCollapse);

             // Set initial content in the container
           oAutoCompStates.sendQuery("");

         },

        	 // Define Custom Event handlers
			 myitemSelectEvent: function(oSelf, elItem, oData) {
			 self.locations.statesID.value = elItem[2][1];
			 self.locations.citiesID.value = "";
			 self.locations.citiesinput.value = "";
			 //YAHOO.example.Cities.init;
			 YAHOO.locations.autocompleteCities.resetState(elItem[2][1]);
		 },

         // Define Custom Event handlers
	 myTextboxKeyEvent: function(oSelf, nKeyCode) {

	 },

         myOnDataReturn: function(sType, aArgs) {
             var oAutoCompStates = aArgs[0];
             var sQuery = aArgs[1];
             var aResults = aArgs[2];

             if(aResults.length == 0) {
                 oAutoCompStates.setBody("<div
id=\"statescontainerdefault\">No matching results</div>");
             }
         },

         validateForm: function() {
             // Validate form inputs here
             return false;
         }
     };
}();

YAHOO.util.Event.addListener(this,'load',YAHOO.locations.autocompleteStates.init\
);
// <!-- FIN AUTOCOMPLETE DES PAYS -->


// <!-- DEBUT AUTOCOMPLETE DES VILLES -->
/**
  * Fonctions utilisées pour l'autocomplétion des pays
  * et des villes en fonction du pays sélectionné
  *
  * @variable datasetCities[i][j] :  i == 0 => CityLib
  * 										 i == 1 => CityUNID
  */
var datasetCities;

/////////////////////////////////////////////////////////////////////////////
//
// Public methods
//
/////////////////////////////////////////////////////////////////////////////

/**
  * setCitiesDataSet
  * Alimente le tableau datasetCities à partir du pays séléectionné
  * en effectuant une requête XML sur une vue DOMINO
  * via la méthode javascript dbLookUp
  *
  * @method setCitiesDataSet
  * @param stateUNID {String} UNID du pays sélectionné
  */
function setCitiesDataSet(stateUNID) {
	 datasetCities = [];
	 if ( stateUNID.length == 0 ) {
	 } else {
		 var citiesColumns = new Array(1);
		 citiesColumns[0] = 0;
		 citiesColumns[1] = 1;
		 datasetCities = dbLookup("","","LookUp$FKs", stateUNID, citiesColumns );
	 }
}

/**
  * Fonction retournant la liste des villes commençant par la chaine
transmise en paramètre
  * en utilisant la variable datasetCities précédement initialisée
  *
  * @method getCities
  * @param sQuery {String} Query string.
  * @returns {String[]} Array of result objects.
  */
function getCities(sQuery) {
     aResults = [];
     if(sQuery && sQuery.length > 0) {

         if(datasetCities) {
             for(var i = datasetCities.length-1; i >= 0; i--) {
                 var sKey = datasetCities[i][0];
                 var sKeyIndex =
encodeURI(sKey.toLowerCase()).indexOf(sQuery.toLowerCase());

                 // Query found at the beginning of the key string for
STARTSWITH
                 // returns an array of arrays where STATE is index=0,
ABBR is index=1
                 if(sKeyIndex === 0) {
                     aResults.unshift([sKey, datasetCities[i][1]]);
                 }
             }
             return aResults;
         }
     }
     // Empty queries return all states
     else {
             for(var i = datasetCities.length-1; i >= 0; i--) {
                 aResults.push([datasetCities[i][0], datasetCities[i][1]]);
             }
         return aResults;
     }
}

YAHOO.locations.autocompleteCities = function(){
     var oACDSCities;
     var oAutoCompCities;

     return {
         init: function() {

             // Instantiate JS Function DataSource
             oACDSCities = new YAHOO.widget.DS_JSFunction(getCities);
             oACDSCities.maxCacheEntries = 0;

             // Instantiate AutoComplete
             oAutoCompCities = new
YAHOO.widget.AutoComplete('citiesinput','citiescontainer', oACDSCities);
             oAutoCompCities.alwaysShowContainer = true;
             oAutoCompCities.queryDelay = 0;
		 oAutoCompCities.forceSelection = true;
             oAutoCompCities.minQueryLength = 0;
             oAutoCompCities.maxResultsDisplayed = 50;
             oAutoCompCities.formatResult = function(oResultItem, sQuery) {
                 var sMarkup = oResultItem[0] ;
                 return (sMarkup);
             };

             // Subscribe to Custom Events

oAutoCompCities.itemSelectEvent.subscribe(YAHOO.locations.autocompleteCities.myi\
temSelectEvent);

oAutoCompCities.dataReturnEvent.subscribe(YAHOO.locations.autocompleteCities.myO\
nDataReturn);

oAutoCompCities.containerCollapseEvent.subscribe(YAHOO.locations.autocompleteCit\
ies.myOnContainerCollapse);

             // Set initial content in the container
             oAutoCompCities.sendQuery("");

         },

		 resetState: function(StateID) {
			 setCitiesDataSet(StateID);

			 oAutoCompCities.dataSource.flushCache;
			 oAutoCompCities.typeAheadEvent.fire(oAutoCompCities, "","");
			 oAutoCompCities.sendQuery("");

		 },

        	 // Define Custom Event handlers
		 myitemSelectEvent: function(oSelf, elItem, oData) {
			 self.locations.citiesID.value = elItem[2][1];
		 },

         // Define Custom Event handlers
	 myTextboxKeyEvent: function(oSelf, nKeyCode) {
	 },

         myOnDataReturn: function(sType, aArgs) {
             var oAutoCompCities = aArgs[0];
             var sQuery = aArgs[1];
             var aResults = aArgs[2];

             if(aResults.length == 0) {
                 oAutoCompCities.setBody("<div
id=\"citiescontainerdefault\"></div>");
             }
         },

         validateForm: function() {
             // Validate form inputs here
             return false;
         }
     };
}();

setCitiesDataSet("");

YAHOO.util.Event.addListener(this,'load',YAHOO.locations.autocompleteCities.init\
);

Hello -

I would like to add a trash icon to the right of my tree list. I figure this
would be the easiest
way to give the user the ability to delete an item. I would like it so that the
icon is far enough
to the right and fixed (flushed right) to look very nice.

Any help would be greatly appreciated.

Otherwise if anyone has working code to implement a drag and drop into a trash
can that
would do too.

thanks

Hi, I are new here.

Working with some features of YUI I found a problem.

I want to process a XML generated by php, some one like this.

<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>
<applications>
<all>
<name>All programs</name>
<link>all_programs</link>
<name>Recent programs</name>
<link>recent_programs</link>
<name>Recent Documents</name>
<link>recent_documents</link>
<name>Opened</name>

<link>opened</link>
</all>
</applications>


when I do it:


function successHandler(o){
	 var root = o.responseXML.documentElement;
	 var appName = root.getElementsByTagName('name');

 	 alert(appName);
}


The messages on Opera and Mozilla show [object HTMLColletcion], thats
right, but on IE 6.0 the message show NULL.

Any idea to make it work??

Really thanks.

I previously used the old Calendar UI.  I recently upgraded. In
particular I tested all the examples of the old UI with me updating to
the new libraries.  I don't know enough about JS but I got all of them
working.  They all work in IE and FireFox except the old example "DUAL
FANCY". (This example doesn't exist for the latest UI!) It can't find
the var "this.dates".  IE seems to find it I guess.

Here is link. I believe I implemented new version correctly.
http://www.jhinline.com/apitest/xmltest/yahoo/examples/calendar/default
_2up/index.php?pcode=demo100

Thankx in advance!
John Del Ferro

Not sure how to post a proper link, make sure the link is

http://www.jhinline.com/apitest/xmltest/yahoo/examples/calendar/

PLUS THE FOLLOWING

default_2up/index.php?pcode=demo100

Hi All,

Are there any tutorials/links available which guide on using the Yahoo
Tool Kit? Any start up documents would do...

Regards and Thanks in advance.

Sometime Today, p cobbled together some glyphs to say:

> Hi All,
>
> Are there any tutorials/links available which guide on using the Yahoo
> Tool Kit? Any start up documents would do...

have you had a look at http://developer.yahoo.com/yui/ ?

--
What would be the point of cyphering messages that very clever enemies
couldn't break? You'd end up not knowing what they thought you thought
they were thinking...
(The Fifth Elephant)

Hi,

I'm just getting started using the YUI menu component and have gotten
most of it setup how I want. I'm using top navigation in the same way
as this example:
http://developer.yahoo.com/yui/examples/menu/topnavfrommarkup.html

How do I increase the font-size of the menu items? I've tried adding a
new stylesheet and increasing the font-size that way, but it doesn't
increase the width of the menus that drop down, and any long text
flows off the edge.

If I use the browser to increase the overall font size it does resize
the menus appropriately though.

Any suggestions on how to set the font size properly?

Cheers,
Nick

Hi "dunxwbl",

was wha Jason wrote the reason why it didn't work?
I've got the same problem and doing it the other way round doesn't help...
Thanks for any help!!

Julius

--- In ydn-javascript@yahoogroups.com, "Jason Erickson" <jason@...> wrote:
>
> You need to subscribe to the function after it has been created.
> JavaScript is not compiled, so it is just executed in order.  At the
> time you subscribe, there is no setLocId function, so you just pass
> undefined.
>
> --- In ydn-javascript@yahoogroups.com, "dunxwbl" <duncan@> wrote:
> >
> > I need autocomplete to fill a hidden field for me, just like here:
> > http://tech.groups.yahoo.com/group/ydn-javascript/auth?
> > check=G&done=http%3A%2F%2Ftech%2Egroups%2Eyahoo%2Ecom%2Fgroup%2Fydn-
> > javascript%2Fmessage%2F6434
> >
> > I have 2.2.0a and I'm using itemSelectEvent in an example based on
> > the delivered ysearch_flat.html example:
> >
> > ---
> > var myInput = document.getElementById('ysearchinput0');
> > var myContainer = document.getElementById('ysearchcontainer0');
> > oAutoComp0 = new YAHOO.widget.AutoComplete
> > (myInput,myContainer,oACDS);
> > oAutoComp0.queryDelay = 0.5;
> > oAutoComp0.maxResultsDisplayed = 20;
> > oAutoComp0.minQueryLength = 3;
> > oAutoComp0.formatResult = function(oResultItem, sQuery) {
> >  var sPlace = oResultItem[0];
> >  var nInfo = oResultItem[1];
> >  var hidden_var = oResultItem[2]
> >  var aMarkup = ["<div id='ysearchresult'><div
> class='ysearchquery'>",
> >     nInfo,
> >     hidden_var,
> >     "</div>",
> >     sPlace,
> >     "</div>"];
> >     return (aMarkup.join(""));
> > };
> > oAutoComp0.itemSelectEvent.subscribe(setLocId);
> >  var setLocId = function(oSelf,listItem,dataArray) {
> >  var id = listItem[2]
> >  document.getElementById("loc_id").value = id
> > }
> > ---
> >
> > The pick list diplayed includes "hidden_var" fine, so I know it's
> > being returned, but the logger always tells me:
> >
> > global:
> >
> > 'fn' is null or not an object
> > (http://www.mydomain.com/test/ysearch_flat.html, line 1544)
> >
> > Presumably just a lack of Javascript understanding on my part, but
> > does anybody got any ideas as my brain has started to melt?
> >
> > Cheers
> > Dunx
> >
>

Hi Jenny,

when I do exactly what you've described below I get this:

"s.fn has no properties"

Any idea why? My code is:
(it doesn't get as far as the alerts..

bwAutocomplete.itemSelectEvent.subscribe(myHandler);

         // define your handler
         var myHandler = function(bwAutocomplete, listItem, dataArray) {
         var title= dataArray[0];
         var summary= dataArray[1];
         alert(title);
         alert(summary);
         };

Any help appreciated!
Julius

--- In ydn-javascript@yahoogroups.com, "jennykhan" <jennyhan@...> wrote:
>
> Hi Jim,
>
> You'll want to try something like this:
>
> // subscribe to the event and assign a handler
> oAutoComp.itemSelectEvent.subscribe(myHandler);
>
> // define your handler
> var myHandler = function(oAutoComp, listItem, dataArray) {
>     var title= dataArray[0];
>     var summary= dataArray[1];
>     document.getElementById("titlefield").value = title;
>     document.getElementById("summaryfield").value = summary;
> };
>
> Hope that helps,
> jenny
>
>
> --- In ydn-javascript@yahoogroups.com, "THECREW" <jim@> wrote:
> >
> > Doing something wrong here, I would like to have results returned into
> > their own form fields, instead of in the search results.
> >
> > Example select first record and have title in one field, summary in
> > another. Can someone give me a hand here.
> >
> > <script type="text/javascript">
> > YAHOO.example.ACJson = function(){
> >     var mylogger;
> >     var oACDS;
> >     var oAutoComp;
> >  var myServer = "results.php";
> >  var mySchema = ["ResultSet.Result", "Title", "Summary", "Url"];
> >
> >     return {
> >         init: function() {
> >             // Logger
> >             mylogger = new YAHOO.widget.LogReader("logger");
> >
> > 		 oACDS = new YAHOO.widget.DS_XHR(myServer, mySchema);
> > 		 oACDS.queryMatchContains = true;
> > 		 oACDS.autoHighlight = false;
> > 		 oACDS.useShadow = true;
> > 		 oACDS.allowBrowserAutocomplete = false;
> >             oACDS.scriptQueryAppend = "output=json"; // Needed for YWS
> >             // Instantiate AutoComplete
> >             oAutoComp = new
> > YAHOO.widget.AutoComplete("ysearchinput","ysearchcontainer", oACDS);
> >
> > 		 oAutoComp.formatResult = function(aResultItem, sQuery) {
> > 				   // some other piece of data defined by schema
> > 				   var attribute1 = aResultItem[1];
> > 				   // and another piece of data defined by schema
> > 				   var attribute2 = aResultItem[2];
> >
> > 				   var aMarkup = [
> > 					  aResultItem[0],
> > 					  ": ",
> > 					  aResultItem[1],
> > 					  ": ",
> > 					  aResultItem[2]
> > 					  ];
> > 				  return (aMarkup.join(""));
> > 			 };
> >
> >
> >         },
> >
> >         validateForm: function() {
> >             // Validate form inputs here
> >             return false;
> >         }
> >     };
> > }();
> >
> > YAHOO.util.Event.addListener(this,"load",YAHOO.example.ACJson.init);
> > </script>
> >
>

Hi again,

I've solved the problem so just thought in case somebody else finds
this here I can point you to the solution that worked for me. Funnily
from antother post by Jenny - so 'Thanks Jenny'!

http://tech.groups.yahoo.com/group/ydn-javascript/message/10942

I don't quite understand why it works like that though. Why can you
pass the onItemSelect handler only tho arguments in this case and why
does it not contain the array with the result items as a third
parameter as described in the YUI API???

Julius


--- In ydn-javascript@yahoogroups.com, "juliusdietz" <juliusdietz@...>
wrote:
>
> Hi Jenny,
>
> when I do exactly what you've described below I get this:
>
> "s.fn has no properties"
>
> Any idea why? My code is:
> (it doesn't get as far as the alerts..
>
> bwAutocomplete.itemSelectEvent.subscribe(myHandler);
>
>         // define your handler
>         var myHandler = function(bwAutocomplete, listItem, dataArray) {
>         var title= dataArray[0];
>         var summary= dataArray[1];
>         alert(title);
>         alert(summary);
>         };
>
> Any help appreciated!
> Julius
>
> --- In ydn-javascript@yahoogroups.com, "jennykhan" <jennyhan@> wrote:
> >
> > Hi Jim,
> >
> > You'll want to try something like this:
> >
> > // subscribe to the event and assign a handler
> > oAutoComp.itemSelectEvent.subscribe(myHandler);
> >
> > // define your handler
> > var myHandler = function(oAutoComp, listItem, dataArray) {
> >     var title= dataArray[0];
> >     var summary= dataArray[1];
> >     document.getElementById("titlefield").value = title;
> >     document.getElementById("summaryfield").value = summary;
> > };
> >
> > Hope that helps,
> > jenny
> >
> >
> > --- In ydn-javascript@yahoogroups.com, "THECREW" <jim@> wrote:
> > >
> > > Doing something wrong here, I would like to have results
returned into
> > > their own form fields, instead of in the search results.
> > >
> > > Example select first record and have title in one field, summary in
> > > another. Can someone give me a hand here.
> > >
> > > <script type="text/javascript">
> > > YAHOO.example.ACJson = function(){
> > >     var mylogger;
> > >     var oACDS;
> > >     var oAutoComp;
> > >  var myServer = "results.php";
> > >  var mySchema = ["ResultSet.Result", "Title", "Summary", "Url"];
> > >
> > >     return {
> > >         init: function() {
> > >             // Logger
> > >             mylogger = new YAHOO.widget.LogReader("logger");
> > >
> > > 		 oACDS = new YAHOO.widget.DS_XHR(myServer, mySchema);
> > > 		 oACDS.queryMatchContains = true;
> > > 		 oACDS.autoHighlight = false;
> > > 		 oACDS.useShadow = true;
> > > 		 oACDS.allowBrowserAutocomplete = false;
> > >             oACDS.scriptQueryAppend = "output=json"; // Needed
for YWS
> > >             // Instantiate AutoComplete
> > >             oAutoComp = new
> > > YAHOO.widget.AutoComplete("ysearchinput","ysearchcontainer", oACDS);
> > >
> > > 		 oAutoComp.formatResult = function(aResultItem, sQuery) {
> > > 				   // some other piece of data defined by schema
> > > 				   var attribute1 = aResultItem[1];
> > > 				   // and another piece of data defined by schema
> > > 				   var attribute2 = aResultItem[2];
> > >
> > > 				   var aMarkup = [
> > > 					  aResultItem[0],
> > > 					  ": ",
> > > 					  aResultItem[1],
> > > 					  ": ",
> > > 					  aResultItem[2]
> > > 					  ];
> > > 				  return (aMarkup.join(""));
> > > 			 };
> > >
> > >
> > >         },
> > >
> > >         validateForm: function() {
> > >             // Validate form inputs here
> > >             return false;
> > >         }
> > >     };
> > > }();
> > >
> > > YAHOO.util.Event.addListener(this,"load",YAHOO.example.ACJson.init);
> > > </script>
> > >
> >
>

Ted Husted wrote:
>
>
> Are the slides available for the latest YUI Theatre feature?
>

Apologies for taking too long to upload the slides, they are available
from my web site:

Slides -
http://gopalarathnam.com/talks/Writing_Efficient_JavaScript_F2ESummit2007.pdf
Handouts -
http://gopalarathnam.com/talks/Writing_Efficient_JavaScript_F2ESummit2007_Handou\
t.pdf

--
Gopalarathnam Venkatesan

http://gopalarathnam.com/

--- In ydn-javascript@yahoogroups.com, "tomashelikar" <helikart@...>
wrote:
>
> --- In ydn-javascript@yahoogroups.com, "bdetarade"
> <benoit.de.tarade@> wrote:
> >
> > --- In ydn-javascript@yahoogroups.com, "tomashelikar" <helikart@>
> > wrote:
> > >
> > > --- In ydn-javascript@yahoogroups.com, "tomashelikar" <helikart@>
> > > wrote:
> > > >
> > > > Hi,
> > > Anybody any ideas? Please?
> > >
> > > > This is my first post on this forum. I just started using the
> YUI, and
> > > > must say that it is absolutely amazing what you guys have
> > accomplished!
> > > >
> > > > Since I am new to using the YUI, this might be a trivial issue
> that I
> > > > didn't see due to the short amount of time I've using your
library.
> > > >
> > > > I've spent last several days to get the autocomplete working
right,
> > > > however, with no luck. I am using the XML version of the data
source
> > > > object. The problem is that autocomplete returns only the first
> > > > element in the xml file. You can see its behaviour at:
> > > > www.imouse.gsbrno.cz/autocomplete.php
> > > >
> > > > Any help/suggestion are greatly appreciated.
> > > >
> > > > Thanks a lot,
> > > > Tom
> > > >
> > >
> >
> >
> > Can you send use a non condensed version of your js code.
> >
>
> It should be non condensed when you view source page - at least it is
> on my browser. But here's the code anyways. Thanks again.
>
> <html>
>   <head>
> <title>Example: AutoComplete - Basic XML Data (YUI Library)</title>
> <style type="text/css">
>     #ysearchmod {position:relative;padding:1em;}
>     #ysearchautocomplete {position:relative;margin:1em;width:40%;}/*
> set width of widget here*/
>     #ysearchinput {position:absolute;width:100%;height:1.4em;}
>     #ysearchcontainer {position:absolute;top:1.7em;width:100%;}
>     #ysearchcontainer .yui-ac-content
> {position:absolute;width:100%;border:1px solid
> #404040;background:#fff;overflow:hidden;z-index:9050;}
>     #ysearchcontainer .yui-ac-shadow
>
{position:absolute;margin:.3em;width:100%;background:#a0a0a0;z-index:9049;}
>     #ysearchcontainer ul {padding:5px 0;width:100%;}
>     #ysearchcontainer li {padding:0
> 5px;cursor:default;white-space:nowrap;}
>     #ysearchcontainer li.yui-ac-highlight {background:#ff0;}
> </style>
>   </head>
>   <body>
>    <div id="bd">
>     <!-- AutoComplete begins -->
>     <div id="ysearchmod">
>
>         <form onsubmit="return false">
>             <h2 onclick="alert(oAutoComp.toString());">Yahoo!
Search</h2>
>             <div id="ysearchautocomplete">
>                 <input id="ysearchinput">
>                 <div id="ysearchcontainer"></div>
>             </div>
>         </form>
>     </div>
>
> </div>
>     <!-- AutoComplete ends -->
>                     <!-- form onsubmit="return false">
>                         <p>Search autocomplete:
>                         <div id="propertysearch">
>                             <input autocomplete="off"
id="searchinput" />
>                             <div id="searchresults">
>                                  
>                             </div>
>                         </div>
>                     </form -->
>   </body>
> </html>
> <!-- Dependencies -->
>  <script type="text/javascript"
>
src="http://yui.yahooapis.com/2.2.0/build/yahoo-dom-event/yahoo-dom-event.js"></\
script>
>
>
>  <!-- OPTIONAL: Connection (required only if using XHR DataSource) -->
>  <script type="text/javascript"
>
src="http://yui.yahooapis.com/2.2.0/build/connection/connection-min.js"></script\
>
>
>
>  <!-- OPTIONAL: Animation (required only if enabling animation) -->
>  <script type="text/javascript"
>
src="http://yui.yahooapis.com/2.2.0/build/animation/animation-min.js"></script>
>
>
>  <!-- OPTIONAL: External JSON parser from http://www.json.org/
> (enables JSON validation) -->
>  <script type="text/javascript"
> src="http://www.json.org/json.js"></script>
>
>  <!-- Source file -->
>  <script type="text/javascript"
>
src="http://yui.yahooapis.com/2.2.0/build/autocomplete/autocomplete-min.js"></sc\
ript>
>
> <script type="text/javascript">
>             // Instantiate an XHR DataSource and define schema as an
> array:
>             //
> ["Multi-depth.object.notation.to.find.a.single.result.item",
>             //     "Query Key",
>             //     "Additional Param Name 1",
>             //     ...
>             //     "Additional Param Name n"]
>             oACDS = new YAHOO.widget.DS_XHR("./example.xml",
> ["person", "name"]);
>             //alert(oACDS.toString());
>             oACDS.responseType = YAHOO.widget.DS_XHR.TYPE_XML;
>             oACDS.queryMatchContains = true;
>             /*oACDS.scriptQueryAppend = "results=100"; // Needed for
YWS*/
>
>             // Instantiate AutoComplete
>             oAutoComp = new
> YAHOO.widget.AutoComplete("ysearchinput","ysearchcontainer", oACDS);
> </script>
>

Any ideas on this please?

Did you try overriding the CSS rules for div.yuimenu li.yuimenuitem?

E.g.
div.yuimenu li.yuimenuitem {
font-size: 152%;
}

The only problem with this rule is that the font resizing will be
applied multiple times to submenu items.

Hope that helps,
~Alexander

--- In ydn-javascript@yahoogroups.com, "noods_testing" <nick@...> wrote:
>
> Hi,
>
> I'm just getting started using the YUI menu component and have gotten
> most of it setup how I want. I'm using top navigation in the same way
> as this example:
> http://developer.yahoo.com/yui/examples/menu/topnavfrommarkup.html
>
> How do I increase the font-size of the menu items? I've tried adding a
> new stylesheet and increasing the font-size that way, but it doesn't
> increase the width of the menus that drop down, and any long text
> flows off the edge.
>
> If I use the browser to increase the overall font size it does resize
> the menus appropriately though.
>
> Any suggestions on how to set the font size properly?
>
> Cheers,
> Nick
>

Hello,
I would like to automatically expand a node and have the treeView
shows/scrolls to that node after the page is loaded.
I found the TreeView.amniExpand but there is no api to scroll to the node.
Is there a way to do that?

Regards and thank you for helping.

Doug

I've got Yahoo! UI JavaScript working.  I can drag and drop, use the
onDragOver and onDragOut events, set custom handles, etc.  Now I'd
like to animate divs so that, when a div is dropped, it automatically
goes back to its original location *IF* it is not dropped on a valid
target.  If it *IS* dropped on a valid target, I would like to swap
the div that is being dragged with the target div so that the dragged
div moves to the targets original coordinates and the target moves to
the dragged div's original coordinates before it was dragged.  Can
anyone explain how to do this in a nutshell or point me to a specific
resource?  I've check Yahoo! UI's home page, but I could find an
example that calls out this specific functionality.  Please advise,
and thank you in advance for any assistance.  - John

The YUI reference documentation is actually quite good. As you step
through each section, go ahead and cobble up the examples. You should
be up and running in no time!

The only problem is that the YUI documentation is in an arbitrary,
alphabetic order. It doesn't clue people in as to where to start and
where to finish.

For more on a "YUI Documentation Trail", see this blog entry:

* http://jroller.com/page/TedHusted?entry=yuidocs

HTH, Ted.


--- In ydn-javascript@yahoogroups.com, "poornima" <puri_1984@...> wrote:
>
> Hi All,
>
> Are there any tutorials/links available which guide on using the Yahoo
> Tool Kit? Any start up documents would do...
>
> Regards and Thanks in advance.
>

Hi there,

I've been working on using event delegates with the drag and drop library and
have been
noticing some weird issues.  As a result, the performance of the drag and drop
is just
atrocious.

I've got a table with apx. 20 rows.  Each row contains multiple <td> cells.  The
first cell is
a checkbox.

I've got a mouse handler delegate working to create a DDProxy object whenever
the
"mousemove" event is fired on a <tr>.  I've also got a check in place so that
only a single
Proxy object is created even though multiple mouse move events are firing
whenever
moving the mouse on a single row.

What I'm noticing though is when I check/uncheck the checkbox, the startDrag,
setDragElPos and enDrag methods are also being called.  What's throwing me off
is that
I'm not dragging the item at all.  I'm simply checking the checkbox.

I'm not sure what could be causing this issue.  I would have figured that using
the delegate
as opposed to assigning n-number of Proxy objects would have improved
performance.
I'm noticing the complete opposite, but I don't think it's the delegate causing
the problem.
I'm just not sure where else to look.

If anyone has a suggestion or could lend some insight, I'd really appreciate it.


Thanks,
Frank

I have a panel that is modal. On top of that I display an overlay that
contains a form. The select items in the form are not being displayed
(as they are in FF). This issue does not occur when I set the panel to
non-modal. The panel's z-index is 100 and the overlay's z-index is 5000.

Any help would be much appreciated.

Hi Frakie..

Could you please give me the idea of working the dragdrop
functionality for a table having multiple rows

It would be great,if you provide me sample code..

Thanks in advance
Ramya

--- In ydn-javascript@yahoogroups.com, "frankieshakes"
<frankieshakes@...> wrote:
>
> Hi there,
>
> I've been working on using event delegates with the drag and drop
library and have been
> noticing some weird issues.  As a result, the performance of the
drag and drop is just
> atrocious.
>
> I've got a table with apx. 20 rows.  Each row contains multiple
<td> cells.  The first cell is
> a checkbox.
>
> I've got a mouse handler delegate working to create a DDProxy
object whenever the
> "mousemove" event is fired on a <tr>.  I've also got a check in
place so that only a single
> Proxy object is created even though multiple mouse move events are
firing whenever
> moving the mouse on a single row.
>
> What I'm noticing though is when I check/uncheck the checkbox, the
startDrag,
> setDragElPos and enDrag methods are also being called.  What's
throwing me off is that
> I'm not dragging the item at all.  I'm simply checking the
checkbox.
>
> I'm not sure what could be causing this issue.  I would have
figured that using the delegate
> as opposed to assigning n-number of Proxy objects would have
improved performance.
> I'm noticing the complete opposite, but I don't think it's the
delegate causing the problem.
> I'm just not sure where else to look.
>
> If anyone has a suggestion or could lend some insight, I'd really
appreciate it.
>
>
> Thanks,
> Frank
>

I've made numerous changes to the API to support cell movement with
arrow keys and I've fixed a few methods / implemented some unfinished
others to support what is basically a barebones Excel-like table
editor. One thing that I'm stuck on at the moment is being able to
recenter the table when moving the selection to a new cell with the
arrow keys. I'm drawing a complete blank on how to do this.

Also, while I'm at it, the table will not gain focus in Firefox when I
click away from it, then select a new cell with the mouse. It *does*
work in IE, however. I've tried many different calls to focusTable()
but nothing seems to work.


Any ideas, anyone?


- Luke McCollum

Hello,

I'm trying to replace Dojo with YUI and have a problem with the Data
Table.

What I need are buttons and/or links in a row. What I have noticed is,
that all events are catched and clickable items are not responding
(links/buttons). I have found two posts about the same problem and
they told to catch the event.

What I am missing is an example, because I don't get a solution to get
the object or id of the row without a workaround.

My code:

var myDataTable = new YAHOO.widget.DataTable("basic", myColumnSet,
myDataSource);

myDataTable.subscribe("cellClickEvent",sayHello);

function sayHello(eventObject) {
     alert(eventObject.target);
}

Thanks for your help in advance
Simon

Eric,

I'm trying to do the same thing as Ian: I don't need anything as
sophisticated as a progress meter, just an activity indicator to show that
something is happening while the user waits for the new content to load.  I
display the animated gif right after make the call to
YAHOO.util.Connect.asyncRequest, and then have the responseText fade in,
replacing the animated gif in the same div. What happens is that there is a
significant delay between the time the gif stops displaying and when the
responseText appears, so the div is still empty for a noticeable period of
time. Any idea of how I might fix this?

Thanks for any help you can give.

Rebecca Younes


Eric Miraglia wrote:
>
> Ian,
>
> readyState seems like an obvious choice for a rough progress meter,
> but unfortunately it turns out not to work very well for that
> purpose.  There's a great deal of material out there on this topic,
> but here's an authoritative article from PPK:
>
> http://www.quirksmode.org/blog/archives/2005/09/xmlhttp_notes_r_2.html
>
> PPK's summary: "In conclusion, no browser correctly supports
> readyState in all cases."  And that's why we don't ship YUI with a
> readyState-based progress meter example.  (Moreover, a readyState-
> based progress bar would not be very granular; readyState 3 would
> last a long time on a big file, and you get no feedback on the
> relative progress of the download just from the readyState).
>
> As a result, true progress implementations tend to involve more than
> just client-side approaches.
>
> Perhaps others can jump in here if they know of any great php-based
> YUI XHR progress implementations?
>
> Regards,
> Eric
>
>
>
> ______________________________________________
> Eric Miraglia
> Yahoo! User Interface Library
>
>
>
> On Mar 30, 2007, at 5:14 AM, electric_owl_001 wrote:
>
>> Hi,
>>
>> I'm using Connection Manager an would like to be able to provide a
>> visual status indication of progress based on the readyState or
>> isCallinProgress values.
>>
>> What is the best way of doing this? As a relative newcomer to
>> Javascript programming I need some examples to jump start.
>>
>> I've seen lots of examples using switch..case or if.. then to monitor
>> the readyState value but cannot work out how to achieve a similar
>> functionality with Connection Manager. Examples seem to be a bit
>> scarce at the moment.
>>
>> Many thanks,
>>
>> Ian Lewis
>> --
>>
>>
>>
>
>
>

--
View this message in context:
http://www.nabble.com/Getting-the-ready-state-from-Connection-manager-tf3491822.\
html#a9796261
Sent from the ydn-javascript mailing list archive at Nabble.com.

My layout is built on the transition tabveiw example and I am using
Rico.js to round out some of the divs for the site. My first attempt
for three content divs in the tabview was a Rico accordian but it wont
display properly inside the tabveiw content area even when it tested
well on a plain page.

Can anyone give me a Yahoo alternative to the the rico.js accordian
that will work inside a tabview to selectivly show three different
contents?

Is there a way to make Yahoo and Rico play nice together or can anyone
recomend an alternative that does play well with the Yahoo tabveiw?

The API documentation makes brief mention of a 'resizable' property for a
DataTable column:
http://developer.yahoo.com/yui/docs/Column.html#resizeable

The DataTable page also briefly mentions this:
http://developer.yahoo.com/yui/datatable/

Yet it only seems to be mentioned in passing... there are no examples.  Below is
my own example, but I can't seem to figure out how to resize the table.  The
cursor changes, but clicking and dragging does not seem to do anything. 
Instead, I get a bunch of errors that "newWidth is not defined" at this point in
datatable-beta.js (line 4459):


YAHOO.util.WidthResizer.prototype.onDrag = function(e) {

if(newWidth < this.minWidth) {
newWidth = this.minWidth;
}


  Any help would be appreciated.

Thanks,
Peter Foti

Below is the code (not sure how well this will come through):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
	 "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	 <meta http-equiv="Content-type" content="text/html; charset=utf-8">
	 <link rel="stylesheet" href="/yui/build/datatable/assets/datatable.css"
type="text/css" media="screen" >
	 <title>Data Table</title>
	 <script
src="http://yui.yahooapis.com/2.2.0/build/yahoo-dom-event/yahoo-dom-event.js"
type="text/javascript"></script>
	 <script src="http://yui.yahooapis.com/2.2.0/build/dragdrop/dragdrop-min.js"
type="text/javascript"></script>
	 <script
src="http://yui.yahooapis.com/2.2.0/build/datasource/datasource-beta-min.js"
type="text/javascript"></script>
	 <script src="/yui/build/datatable/datatable-beta.js"
type="text/javascript"></script>

	 <script type="text/javascript">
	 function init() {
		 var myColumnHeaders = [
			 {key:"name", text:"Dog's Name", resizeable:true},
			 {key:"breed", text:"Dog's Breed", resizeable:true},
			 {key:"age", text:"Dog's Age (in Weeks)", type:"number", resizeable:true}
		 ];

		 var myColumnSet = new YAHOO.widget.ColumnSet(myColumnHeaders);
		 var myDataTable = new YAHOO.widget.DataTable("myMarkup",myColumnSet);
	 }

	 YAHOO.util.Event.on(window,'load',init);
	 </script>
</head>
<body id="dataTable">

<div id="myMarkup">
     <table id="myTable">
         <thead>
             <tr>
                 <th>AAA</th>
                 <th>BBB</th>
                 <th>1</th>
             </tr>
         </thead>
         <tbody>
             <tr>
                 <td>aaa</td>
                 <td>bbb</td>
                 <td>3</td>
             </tr>
             <tr>
                 <td>aaa</td>
                 <td>bbb</td>
                 <td>5</td>
             </tr>
             <tr>
                 <td>aaa</td>
                 <td>bbb</td>
                 <td>7</td>
             </tr>
         </tbody>
     </table>
</div>

</body>
</html>

--- In ydn-javascript@yahoogroups.com, "smehrabi" <smehrabi@...> wrote:
>
> Hi folks,
>
> I'm trying to do the following with the YUI Connection Manager.
>
> I am taking an emailAddress from a form and making a request to server
> to check if th eemail address is already being used. If it is in use
> I'm sending an echo response as "Taken" and if it is not taken then
> the response is "Good".
>
> Problem I am having is I can't do a if(o.responseText == "Taken") { do
> this } else { do that };
>
> Can someone tell me what is wrong with my javascript?

<snip>

> var callback =
> {
>   success:handleSuccess,
>   failure:handleFailure,
> };

Remove the trailing comma after "failure:handleFailure" so that the
callback looks like this:

var callback =
{
   success:handleSuccess,
   failure:handleFailure
};

Regards,
Thomas

Hi,

I'm an experienced (9 years) front-end web developer well-versed in
HTML, CSS, and the DOM, trying to add OOJS to the arsenal, and
struggling a bit with it.

I'm hoping with this email to get some feedback on the following code,
where I set out to modify the Dialog widget to display the result of
an XHR (simulated for now with a GET), as well as allowing it to be
re-instantiated, giving the user the ability to make consecutive
submissions from within the same Dialog.

It works as expected in Firefox and Safari, but the "Close" button &
box and "Send another" button don't function in IE.

http://lunaport.com/sandbox/email_us/

I'd appreciate any help getting IE to work, as well as any general
pointers. Thanks in advance.

Brian