Как сделать Submit формы в модальном окне?

Question

[DooglsGo]

Нужна помощь, сделал я форму вопросов снизу кнопка которая вызывает через Java Script модальное окно, а в самом окне уже кнопка отправки формы. Но почему-то она не работает но, если модалку не вызывать то-есть она будет на странице в самом начале, форма отправляется. Использую Semantic UI

<div class="ui segment" style="min-height: 8rem; margin-bottom: 2rem !important;">
              	<div class="ui top attached label"><i class="checkmark box icon"></i> <?php echo $test['trname'] ?></div>
              
              	<p>
                	<center>
                  		<?php if ($test['status'] < 2) { ?>
				            <?php echo _('Тик-так&hellip; Время пошло, и помни, списывать не хорошо!') ?><br><br>
                  		<?php } elseif ($test['status'] >= 2) { ?>
				        	Вы отправили тест на проверку <?php echo date("d.m.Y в H:i", strtotime($test['completed_date'])) ?>, тест был решён за <?php echo ((int)((strtotime($test['completed_date']) - strtotime($test['recived_date']))/60)) . ":" . str_pad((strtotime($test['completed_date']) - strtotime($test['recived_date']))%60, 2, 0, STR_PAD_LEFT) ?>.<br>
                  			<?php if ($test['status'] == 3) { ?>
				            	Тест был проверен инструктором <a href="/profile/<?php echo $test['reviewer'] ?>"><?php echo htmlspecialchars($test['reviewer_nickname']) ?></a> <?php echo date("d.m.Y в H:i", strtotime($test['review_date'])) ?>, результат теста: <?php echo $rating[$test['passed']] ?>.<br><br>
                    			<?php if ($test['note'] != '') { ?>
                    				<?php echo _('Комментарий инструктора:') ?><br><b><?php echo 
                                               htmlspecialchars($test['note']) ?></b><br><br>
                  		<?php }}} ?>
               		</center>
              	</p>
                
              	<form method="post">
                	<div class="ui form">
                  		<?php foreach ($questions as $number => $question) { ?>
              				<div class="field">
                    			<label style="text-align: center;"><?php echo htmlspecialchars($question) ?> <?php 
                                        if($answers_marks and (isset($answers->$number) or isset($answers[$number]))) echo 
                                        $marks[((isset($answers_marks->$number))?$answers_marks->$number:$answers_marks[$number])] 
                                        ?></label>
                    		        <textarea name="<?php echo 'answer' . $number ?>" rows="4" style="margin-top: 0px; margin- 
                                        bottom: 0px;<?php if($answers_marks and (isset($answers->$number) or isset($answers[$number]))) 
                                        echo ' border-color: '.$marks_color[((isset($answers_marks->$number))?$answers_marks- 
                                         >$number:$answers_marks[$number])].';' ?>"<?php if ($test['status'] >= 2) echo " readonly" ?>><?php 
                                         echo htmlspecialchars(($answers)?(isset($answers->$number))?$answers- 
                                         >$number:$answers[$number]:'') ?></textarea>
                  			</div>
              			       <?php } ?>
              			        <?php if ($test['status'] < 2) { ?>
                  			        <div class="field" style="margin-top: 25px;">
                    			               <center><a class="ui fluid primary button open-modal">Отправить</a></center>
                  			        </div>
              			       <?php } ?>
              			
                		<!-- Модал -->
                		<div class="ui modal">
                			<i class="close icon"></i>
                  			<div class="header" style="font-size: 21px;">
                    			Сдача теста
                  			</div>
                  			<div class="content">
                    			<p style="font-size: 16px;"><b>Вы уверены?</b><br>Сдавать тест можно лишь раз в 3 часа! 
                                       <br>Обязательно проверьте свои ответы перед отправкой!</p>
                  			</div>
                  			<div class="actions">
                    			<center><button class="ui fluid primary submit button" type="submit" name="submit" value="1"><? 
                                        php echo _('Отправить тест') ?></button></center>
                  			</div>
                  		</div>
                  	</div>
              	</form>
            </div>
            <script>
             	btn = $('.open-modal'),

              	btn.on('click', function() {
                	$('.ui.modal')
                  	.modal('show');
              	});

              	$('.submit.button').on('click', function() {
     				$('form').submit();
				});
            </script>

Answer 1

[lamer350]

потому что кнопка submit должна быть внутри формы (тега <form>), а вы скорее всего модальное окно где то в конце страницы создаете.
Повесьте обработчик на jquery

$('button.submit').on('click', function() {
     $('form').submit();
});

Comments

[DooglsGo]

Модал в форме, могу скинуть прям весь код, но он будет большеват

Answer 2

[AUser0]

Начало формы <form ...> находится где-то в небытие. Возможно в этом и проблема.