如何在涉及模态时将<a href..>的值/名称检索到PHP变量

Question

I have a modal that is common to all the href links, but I need to pass the value of the href so that I can set a PHP session variable to further use info of the href clicked.

For example: If I click href Tokyo, I need to set a session variable 'prefecture' to 'Tokyo', if I click 'Kanagawa', 'prefecture' = 'Kanagawa'

I cannot use GET as I am calling a modal that is common to all the href links, or may be I am unaware of an efficient method. Here is the code,

HREF LINKS

<section id="area">
            <div class="container inner">
                <div class="train-line">
                    <div class="row">
                        <h2> Kanto Area </h2>
                        <a href="#modal-work03" data-toggle="modal" name="tokyo" id="1" class="btn btn-large">Tokyo</a>
                        <a href="#modal-work03" data-toggle="modal" name="kanagawa" id="2" class="btn btn-large">Kanagawa</a>
                        <a href="#modal-work03" data-toggle="modal" name="chiba" id="3" class="btn btn-large">Chiba</a>
                        <a href="#modal-work03" data-toggle="modal" name="saitama" id="4" class="btn btn-large">Saitama</a>
                        <a href="#modal-work03" data-toggle="modal" name="ibaraki" id="5" class="btn btn-large">Ibaraki</a>                           
                    </div>
                </div>
            </div>
</section>

MODAL

    <div class="modal fade" id="modal-work03" tabindex="-1" role="dialog" aria-labelledby="modal-work03" aria-hidden="true">

. . .

Please advice on how to set a PHP session variable when a particular href link is clicked, so that I can use that info on other PHP pages.TIA

Answer 1

Add the onlclick event to your anchors:

<a href="#" data-toggle="modal" name="tokyo" id="1" class="btn btn-large"  onclick="setSessionVariable('Tokyo');return true;">Tokyo</a>

Add a javascript function (use jQuery or plain javascript) to the same page or in your included js file:

jQuery function:

function setSessionVariable(varname) {
    $.ajax({url: "setsession.php?vname="+varname, success: function(result){
        alert("ajax function success: " + result);
    }});

Javascript only function:

    function setSessionVariable(varname) {
        var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
               document.getElementById("demo").innerHTML = this.responseText;
            }
        };
        xhttp.open("GET", "setsession.php?vname="+varname, true);
        xhttp.send();
    }

Add a php file called 'setsession.php'. In the file you get the request var and set the session variable:

<?php 
session_start();
$_SESSION['prefecture'] = $_REQUEST['vname'];
echo("success");
exit(0);
?>

Of course you will want to do some validation and other stuff but that is up to you.

UPDATE

Changed &vname to ?vname