Multiline for New-UDTextbox

Universal Dashboard Feature Requests
1

Hello,

is it possible to add the function for multiline Input to the New-UDTextbox Cmdlet?
I know that a textarea can be used as a UDInputField, but I cannot use the UDSelector in UDInput.
Another solution for me would be multiselect support for UDInputField -Type “select”!

That would be really perfect. Thank you so much!
Jens

2

Hey @stoni1989 I heard the word UDSelector being mentioned :crazy_face: as the proud owner of this component
I also recently released UDField recently to the marketplace, so you could use UDSelector and UDField to accomplish the goal
?

3

Hey @psDevUK

thanks for the fast answer.
Can you help me to archive this?

Here is my current Code:

$query = “SELECT * FROM Zugehoerigkeit”
$zugehoerigkeitTable = Invoke-Sqlcmd -Database $sqlDatabase -ServerInstance $sqlServer -Query $query

    $hash = @()
    foreach ($zu in $zugehoerigkeitTable)
    {
        $hash += @{
            value = $zu.row_ID
            label = $zu.zugehoerigkeit
        }
    }

New-UDInput -Id “newSkill” -Title “Neuer Skill anlegen” -Content {
New-UDInputField -Name “Skill” -Type “textbox” -Placeholder “Skill”
New-UDSelector -Id “selector” -Options {$hash}
} -Endpoint {
param($Skill)
}

The UDSelector is not showing in my Dashbaord

DB
DB1055×296 11.8 KB

How can i use the UDSelector inside the UDInput? Is this possible?

Thanks a lot
Jens

4

@stoni1989 one thing I can pretty much say for sure is anything is possible in UD :crazy_face: that’s why I am such a supporter of this software module the mighty @adam released
ok so just for clarification I have a working version here is my selection list
that works


New-UDCard -BackgroundColor "#8789c0" -Endpoint {
$query = @"
SELECT [ProductCode]
,[ProductName]
FROM COMPANY_DB
"@
$Products = Invoke-Sqlcmd2 -ServerInstance COMPANY_SERVER -Database COMPANY_DB -Query $query -Username USERNAME -Password PASSWORD
$hash = @()
foreach($item in $Products) {

$hash += @{
value = $item.ProductName
label = $item.ProductCode
}
}
New-UDSelector -id  "selector1" -Options {
$hash
} -PlaceHolder "Select Product Codes..."
}

I am importing the invoke-sqlcmd2 from a function I import into my dashboard
now you need some sort of button to obtain the selected results to then pass onto something else
this is how you do that


New-UDButtonParticle -Id "Explode3" -Text "Search" -Color "#2e3d55" -BackgroundColor "#2e3d55" -Icon search -onClick {
function Get-UDSelectorValue {
param($SelectorId)
$value = (((Get-UDElement -Id $SelectorId).Attributes.selectedOption | Select-Object Root -ErrorAction SilentlyContinue) | ConvertTo-Json -Depth 2 | ConvertFrom-Json | Select-Object -ExpandProperty Root -ErrorAction SilentlyContinue) | Select-Object -First 1
if (!$value) {
$val = ((Get-UDElement -Id $SelectorId).Attributes.selectedOption | ConvertTo-Json -Depth 1 | ConvertFrom-Json | Select-Object -ExpandProperty SyncRoot) | Select-Object -ExpandProperty SyncRoot
$length = $val.length
$i = 0
Do {
if (($i % 2) -eq 0) {
$value += "'$($val[$i])'" + ","
}
$i++
}
While ($i -le $length)
$value = $value.TrimEnd(",")
}
return $value
}
$Selected =  (Get-UDSelectorValue -SelectorId 'selector1') -replace ",''"
if (($Selected) -notmatch "\A'" )
{
$Selected = "'$Selected'"
}

Show-UDToast -Message "You selected $Selected" -duration 5000 -Position center
###sync other elements of your dashboard with this data
@("GridData9","InsideGrid9","pivot3") | Sync-UDElement
start-sleep -Seconds 5
}

So in this example PLEASE PLEASE note the ID parameter is crucial, it gets the selected values from the UDSelector then puts them in a $Session variable to then be passed to other objects on the dashboard to be populated with this information
I hope this all makes sense? This code is working without issues for me. :crazy_face:

P.S the button particle is another :sunglasses: component I pushed to the marketplace

So here is a demo from the dashboard, I had to stop recording at the end as sensitive information
but it populates a grid and a pivot table from the product codes selected and the date range selected
which is dynamically updated by sync’ing the rest of the components on the page with the information gathered from the select and date selection.

selector
selector1302×316 905 KB

The select list is holding thousands of items

5

@psDevUK I know :slight_smile: I haven’t been using the dashboard for a long time but I love it!!!

The UDSelector works outside the UDInput but i need a multi select version inside the New-UDInput cmdlet :slight_smile: Thats my Problem.

The New-UDInputField -Type “select” doesn’t support multi select right?
There is a New-UDTextbox cmdlet. Is it possible to create an AreaTextbox outside of UDInput with the same design as the textarea as an input field?

@adam Or can you add that as a feature request? :slight_smile: That you can create an area field with e.g. New-UDTextAreaBox.

Thanks
Jens

6

Jens why don’t you scap using the New-UDinput and nesting everything in there
and just call commands like https://poshud.com/New-UDTextbox to get the input information and use Get-UDElement to retrieve the data from each of the input fields
?
Does this now make better sense to your problem
? By nesting everything in New-UDInput that automatically creates the submit button for you
but as you see in the code I shared above, you can get that information via a button you put on the page.
BTW @stoni1989 big changes for support of inputs coming in V3 so I am sure everything you want to do will be available in v3 but you can use the work-around method I suggested until then?

7

I try to describe my goal. I would like to create a skill management and / or a kind of learning platform. Here you should be able to create a new skill. The following things are queried when creating:

Skill (text box)
Category (multiselect)
Content (multiline text box)

And a few more. I have to get all of this on one page and then write it to a database with a click of the button.

That sounds good with the v3. Is there already an overview of what is changing?

8

Honestly @stoni1989 this can all be accomplished
you just need to use New-UDCard then in that card nest https://poshud.com/New-UDTextbox to give you a text box, then in either the same card, or a new column or new row put the New-UDSelector then repeat the process to add the multi-line text box, sure maybe UD-HELMET could style the textbox
thats my thoughts anyways :crazy_face: I am using UD for about 3 different databases at work read and write to
 I don’t have any v3 links off the top of my head
but they are on this forum
found a link here Universal Dashboard v3 Progress

9

Thanks :slight_smile:

I’ll try tomorrow and get in touch again.

Have a nice day.
Jens

1 Like
10

I know this is a bit of an old thread but did you figure out how to do a multi line text box? It seems like it should be something simple but I can’t seem to figure it out. I’m trying some css styling to set the text box size and get it to drop to a new line when it fills the width but it doesn’t seem to work with new-udtextbox.

11

Let me cook something up
 :roll_eyes: I seen this https://alioguzhan.github.io/react-editext/ and seems to fit the bill so let me see if I can get this to work in UD


12

Nice that would be cool, I’m guessing you can use it for a text area that spans multiple lines?
I put in a UDElement with a textarea tag for now.

New-UDElement -Id “FeedbackTextArea” -Tag ‘textarea’ -Content {}

It doesn’t look great but I might be able to style it a bit with some CSS

feedbacktext
feedbacktext915×567 25 KB

Though something fancier would be nice!

(Additional kudos to you for the UDFeedback module too!)

13

Might have to pop out for some ice-cream to fuel my brain for this
but I am just about to build it now
when I looked at the npmjs example it looked like it relied on hooks, but the other page has an example with multi-line that auto grows
so trying that now, but I got an old laptop so initial build take a lil while
report back once built

14

Awesome!

15

Man you know I work for food
 :grinning:
MultiLine2
Looks like it built ok and works
I’m being nagged to go to the shop
but 13 minutes later on the menu tonight is a multiline component

Looks like if I played about with the parameters more, this could be a really cool component to release


So I been playing about with the parameters, and I am happy that this component is pretty much good to go. I have added quite a few parameters and they all seem to be working as expected. On the flip side, will do a single line of this as well, so the consistency can be there on your forms.
MultiLine3
:grinning:
So it’s nearly mid-night where I am, and I thought what better way to end the night, than building a second component based on the first component, so your site can look consistent in look and feel:-
SingleLine
So answering the original question you could now use these 2 components plus the UDSelector component and use a button to gather the STATE information of each component, as accepting these writes the text entered into the STATE which can then be retrieved by UD as the component is bound to UD.
Will put together a blog to go through this and how to use these new components
then once enough :pizza: has been delivered to feed my tribe I will release to the world :roll_eyes:

2 Likes
16

Nice component Adam :slight_smile:
Do it work with forms ? as in do it get posted with the rest of the stuff?

The “other” adam, already added -multiline to the new-udtextbox in the UD 1.4 release :slight_smile:

17

Hello @McAndersDK damn didn’t know about the multiline parameter
Ok well I haven’t really done much testing with this component yet as I only got it built late last night
but when you accept the text that you want to type, this is then saved to the state of TEXT
so cannot see why you wouldn’t be able to use this in forms, as the data typed into the textbox is saved in the state. I will do a blog on it to cover all the parameters and how to use.
Sorry @adam or @McAndersDK I assume the multiline parameter is for Powershell Universal 1.4 yeah? Not Universal Dashboard
?

1 Like
18

Boom https://psdevuk.github.io/ud-flix/TextArea-Multi-Line-Input/ hows that!

2 Likes
19

Did you use UD to make your blog site?

20

hey @PowerCode-K loving the icon picture :+1: for the blog site I am hosting this on github using Jekyll so it’s all free, which is a word I love
I actually got recommended it by @adam as I wanted to blog about his amazing software and to try help spread the word
Sadly at the moment I am not hosting anything externally on the web using UD. I wanted to for my company, but seems they would rather pay a 3rd party a crazy amount of money to do it instead
? :roll_eyes:

P.S I have posted both the single line and multi line to the powershell gallery so they should appear on the marketplace within the hour
will update blog a bit more about the single line component and parameters.

I now updated the associated blog here https://psdevuk.github.io/ud-flix/TextArea-Multi-Line-Input/ this should include all the information you need to start using either of these components on your dashboard :slight_smile:

2 Likes