Laravel和隐藏的输入

时间:2017-04-30 01:49:59

标签: javascript php jquery css laravel

我想在Laravel(默认搭建)中进行注册页面,只需稍加调整即可。我的输入上面有两个单选按钮,我在这里挣扎着javascript。访客用户有两个选项,(用户或公司),如果用户将选择"公司"按钮它应该显示不同于"用户"具有。现在我一直在谷歌看几个小时,最好的方法是做什么,但我尝试的一切都不起作用。我吮吸javascript ..

我尝试过类似测试的东西,但看起来我又走错了路。

$(document).ready(function() {
    if (document.getElementById('user').checked) {
        document.getElementById('#name').display = 'block';
    } else if (document.getElementById('company').checked) {

    }
});

2 个答案:

答案 0 :(得分:1)

使用步骤和代码的简单方法:

1)将您的用户和公司输入字段包装在组类中:

<input type="radio" name="option" id="user_radio_option">
<input type="radio" name="option" id="company_radio_option">
<div class="group" id="user-group">
    <!-- user input fields here -->
  <h1>User Group</h1>
</div>
<div class="group" id="company-group">
    <!-- company input fields here -->
  <h1>Company Group</h1>
</div>

2)使用JQuery显示或隐藏创建的组,如:

$("#user_radio_option").click(function(){
    $("#user-group").css("display", "block");
    $("#company-group").css("display", "none");
});
$("#company_radio_option").click(function(){
    $("#company-group").css("display", "block");
    $("#user-group").css("display", "none");
});

3)最初使用css隐藏:

.group{
  display:none;
}

4)由于您在控制器中使用Laravel,您可以执行以下操作:

if($request->has('some_user_field')){
    //do validation for user
}else{
    //do validation for company
}

当然有一种更优雅的方法可以做到这一点但是因为这是一个简单的任务,而且你是JQuery的新手,这是我几年前在我刚接触JQuery时如何完成它的和Javascript。如果用户使用制表符和箭头选择您的收音机,这也应该有用。

请参阅以下工作示例:https://codepen.io/ocanodiego/pen/ZKKyRR

答案 1 :(得分:0)

尝试这样的东西,2个收音机就像:

<input type="radio" name="user_type" value="1" class="user_type"> User
<input type="radio" name="user_type" value="2" class="user_type"> Company

Jquery的:

$(document).ready(function() {
    $('.user_type').change(function(){
        if( $(this).val() == 1 )
        { 
            // User section code here
        }
        else
        { 
            // Company section code here
        }
    });
});