【发布时间】:2017-12-29 12:41:06
【问题描述】:
我需要帮助来改变
<input type="button">
到
<input type="submit">
所以我可以使用
轻松验证我的表单 if(isset($name_of_submit_button)){
if(!empty($_POST['input_text_name'])){
/* code that will go to the next radio button */
}}
我尝试转换它,但问题是每当我将其更改为提交按钮时,下一个按钮结果会出现故障并且不会转到下一个单选按钮。
这是我的表单的图像
我希望这个 div 的下一个按钮是一个提交按钮,这样我就可以验证 div 的输入框,这些是我想要发生的:
- 如果不是所有字段都填充了数据,它将不会转到下一个单选按钮。
- 如果所有字段都填写了数据,则可以进入下一个单选按钮。
这些是我的代码:
HTML *注意:我这里只使用了两个单选按钮来缩短代码
<form action="reservation_next_sample.php" method="POST">
<input type="radio" name="next[]" value="1" checked="checked">
<input type="radio" name="next[]" value="2" />
<div id="next1" class="desc">
<div class="div-details">
<h4>Event's Detail</h4>
<table>
<tr>
<td>
Street
</td>
<td>
<input type="text" name="event_street">
</td>
</tr>
<tr>
<td>
Barangay
</td>
<td>
<input type="text" name="event_brgy">
</td>
</tr>
<tr>
<td>
Town/City
</td>
<td>
<input type="text" name="event_town_city">
</td>
</tr>
<tr>
<td>
Province
</td>
<td>
<input type="text" name="event_province">
</td>
</tr>
</table>
<br>
<button type="button" onclick="dayNavigation('next');" data-role="none" class="slick-prev" aria-label="Next" tabindex="0" role="button">Next</button>
</div>
<div id="next2" class="desc" style="display: none;">
<p> inside of next 2 </p>
<button type="button" onclick="dayNavigation('prev');" data-role="none" class="slick-next" aria-label="Previous" tabindex="0" role="button">Previous</button>
<button type="button" onclick="dayNavigation('next');" data-role="none" class="slick-prev" aria-label="Next" tabindex="0" role="button">Next</button>
</div>
</form>
JAVASCRIPT *注意:此代码是下一个和上一个按钮,当它们的单选按钮被选中时显示和隐藏 div。
<script>
$(document).ready(function() {
$("input[name$='next[]']").click(function() {
var test = $(this).val();
$("div.desc").hide();
$("#next" + test).show();
});
});
//this is in the bla bla next and previous -->
var index = 0;
dayNavigation = function(direction) {
var curr = $('input[name="next[]"]:checked');
if (direction == 'next') {
curr.next().attr("checked", "checked");
curr.next().click();
} else {
curr.prev().attr("checked", "checked");
curr.prev().click();
}
};
</script>
我没有 PHP 代码,因为我还不能将其转换为提交按钮
【问题讨论】:
-
您是否希望最后一个“页面”显示提交而不是下一个?这是你的问题吗?
-
不,我希望下一个按钮成为提交按钮,以便验证表单的输入框。
-
但只有最后一个,对吧?
-
例如上图。在该 div 中填写所有字段之前,下一个按钮不会转到下一个单选按钮。
-
如果点击下一个并且字段填充了数据,那么它可以转到下一个单选按钮。
标签: javascript php jquery html forms