MVC - Multiple Modals of Dynamyc Content?

Question

I have a best practice question. I have a page with many chat rooms. When you click on a chat room a modal prompts asking for a nickname and VIA post gets the information and takes you to the room.

The questions is, I have multiple rooms so I have one modal:

@using (Html.BeginForm("DebateV2", "Home", FormMethod.Post)){

@Html.AntiForgeryToken()
<div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">

        <!-- Modal content-->
        <div class="modal-content ">
            <div class="modal-header modal-header-primary">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 id="modalTitle">
                    <span class="glyphicon glyphicon-lock pull-left"></span> @Resources.IngresoALaGrieta
                </h4>
            </div>
            <div class="modal-body" style="padding:40px 50px;">
                <form role="form">
                    <div class="form-group">
                        <label for="Nickname"><span class="glyphicon glyphicon-user"></span> @Resources.ElejiNombre</label>
                        <input type="text" class="form-control" id="Nickname" name="Nickname" placeholder="@Resources.ElejiNick">
                    </div>
                    <input type="hidden" id="Debate" name="Debate" />
                    <input type="hidden" id="Team" name="Team" />

                    <button type="submit" id="connect" disabled="disabled" class="btn btn-success btn-block"><span class="glyphicon glyphicon-fire"></span> @Resources.Entrar</button>
                </form>
            </div>
        </div>
    </div>
</div>

}

And when the button is clicked it appends some information about the chatroom to the modal form, like this:

  $('.open-modal')
            .each(function() {
                var $this = $(this);

                $this.on("click",
                    function() {
                        $("#Debate").val($(this).data('debate'));
                        $("#Team").val($(this).data('team'));
                        $("#modalTitle").val($(this).data('titulo'));

                        $('#myModal').modal('show');
                    });

            });

Now I want to send some information via QUERYSTRING so I have in the browser address the name of the room like this:

www.debates.com/debate?debate=debate-name

what is the best practice to do that? I am really lost.