I work for a company for which you can log into its system and depending on the options selected from a dropdown menu, the system shows you different things. Let’s say if I worked for a restaurant company, the system always shows the same structure but with different data for the different food items for the restaurant you selected. I know how to replicate this, the problem is I don’t know how to replicate this while keeping the same visible url, which the existing system does.

I’m trying to allow users to switch ‘restaurant’ and ‘restaurant company’ without logging out and logging back in again. So I’ve took the code for the login page, but removed the individual details so the user just inputs restaurant and company. I’ve successfully wrote the html/css for this and the php to dynamically load the options into the dropdown from a local mysql database. However, in the existing system no matter what option you pick, the url is always the same. No extensions, just the same home url. Below is (what I think is) all the javascript the original, working page uses to achieve this. I have changed specific text or element names for privacy and got rid of the INCESSANT whitespace (idk why people spread their code across the circumference of the Earth) but the rest is unchanged.

Obviously it doesn’t work if I just use the exact same code but I don’t understand it enough to develop it for my need. I can’t see anything that seems to dynamically supply all of the HUNDREDS of different elements in the system with their corresponding data for that restaurant. As I say, this could easily be achieved by giving every restaurant it’s own url, but they don’t, and I don’t what else was done to achieve this.

    $(document).ready(function()
    {



        $('input[name='company_name']').keydown(function(event){ 
            var keyCode = (event.keyCode ? event.keyCode : event.which);   
            if (keyCode == 13) {               
                var company_select  = $(this);
                var company_name = company_select.val();
                if(company_name == ''){
                    $('.company_error').html('<label for="company_name" generated="true" class="error">*This field is required.</label>');

                return false;
                } else{
                    $('.company_error').html('');
                }


                if(company_name === "super admin") {                  
                    $('.company_error').html('');
                    $('select[name='home']').closest('.form-group').addClass('inp-hide');
                   $('input[name='username']').closest('.form-group').removeClass('inp-hide');
                   $('input[name='password']').closest('.form-group').removeClass('inp-hide');
                    $('.btn-login').removeClass('inp-hide');
                    return false;
                }
                company_select.addClass('spinner');

              

                $.ajax({
                    type: 'get',
                    url : "{{ url('get-restaurants') }}"+'/'+company_name,
                    success:function(resp){                    
                        if(resp != ''){                     
                            $('select[name='restaurant'] option').remove();
                            $('select[name='restaurant']').append('<option value="">Select restaurant</option>'+resp);
                            $('select[name='restaurant']').removeClass('inp-hide');                         
                        } else{
                            $('.company_error').html('<label for="company_name" generated="true" class="error">Company Name is not correct.</label>');
                            $('select[name='restaurant']').addClass('inp-hide');
                            $('input[name='username']').addClass('inp-hide');
                            $('input[name='password']').addClass('inp-hide');
                            $('.btn-login').addClass('inp-hide');                  
                            $('.login-wrap').removeClass('login-trans-bg');
                        }
                        company_select.removeClass('spinner');
                    }
                });
                return false;
            }
        });
    });
</script>




<script>
$(document).ready(function()
{
    $('select[name='restaurant']').change(function(event){ 
        var restaurant_id = $(this).val();
        if(restaurant_id != ''){
            $('input[name='username']').removeClass('inp-hide');
            $('input[name='password']').removeClass('inp-hide');
            $('.btn-login').removeClass('inp-hide');
            $('.login-wrap').addClass('login-trans-bg');
        } else{
            $('input[name='username']').addClass('inp-hide');
            $('input[name='password']').addClass('inp-hide');
            $('.btn-login').addClass('inp-hide');
            $('.login-wrap').removeClass('login-trans-bg');
        }
    return false;
    });
});
</script>




<script >
    $(function() {
        $("#login_form").validate({ 
            rules: {
                company_name:"required",
                username:"required",
                password: "required"  
            },
            submitHandler: function(form) {
              form.submit();
            }
        }) 
    });
</script>```