UI-select placeholder disappears after select - ui-select

I'm trying to use ui-select to make a state selection but when I select a
state the placeholder goes blank, does anyone know how to not make
"Filter by province/state" disappear.
Here is the code for ui-select-match section of my ui-select:
<ui-select-match
placeholder="Filter by province/state">
{/ $item /}
</ui-select-match>

You may want to use a separate label because ui-select usually has the saved array inside of the input box which is why the display label disappears once their is one item in the array.

Related

Is it possible to set a drop down widget to be required?

Was wondering if it was possible to have a drop down widget in app maker be required. In other words, users could not click submit unless they had selected a value from a down down menu. Kind of like how validation on text boxes.
When looking at the property editor for a drop down widget I don't see anything that will allow me to set the above requirement out of the box.
Below is the property editor for a drop down, you will notice there is no validation options.
Below that is the text box property editor with the validation option expanded. I basically need the same functionality for my drop down menu.
If anyone dealt with a similar issue I would appreciate any input.
Of course you have that option.
Look under DropDown menu you will find option called allowNull, deselect that option. Also select validationDisplay check box from 'Other' menu and users will have to choose from a drop down menu always.
Below are the screen for your reference,
Dropdown menu allowNull option,
Other menu validationDisplay option,

clicking label doesn't click checkbox in React?

I have created a form where a user can pick options prior to submitting the form. I am hiding the checkboxes with display: none and am styling the <label> so that when the user clicks the label it triggers the checkbox.
I've got this to work in vanilla HTML and CSS, however when I try this in React, clicking the label doesn't do anything. ONLY if I unhide the checkbox am I able to click on the checkbox and am able to see the label styling. I want to hide the checkbox though.
Does anyone know how to hide the checkbox and still able to click the label in ReactJS?
Here is the codepen of what I am trying to build in ReactJS.
Use htmlFor instead of for in react (see react supported attributes):
<input type="checkbox" id="check3"/> Fish
<label htmlFor="check3"><span class="fa fa-check"/></label>
As it was already stated - use htmlFor and then try adding onClick event on label instead of on an input. This will add/remove checked attribute on the input itself. I assume that you already use defaultChecked attribute on your input.

Drupal Webform Preview Page: Adding Bullets on Conditional Elements (theming)

There seems to be some kind of bug in webform or I'm doing it wrong. On the preview page of a webform, conditional based selections like checkboxes still display regardless of whether they are selected by the user or not. The code show in the source and a blank space will show if nothing is selected.
I just created a test page with three select components (multiple select checkboxes with only one choice ) and placed component A checkbox (in a fieldset) is on the level above the other two that are within a fieldset as well.
So for example,
Selection 'A' fieldset
>> Selection 'A' checkbox
>>>> Selection 'B' fieldset
>>>>>>>> Selection 'B1' checkbox (separate component)
>>>>>>>> Selection 'B2' checkbox (separate component)
The conditional set is like so.
IF: >> Selection 'A' checkbox is EMPTY
THEN >>>> Selection 'B' fieldset
ISNT SHOWN
The point of all this is that I need to place the selected options checkboxes in a bullet list but the bullets points still show on the preview page with out the words, even if those answers aren't selected. I added the bullets using css. I think the following code from this link might be on the right track but I'm not sure how to get it to work for the preview page.
https://www.drupal.org/node/79086
function phptemplate_webform_form_50 ($form) {
$form['submitted']['First Name']['#id'] = 'edit-submitted-first-name';
$form['submitted']['Last Name']['#id'] = 'edit-submitted-last-name';
$form['submitted']['Fluent in']['#id'] = 'edit-submitted-fluency';
return _phptemplate_callback('webform_form_50', array('form' => $form));
}
Conditions should work. A temp solution would be to hide both the check boxes if Selection 'A' is empty.

Get Text from dropdown

I have one page which has Only one Dropdown name called "MydropDown".My submitted form i can get value of selected dropdown by
HttpContext.Current.Request.Form["MydropDown"];
but i need Text not value how can i get this
Plz help me on this
If its not a control, there is no way to get the text other than put the text into the value field.

Disable highlighting in an HTML SELECT box

I have a select box, <select multiple=true, that the user populates with values via a Picklist mechanism. I would like to disable highlighting in this box because, by definition, the values in this box are the selection.
Just to clarify, I am NOT referring to text selection, which is what ::selection operates on. I'm talking about the usually blue highlighting that the browser applies to selected line item(s) when the user clicks on them.
I'm not worried about the user blindly clicking around, because I am auto-selecting all items onsubmit so that all the values get sent.
Why not just list the items in their own div instead of a select element? You aren't having the users interact with them anyway, right?
Then, you can have a select element w/ all the values you want, but make it hidden via CSS so that the user won't ever see them. It'll just be there in your form so that you can grab those values on your submit.
If I'm reading you correctly, it sounds like you're using an accumulator model where you have a "source" box (or list or select or something) and a "selected" box. Rather than accumulating into a [select], maybe use a div? If you must use a select, you could try disabling it, but that carries other visual baggage. You could also try styling the select color, but that's definitely not going to be cross-browser.
Make it disabled?
<select disabled="disabled">
This would gray it out, unfortunately- the other option might be some javascript to unselect any selections.
if i understand you correctly, the user does not actually selects the items? then why not either disable it or if customer still interacts with it, you might need to go with some JS code to help yourself

Resources