Thanks a lot! The gist certainly helped a lot.
I think the key line in your code, and what Alex was referring to, was
this one: this.$content.empty().append( $content );
But I like the idea of formalizing the process into an object. I will
likely take a slightly different approach, in which I will create a class
that inherits PanelLayout but has the additional setContent() method you
had in your gist.
On Sun, Mar 24, 2019 at 3:01 PM Moriel Schottlender <
mschottlender(a)wikimedia.org> wrote:
You absolutely can attach a jQuery element into
your $content parameter.
That will work, and probably give you what you want.
However, one of the more powerful things about OOUI is its ability to
encapsulate this type of work. In this case, what I would recommend, is
creating your own custom widget that manages itself.
I imagine that your $content changes, but it probably has similar
structure
through its changes. For example, it might have an error box at the top
that only appears when necessary, or it can have some regular inputs
alongside inputs that maybe change, and it probably has some area where
you
display a text or an image or anything else.
You could create all of those in jQuery, but OOUI also offers you an
ability to encapuslate this better.
I tried to explain this in an email and got a bit long, so I created a
gist:
https://gist.github.com/mooeypoo/a9082a5a5828dcec53be28ed3c538e22
The main idea I am trying to show is how you can create your own widget
that extends OO.ui.Widget, construct its base structure in the constructor
with either other OOUI widgets or with some custom jQuery elements, add
classes and event listeners, and then manage the state of this widget when
some other code calls its methods.
I tried to also show how you can have your custom widget emit some custom
event so that other pieces of your code (say, the dialog in general?) can
listen to some event (I used "success" but you can define whatever you
want) and respond, like change to another panel, or close the dialog, or
enable some other action.
I hope the gist helps, I tried to make it self explanatory, but please let
me know if you encounter any issues with it (I wrote it relatively
quickly,
I hope there aren't any bugs ;)
Moriel
On Sun, Mar 24, 2019 at 7:19 AM Alex Monk <krenair(a)gmail.com> wrote:
I haven't dealt with OOUI for a couple of
years but maybe you could
pass a
jQuery object to the $content parameter, store it
yourself, then modify
that later?
On Sun, 24 Mar 2019 at 14:14, Huji Lee <huji.huji(a)gmail.com> wrote:
In the script I am working on,[1] I have a
PanelLayout that is defined
like
this:
this.previewResult = new OO.ui.PanelLayout({
expanded: true,
padded: true,
framed: true,
$content: ''
});
Later on, I would like to modify the content of this; specifically, I
want
> to use MW API to retrieve the parsed output of some short wikitext.
For
> now, however, I just want to try out the
concept by replacing the
content
> with a simple <p> tag.
>
> Evidently, this line of code does not do the trick:
>
> dialog.previewResult.$content = '<p>Something</p>';
>
>
> That is, it does update the value of the $content property for the
OOUI
> object, but that does not result in the
object getting re-rendered.
None
of
> the setter functions for OO.ui.PanelLayout seem to do the trick
either.
What is the correct way to do this? If PanelLayout is not the right
object
type for this purpose, what is?
_______________________________________________
Wikitech-l mailing list
Wikitech-l(a)lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/wikitech-l
_______________________________________________
Wikitech-l mailing list
Wikitech-l(a)lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/wikitech-l
--
Moriel Schottlender (she/her)
Senior Software Engineer
Tech Lead | Community Tech and Anti Harassment Tools
Wikimedia Foundation
https://wikimediafoundation.org/
_______________________________________________
Wikitech-l mailing list
Wikitech-l(a)lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/wikitech-l