How to insert an into label via drag&drop?

Bootstrap Studio Help
1

Hello ,

What I want to implement is :

<label>Username：<input type="text" name="user" /></label>

But I when I using the BSS gui , I can't drag an input(named Text Input in component tab of BSS gui) into the label (named Field Label ) .

Any suggestion about it ? I don't want to convert it into html and modify 'custom code' by html editor .

2

The post title was

How to insert an <input> into label via drag&drop?

looks like some escape processing occured ... ;(

3

If im not wrong , is like this :

<label id='user'>Username：</label><input id='user' type="text" name="user" />

I think is not necessary to put id , its work with name also ... but you will need to check it...

4

The correct way is

<label for="user">Username：</label><input id="user" type="text" name="user" />

You use a "for=[inputID]" in the label element to target the inputs ID not the name.

If you take a look here https://getbootstrap.com/docs/4.1/components/forms/, you'll see that the app was designed to handle form mark-up in the same way as the Bootstrap Dev's have marked-up their forms. I'm sure it's more semantic that way, which is what this app is about. Prototyping Bootstrap sites semantically.

Saj

5

@Saj @nacho Thanks .

It looks like I should follow the dev handbook .

-_-