Search jQuery

jQuery Forum

Screen name:
izzy.coding
About Me:
I am a software developer. My main skill is in javascript where I have created various scripts and jQuery widgets for clients with very complex requirements.
Website:
http://www.izzy-coding.co.uk
Facebook Link:
http://www.facebook.com/matthew.i.greenwood
Linkedin Link:
http://www.linkedin.com/profile/view?id=188026841&trk=tab_pro

izzy.coding's Profile

6 Posts

13 Responses

0 Followers

Activity Trend

Last 30 days

Loading Chart...

Show:

Expanded view
List view

Is it possible to create dynamic instances of a widget?
[0Replies]
- 17-Dec-2012 12:08 PM
- Forum: Using jQuery UI
I have got to a point now in my widget library where I need to create a control widget.
This control widget needs to be able to create any type of widget I require based on a String in the "type" option.
1. ...
2. _create: function() {
3. this.dynamicWidget = $("<div>")[this.options.type](this.options.widgetOptions);
4. }
5. ...
Now this works fine to create the widget and it works perfectly well, until I want to change option values in the dynamically created widget.
All I get is a error saying that "myWidget" has not been initialised.

Any Ideas?

The fastest code is never executed.

widget factory _live function
[1Reply]
- 13-Dec-2012 08:46 AM
- Forum: Using jQuery UI
I am wondering if there is any plans to provide an alternative to the _on function?
What I need is similar to the _on function except that I need certain events to be handled regardless of their disabled state.

What I have is a parent widget that controls translations of my child widgets. What I want to happen is when the parent widget triggers an event to say the language has been changed, for all the child widgets they need to process this request and update their internal translations and any visible text to the new language.

The fastest code is never executed.

Deep option object problem
[0Replies]
- 30-Nov-2012 07:23 AM
- Forum: Using jQuery UI
When I create a widget that has deep set object literal options, and if I try to apply the widget to multiple divs, each div contains its values and the values of all the preceding instance's values as well.

e.g.
1. $widget("test.me", {
2. options: {
3. subOption: {
4. values: []
5. }
6. },
7. _create: function() {
8. var _this = this;
9. $.each(this.options.subOption.values, function (i, value) {
10. alert(value);
11. }
12. }
13. });
when this is put on multiple elements with different values I am getting non-instance specific concat'd version of this option array.

The fastest code is never executed.

extra generic css classes
[2Replies]
- 24-Oct-2012 04:17 PM
- Forum: Using jQuery UI
Hey,

I am trying to create some new widgets for work that need to use the UI theme roller themes.

However I am having trouble as i am currently having to add some custom styles that are not present.

Is there any chance to get the borders as seperate classes? something like the following would be a great help.

ui-border[-active]-[n,e,s,w,top,bottom,left,right]

The fastest code is never executed.

testing for widget instances
[0Replies]
- 12-Oct-2012 09:43 AM
- Forum: Using jQuery UI
Hi,

Is there any way to find out what widgets are on an element?
I have a function that takes a parameter that could be one of 3 widgets that I have written, but I need to do slightly different things depending on what widget has been initialized on the elements.
Another use i have is to be able to list what widgets I have put on an element (e.g. button && tooltip)

I am hoping for something like:
1. var blnIsInstanceOfWidget = $.instanceof(element, $.widget);
The fastest code is never executed.

How to have instance specific private variable objects.
[1Reply]
- 09-Oct-2012 05:50 AM
- Forum: Using jQuery UI
I have been trying to find a way around this obscure problem for the last few weeks and I am hoping someone here can help or tell me what I am doing wrong.

I am using the Widget Factory to create widgets using inheritance. Basically each layer of my inheritance hierarchy has only a single task. my base class is in charge of logging, the next layer is in charge of my translations, etc... until I get to the top layer which is a widget to display my content.

In my translation layer I currently have a private variable that contains all my required translations with a function to pull the correct translation based on what locale the page is using. This works fine for a single instance or widget. But if I add another instance to the page of a different type of widget (so the translations are different) then the first widget does not have the correct translations any more.

I have created a simple page that shows this:
1. <!DOCTYPE html>
2. <html>
3. <head>
4. <title>test</title>
5. <meta charset="utf-8">
6. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
7. 
8. 
9. <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css" type="text/css" media="all" />
10. <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
11. <script type="text/javascript" src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>
12. <script type="text/javascript">
13. 
14. (function($) {
15. $.widget("elat.base", {
16. options: {
17. optionVar: "",
18. optionsObjectVar: { value: "" }
19. },
20. _privateVar: "",
21. publicVar: "",
22. _privateObjectVar: { value: "" },
23. publicObjectVar: { value: "" },
24. _create: function() {
25. this.setValues("test");
26. },
27. doAlerts: function() {
28. this.alertValues("base");
29. },
30. setValues: function(value) {
31. var _that = this;
32. _that.options.optionnVar = value;
33. _that.options.optionsObjectVar.value = value;
34. _that._privateVar = value;
35. _that.publicVar = value;
36. _that._privateObjectVar.value = value;
37. _that.publicObjectVar.value = value;
38. },
39. alertValues: function(sourceName) {
40. var _that = this;
41. alert(sourceName + ".options.optionnVar: " + _that.options.optionnVar);
42. alert(sourceName + ".options.optionsObjectVar.value: " + _that.options.optionsObjectVar.value);
43. alert(sourceName + "._privateVar: " + _that._privateVar);
44. alert(sourceName + ".publicVar: " + _that.publicVar);
45. alert(sourceName + "._privateObjectVar.value: " + _that._privateObjectVar.value);
46. alert(sourceName + ".publicObjectVar.value: " + _that.publicObjectVar.value);
47. }
48. });
50. $.widget("elat.firstchild", $.elat.base, {
51. _create: function() {
52. this.setValues("test2");
53. },
54. doMoreAlerts: function() {
55. this.doAlerts();
56. this.alertValues("firstchild");
57. }
58. });
60. $.widget("elat.secondchild", $.elat.base, {
61. _create: function() {
62. this.setValues("test3");
63. },
64. doMoreAlerts: function() {
65. this.doAlerts();
66. this.alertValues("secondchild");
67. }
68. });
70. $(document).ready(function(){
71. var fDiv = $(".firstDiv").firstchild({
72. test: "blank"
73. });
74. var sDiv = $(".secondDiv").secondchild({
75. test: "blank"
76. });
77. $("#test").click(function() {
78. sDiv.secondchild("doMoreAlerts");
79. fDiv.firstchild("doMoreAlerts");
80. })
81. });
82. })(jQuery);
83. 
84. </script>
85. </head>
86. <body>
87. <div class="firstDiv" style="display: none;"></div>
88. <div class="secondDiv" style="display: none;"></div>
89. <input type="button" id="test" value="Click" />
90. </body>
91. </html>
very simply I am showing here the various variable options I can think of. When you press the button the second instance calls the doAlerts() and alertValues() function and has the correct values. But when the first instance calls them it seems that the private and public "Object" variables contain the value of the second widget. However, as the options are also an object I would have expected that to do the same, but that value seems to be fine (however I do not wish to put my object in here as it should not be available for the callee to edit).

Is there something I am missing here?
or am I going to have to fall back to adding it to the options (maybe prefixed with an underscore)?

«Prev
Next »

Response title

Attachments

jQuery Forum

Activity Trend