I've recently started using http://vitalets.github.io/x-editable/ with jQueryUI.
I successfully used it with input text and select menus, and next wish to implement radio buttons. The UX should be the same as with other input types (i.e. user clicks some text, two or more radio buttons popup along with a enter and cancel icon).
Is this possible, and if so, how?
The following script works as necessary...
https://gist.github.com/taivo/da6d47c7b291f71b9502
Related
I'm trying to set up a Material-ui <RadioGroup> for a survey tool without a submit button. I want the selection to be processed when the <Radio> is clicked. Using RadioGroup's onChange() this works fine if there is no Radio selected yet. But if I go backwards through the survey, the previous questions have their Radio pre-selected. In this case, when I click the Radio that is already selected, onChange() does not fire so I can't move forward to the next question.
I've tried using onClick() instead, but this only works if the user clicks the Radio button. If they click the label instead, the event value is undefined.
I have a survey which has radio group for user to select value. However, when I load the saved the json. The radio group does highlight the radio button. For example, I have choose 4 as the answer. When the save documents is loaded, it only show the 4th button with darker color but not
with the selected button highlighted. What is the problem?
This is maybe conflict of css styles of different packages. Please, share live sample with the issue for more information
Currently, I have an Text Field with AutoComplete item added to my page. I have a requirement to add a dropdown arrow button to the right of that item. The user should have the ability to use the features of AutoComplete but also have the ability to click the dropdown arrow to activate the list that appears from the AutoComplete item. For example, if the AutoComplete item is null and the user clicks the dropdown arrow, the list of all possible values should appear. However, if the user actually types something into the AutoComplete field, then the list of values will display specifically to what was keyed into the AutoComplete field.
Thus far I haven't come across any information online to help figure out how to achieve this task. Can anyone provide an solutions?
At the moment i have this functionality partially working... I have added the dropdown arrow as a button. When this button is clicked, it activates a dynamic action that executes JavaScript. The JavaScript I have is:
if ($(".ac_results").css("display") == "none"){
$(".ac_results").css("display","block");
}
else{
$(".ac_results").css("display","none");
}
This only works when the user has entered a value into the AutoComplete field (which initiates something in the background to create a with the class .ac_results). Then, the user removes the value keyed in and then clicks the dropdown arrows. The list appears for a split second then is gone. But if the button is clicked again the list of values appear and disappear as they should with the button clicks.
Any suggestions or solutions would be wonderful.
Thanks.
Use the Select2 Plugin instead. It has all the features you're looking for and will save you a lot of time getting all the CSS correct. Demo of it: https://apex.oracle.com/pls/apex/f?p=64237:20:0:
I wonder if there is a way to create some checkboxes into a dialog (such as confirm or alert) with no intervention of HTML code, I mean, create a dialog with YES and NO buttons and checkboxes only with Javascript, which appears clicking a link.
Thanks.
Example:
http://i.stack.imgur.com/7VnOW.png
EDIT
The result would show:
a dialog with buttons (OK, CANCEL), and various checkboxes
user cannot select more than 5 checkboxes, but at least one
once user select options and click OK, will send text strings corresponding to checkboxes selected. Example: "check1|check4|check7".
You can achieve this by using an external library such as Jquery UI or even Twitter Bootstrap. You can create a modal dialog and embed every input type you want in it. Take a look to the JQuery UI docs, it might help. http://jqueryui.com/dialog/
Okay so I am working on an html page with jquery mobile and I am disabling my radio buttons when the form they are on gets submitted but this causes the labels to get grayed out. I don't want the labels to be greyed out because I want to user to be able to see their previously entered choices. How can I disable the radio button but not disable/grey out the label when I disable the radio button?? Thanks for help in advance!
EDIT:
So to provide an example of what is happening go to this web page with radio buttons:
http://jquerymobile.com/demos/1.0a4.1/docs/forms/forms-radiobuttons.html
Then open up the console in the inspector and type these two lines:
$('input:radio').attr('disabled', true);
$('input:radio').checkboxradio("refresh");
The radio buttons will all be greyed out. I am trying to leave everything greyed out except for the labels.
You're using "disabled" semantics incorrectly. If they're disabled, they have no previous value, they have no value at all, and they will be absent from the form when submitted to the server.
If you want them to retain their value, don't disable them, make them read-only.