With Firebug you can do a console.log(ui) inside the selected callback and
find a ui.selected property. It's a DOMElement, so needs to be wrapped in
$() to get .text() method:
$("#selectable").selectable({
selected: function(event, ui){
if ($(ui.selected).text()=="Item1"){
alert("Item1");
}
}
});
- Richard
On Mon, Jul 6, 2009 at 5:16 PM, pinkyn <[email protected]> wrote:
>
>
> Hi
>
> I am using JQuery UI Selectable to select items in a list(using <ol> or
> <ul>). Depending on the item selected I want to populate another list. So I
> was trying to alert the text of the selected item when the item is
> selected,
> but I didn't find any method for this in JQuery UI Selectable documentation
> at http://jqueryui.com/demos/selectable/. When I use JQuery UI Sortable I
> am
> able to display the text of the selected item using 'ui.item.text()', but
> this does not work with JQuery UI Selectable.
>
> Here is a my code:
> <head>
> <script type="text/javascript"
> src="JQuery/js/jquery-1.3.2.min.js"></script>
> <script type="text/javascript" src="JQuery/js/jquery.ui.all.js"></script>
> <script type="text/javascript" src="JQuery/js/ui.sortable.js"></script>
> <script type="text/javascript" src="JQuery/js/ui.core.js"></script>
> <script type="text/javascript"
> src="JQuery/js/jquery-ui-1.7.1.custom.js"></script>
> <script type="text/javascript" src="JQuery/js/ui.draggable.js"></script>
> <script type="text/javascript" src="JQuery/js/ui.droppable.js"></script>
> <script type="text/javascript" src="JQuery/js/ui.selectable.js"></script>
>
> <style type="text/css">
> #feedback { font-size: 1.4em; }
> #selectable .ui-selecting { background: #FECA40; }
> #selectable .ui-selected { background: #F39814; color: white; }
> #selectable { list-style-type: none; margin: 0; padding: 0; width:
> 40%; }
> #selectable li { margin: 3px; padding: 0.4em; font-size: 1.4em;
> height:
> 18px; }
> </style>
>
> <script type="text/javascript">
> $(function() {
>
> $("#selectable").selectable({
> selected: function(event, ui){
> if (ui.item.text()=="Item1"){
> alert("Item1");
> }
> }
> });
> });
> </script>
>
>
>
>
>
>
> </head>
> <body>
>
>
>
> <ol id="selectable">
> <li>Item 1</li>
> <li>Item 2</li>
> <li>Item 3</li>
> <li>Item 4</li>
> <li>Item 5</li>
> <li>Item 6</li>
> <li>Item 7</li>
> </ol>
>
>
> <ol id="selected">
>
> </ol>
>
> </body>
>
> Please can any one help. Thanks in advance.
>
> --
> View this message in context:
> http://www.nabble.com/How-to-display-the-text-of-the-selected-item-in-a-list-when-using-JQuery-UI-Selectable-tp24362942s27240p24362942.html
> Sent from the jQuery UI Discussion mailing list archive at Nabble.com.
>
>
> >
>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
