Hi,

I am having a really odd issue. For some reason when I limit the quiz to the params below the next button appears twice.

Double next

Quiz config:

Quiz config

Note: I am using a Drupal 7 vanilla install with the Bootstrap theme

What am I missing?

CommentFileSizeAuthor
#10 Screen Shot 2015 11 17 at 12.21.15 PM.png19.36 KBManjit.Singh
Screen Shot 2015-11-17 at 12.21.15 PM.png142.69 KBemilorol
Screen Shot 2015-11-17 at 12.19.37 PM.png22.92 KBemilorol
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

emilorol created an issue. See original summary.

emilorol’s picture

emilorol CreditAttribution: emilorol commented
djdevin’s picture

djdevin
Location Philadelphia
CreditAttribution: djdevin at Cadmium commented

Just guessing but one of the buttons may have a "js-hide" class on it, for when the user presses Enter - in the case where the first button is actually "Back" or "Leave blank".

Maybe the theme isn't hiding it.

emilorol’s picture

emilorol CreditAttribution: emilorol commented

This is the HTML of each button:

<button type="submit" id="edit-submit-hidden" name="op" value="Finish" class="btn btn-default form-submit">Finish</button>

<button type="submit" id="edit-submit" name="op" value="Finish" class="btn btn-default form-submit">Finish</button>

The only different thing is the "-hidden" on the ID. Also there is not JS error or warning.

djdevin’s picture

djdevin
Location Philadelphia
CreditAttribution: djdevin at Cadmium commented

#edit-submit-hidden is supposed to make the button not visible, but allow it to be activated.

This is in quiz.css so it appears that the theme is overriding this somehow.

input#edit-submit-hidden {
  height: 0;
  width: 0;
  overflow: hidden;
  padding: 0;
  border: none;
}
emilorol’s picture

emilorol CreditAttribution: emilorol commented

The problem is not the theme overriding the CSS, but the HTML. Bootstrap will make the input submit a button so the CSS rule will not apply. The following correction will fix the issue for themes using Bootstrap:

input#edit-submit-hidden, 
button#edit-submit-hidden {
    height: 0;
    width: 0;
    overflow: hidden;
    padding: 0;
    border: none;
}

Thank you.

Manjit.Singh’s picture

Manjit.Singh
Primary language Hindi
Location Chandigarh
CreditAttribution: Manjit.Singh at Srijan | A Material+ Company commented

Hey emilorol, I have tried to reproduce this issue in vanilla drupal 7 with Bootstrap 7.x-3.5 theme. But I have not seen any issues related what you have described.
Can you please tell me what i am missing ?

emilorol’s picture

emilorol CreditAttribution: emilorol commented

Did you set up the quiz settings like I show on the screenshot?

Manjit.Singh’s picture

Manjit.Singh
Primary language Hindi
Location Chandigarh
CreditAttribution: Manjit.Singh at Srijan | A Material+ Company commented

I have not found the feedback section at backend.
Can you explain, how it got there. Is there any need to enable some other module ?

Manjit.Singh’s picture

Manjit.Singh
Primary language Hindi
Location Chandigarh
CreditAttribution: Manjit.Singh at Srijan | A Material+ Company commented
FileSize
Screen Shot 2015 11 17 at 12.21.15 PM.png19.36 KB

dwe

jdearie’s picture

jdearie CreditAttribution: jdearie commented

I was having the same problem - except my mystery button didn't have any text. It was an HTML issue as #6 stated, but I had to add ".answering-form" for the CSS/HTML to stick with my custom theme.

.answering-form input#edit-submit-hidden,
.answering-form button#edit-submit-hidden {
    height: 0;
    width: 0;
    overflow: hidden;
    padding: 0;
    border: none;
}
xiangrikuiyy’s picture

xiangrikuiyy CreditAttribution: xiangrikuiyy commented

My html for the double next buttons look different. Here is the html code

<div data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-icon="null" data-iconpos="null" data-theme="d" class="ui-btn ui-shadow ui-btn-corner-all ui-submit ui-btn-up-d" aria-disabled="false"><span class="ui-btn-inner ui-btn-corner-all"><span class="ui-btn-text">Next</span></span><input type="submit" id="edit-submit-hidden" name="op" value="Next" class="form-submit ui-btn-hidden" aria-disabled="false"></div>

<div data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-icon="null" data-iconpos="null" data-theme="d" class="ui-btn ui-shadow ui-btn-corner-all ui-submit ui-btn-up-d" aria-disabled="false"><span class="ui-btn-inner ui-btn-corner-all"><span class="ui-btn-text">Next</span></span><input type="submit" id="edit-submit" name="op" value="Next" class="form-submit ui-btn-hidden" aria-disabled="false"></div>

I am using the quiz module with jquery mobile.