ci_lover - 11 months ago 32
jQuery Question

# How to prevent submit last questionof a form if there is no answer

I have a form of a survey with questions. First I hide all questions and I show one after another with button Next. I've made validation and it works but only for the last question it is not working. I've provided also Php validation if someone doesn't have JavaScript enabled. Now when you have not chosen an answer for the last question,it does not submit form, but it returns to the first question of survey and you have to choose them again. That's my problem - how to validate last quesion? Here's my code:

$(function () {$( document ).ready(hideAllRows);
$( document ).ready(showFirst);$('#button').hide();
});

function hideAllRows(){
$('#questionsTable tr').each(function() {$(this).hide();
});
}

$(function () {$("#next").click(showNextQuestion);
});

var currentInd = 1;
var prevInd = 1;
function showNextQuestion(){
$(function () { var indId = "#"+currentInd; prevInd = currentInd - 1; var prevId = "#"+prevInd; //validation var isAnyClicked = false;​ if ($(prevId + " input[type='radio']:checked").val()) {
isAnyClicked = true;
}

if(currentInd > 0 && currentInd  != $('#questions_count').val() && isAnyClicked == false) { alert('Моля, отговорете!'); } else { //hide previous question$(prevId).hide();

//show next question
var indId = "#"+currentInd;
$(indId).show(); currentInd++; if(currentInd ==$('#questions_count').val()) {
$('#button').show();$("#next").hide();
}
}
});
}

function showFirst(){
$(function () {$('#0').each(function() {
$(this).show(); }); }); }  . <?php$att=array('id'=>'form');
echo form_open('index/survey_fill/' .$survey_id .'/'.$question_id , $att); ?> <input type='hidden' name='questions_count' id='questions_count' value='<?php echo count($question); ?>' />
<table id='questionsTable' >
<tr><th>Question</th></tr>
<tbody>
<?php
echo validation_errors();​
$index = 0; foreach ($question as $row) { echo "<tr id='$index'>";
$index++; ?> <td> <?php echo "$row->question"; ?><br/>
<?php echo "<input type='hidden' name='question_id' value='$row->question_id' />"; ?> <?php$data=array(
'name' =>  'answer['.$row->question_id.']', 'value' => '5', 'class' => 'answer' ); echo "<input type='hidden' name='survey_id' value='$row->survey_id'>";

echo form_radio($data); echo " 5 ";$data=array(
'name' =>  'answer['.$row->question_id.']', 'value' => '4', 'class' => 'answer' ); echo form_radio($data);​
echo "4";
</td></tr>

<?php
}

?>

</table>
<?php echo "<input type='hidden' name='question_id' value='$row->question_id' />"; ?> <?php echo '<input type="submit" id="button" name = "submit" value="Submit" class="btn btn-success">'; ?> <input type="button" id="next" name = "next" value="Next" class="btn btn-success"> </form> </div> </body>​  I tried with this: $(document).ready(function() {
var currentInd=1;
$('form').on('submit', function(e){ isAnyClicked = false; if (currentInd =$('#questions_count').val() &&
($(currentInd + " input[type='radio']:checked").val())) { isAnyClicked = true;$(currentInd ).hide();
} if (currentInd  = $('#questions_count').val() && isAnyClicked == false) {$('tr' + currentInd).css({ display: 'block' });

e.preventDefault();
currentInd++;
}
});
});​


It prevents form submit, but even I have selected answer, form does not submit. How to make first condition if you have chosen answer, form to subit? It always run second condition and form does not submit. Thanks!

$(document).ready(function() {$('form').on('submit', function(e){