I am building out a product page and I want to have a small "shopping cart" on the page. I've set it up where when you click on the 8oz radio button and the Green Tea, Chamomile, or Oolong buttons and the "Add to Cart" button, a text box appears on the shopping cart on the bottom of the page.
However the problem I am having is that every time a new set is clicked (8oz and Chamomile after clicking 8oz and Green Tea), the original text box disappears. They are all separate text boxes but they keep hiding when a new selection is "added to cart". I would like them to just stack on top of one another.
Here is my Fiddle to see the code. Thanks in advance!
Related
So right now I have a text field with a button (add+) below it.
I would like to make it so every time text is entered into the Text Field, and the Add button is pressed, a new text view is added to a vertical layout below it with the text that the user typed in the field.
I do not want to simply make a text view invisible, then visible when clicked, because I would like them to be able to add more than one text view with whatever text they type.
I am using angularjs for my web app.
I have 2 textareas, a add button and a delete button.
In the first text area i have few options for the user to select. If the user selects on one of the options and clicks on the add the button, this selected item should be moved from first textarea to the second text area. And if the user selects an item from the second textarea and clicks on the delete button, then the item should be moved back to the first textarea.
How to uniquely identify and bind the items selected in the textareas?
Any help on this?
I have a fiddle here: http://jsfiddle.net/ybZvv/11/
The problem I have is that when you open the fiddle, if you click on a couple of buttons from buttons "A-H" and then click on "Add Question" button to append the buttons into a new table row, no text inputs appear underneath the table.
But within the table row if you turn on a different button, then it displays the text input for that button.
What my question is that how can I have the text inputs to appear from the turned on buttons in the top control once the user clicks on the "Add Question" button?
Below is what should happen:
Right at the top control, turn on buttons A and D.
Click on the "Add Question" button and this should append a row, but it should also display the text inputs for buttons "A" and "D".
I refactored some of the code from btnclick to a new method updateAnswer which collects all the buttons that are turned on and adds an input to the answer container. The method is then called from btnclick and insertQuestion.
I updated the jsFiddle example.
I have a fiddle here: http://jsfiddle.net/ybZvv/43/
The problem I have is with the text inputs not changing. Please follow steps in fiddle below so you can see what is happening:
When you open fiddle, click on the "Add Question" button, this will add a table row copying the controls from the top into the table row.
In the table row click on the "Open Grid" and select button 5. You will see 5 letter buttons appear underneath from A-E.
Turn on all of the letter buttons by clicking on them (They should turn green to symbolize that the button is turned on)
You will see right at the bottom of the fiddle that it shows all of the text inputs of each value of the buttons which are turned on. This is fine.
The problem is here. If you go back into the table row and click on the "Open Grid" link again but this time choose "3", you will see the letters buttons change to A-C. Now letters D and E are not shown so they are turned off. But problem is that if you go to the bottom of the fiddle, the text input form D and E are still shown, they should be removed.
So my question is: what needs to be changed in the fiddle so that when the user changes their option type, it only displays the text inputs of those buttons which are still on after option has changed?
when you choose a option your code cleans the number box and the letters get changed ok.
The logic you apply to letters with class 'answerBtns answers' need to be apply also to the letter at the bottom. You must apply a class and do de process in javascript when get another choose.
I have a form which consists of multiple panels. Each panel is collapsed (display:none) until the user touches the caption/bar to uncollapse it, except the first. So my problem is when I get to the last input on my expanded form I can't focus on the next input element(with the next button on iOS) because it's not displayed. Im thinking a invisible element after the last element on my form, that when it gains focus it expands the collapsed panel underneeth. Hope that makes sense.
Regards.
Thanks guys but I figured it out. I used an input at the last element in the form to detect focus and collapse the next panel. Like done here http://www.webdeveloper.com/forum/showthread.php?t=130036
Tnks